Web前端基础 学习笔记
一、Html 基本结构
1.1、创建文件
Ctrl + N新建一个文件Ctrl + S保存，命名为 xxx.html- 右键 ，选择 Open in Brower（在浏览器中打开）
1.2、结构
我们已经安装了模块，所以一个感叹号 ! + Tab键 就可以直接生成下面整一块代码
注意点：
<!DOCTYPE hmtl>仅声明文档类型 非标签- .标签：尖括号包围关键字
- 标签通常成对出现
<开始标签> </结束标签>—> ”双标签” - 标签但也有单独成现的
(比如：<br>,<hr>,<meta>...)—> ”单标签/自闭和标签” - 元素：
<开始标签> 内容 </结束标签>—> 标签 + 内容 - 要显示的代码都是放到
<body> </body>里的 ( 粘贴代码的时候我就只放内容了 )
二、基础标签
2.1、标题标签 <h> </h>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
</head>
<body>
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3>我是h3</h3>
<h4>我是h4</h4>
<h5>我是h5</h5>
<h6>我是h6</h6>
<hr>
</body>
</html>
2.2、<p> 标签
语法： <p align=""></p> ( left：左对齐，right：右对齐，justify：两端对齐 )
<P align="left">我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。</P>
<P align="right">我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。</P>
<P align="justify">我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。</P>
<hr>
<!-- pre 标签会保留文字的格式 (如空格和换行符) -->
<pre>
我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。
我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。
我是小妖怪，逍遥又自在。杀人不眨眼，吃人不放盐。一口七八个，肚子要撑破。茅房去拉屎，想起忘带纸。
</pre>
<hr>
注意：
- 一个
<p></p>标签代表一个段落 - 在
<p></p>标签内，加上<br/>仅换行，但还是一个段落 - 输入的空格不起作用，
代表空格 <pre></pre>标签会保留空格和换行符
2.3、其他的一些效果标签
- 水平线：
<hr/>单标签 - 文字斜体：
<i></i>和<em></em> - 加粗：
<b></b>和<strong></strong> - 下标：
<sub> - 上标：
<sup> - 下划线：
<ins> - 删除线：
<del>
<p>我是大魔王</p>
<p><i>我是大魔王</i> <i>斜体</p>
<p><em>我是大魔王</em> <em>斜体</p>
<p><b>我是大魔王</b> <b>加粗</p>
<p><strong>我是大魔王</strong> <strong>加粗</p>
<p>我<sub>是大魔王</sub> <sub>下标</p>
<p>我<sup>是大魔王</sup> <sub>上标</p>
<p><ins>我是大魔王</ins> <ins>下划线</p>
<p><del>它是大魔王</del> <del>删除</p>
<hr>
2.4、常用的特殊号
<<>>®已注册©版权™商标 空格
<pre>
® & reg; 已注册
© & copy; 版权
™ & trade; 商标
& nbsp; 空格
</pre>
<hr>
6728
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
