大周H前端学习day2

HTML5的基本理论

• HTML是何方神圣？
  HTML不是一门编程语言，而是一种用于定义内容结构的标记语言。他是有一系列元素组成这些元素可以用来包裹不同的部分内容，使其以某种方式呈现或工作。

• HTML网页的组成部分
  一个HTML网页是由一个主页（index.html结构化标准语言)、一个图片文件夹（imgaes)、一个样式表文件夹（styles表现式标准语言）和一个脚本文件夹（scripts行为标准语言)

• HTML标签语法
  1.开始标签：包含元素名称，被大于小于所包围。表示元素从这里开始或者开始起作用
  2.结束标签（Closing tag）：与开始标签相似，只是在元素前加了一个斜杆表示这段元素结尾。
  3.内容：元素的内容就是网页里所呈现的信息。
  4.元素：开始标签、结束标签、内容结为一体便是一个完整的元素。
  5.文档类型和标准取值HTML表示这是H5，浏览器就按H5标准来解析网页。
  6.html元素该元素包含整个页面内容，也称根元素。
  7.head元素，该元素的内容对用户不可见，其中包含搜素引擎、关键字、页面描述是、css样式和字符编码等。
  8.meta charset="utf-8"指定国际字符编码必须写在title前。
  9.单标签link/,双标签html /html
  10.body元素包括文本、图像、视频、游戏、可播放的音轨或其他内容。

• 常用的服务器软件
  ITS，tomcat，apache，nodejs，

• 访问服务器的方式
  域名：http://www.qq.com:8。ip：端口号 172.16.2.56：8080
  默认对的端口号都是80，可以省略不写，但是如果端口不是80，访问网站就必须写端口号。

• 三模式
  1.stict严格模式
  2.transitional松散模式
  3.frameset框架模式

<!–超链接的标签：a

1. href="",超链接到新页面的网址，通过路径来描述目标网页的地址。如<a href="" target< /a> 在原窗口显示新的网页.
2. < a href="" target="_black">< /a>在新的窗口显示.
3. < a href="" target="_self">< /a>在当前自己这个窗口显示.
4. < a href="" target="_top">< /a>当有多个窗口进行嵌套时显示最外层窗口。
5. < a href="" target="_parent">< /a>在父级窗口中显示页面.
6. href="" target=“窗口名称”>< /a>在指定窗口中显示页面。

<！–图片标签>:img

1. src=""图片来源地址，使用相对路径表示，还可以使用网络地址表示。
2. width：设置图片宽度。
3. height：设置图片高度。
4. alt=“”如果图片加载失败则使用alt的值来显示说明图片内容，有助于SEO。
   title=“”鼠标指向图片时显示该内容SEO。

<!列表标签>:ul，ol，li，dl，dt，dd

1. ul：无序列表
2. ol：有序列表
3. li：具体列表项

<!格式化文字样式标签>：

1. b，strong：加粗
2. i,em:斜体
3. u:下划线
4. del：删除线
5. sup、sub：上下标

< H1>标题标签

数字越大，字号越小，其中H4是浏览器默认字号，即16像素。

< Hr/>分割线标签

水平分割线，显示出一条水平的直线，长度等同于所在块元素宽度的100%。

p标签

自然段落标签:< p/> < p>< /p>
注意默认不会首行缩进，需要使用css来设置缩进。
上下分别有着16px的留白。

div标签

没有特殊属性，往往用来进行页面的结构布局。

pre标签

预格式化标签：< pre>< /pre>
标签中的内容会按照在开发工具中的位置和内容来显示。同时默认会将标签类容中的字号变小。

table 标签

表格标签：< table>< /table>
表格标题：< caption>< /caption>
表头：< thead>< /thead>
表主体：< tbody>< /tbody>
表尾：< tfoot>< /tfoot>
行：< tr>< /tr>
单元格：< td>< /td> 文字默认垂直方向居中显，水平靠左显示。
标题文字：< th>< /th> 文字默认加粗并水平居中。
border=“设置边框的粗细”
width=”设置宽度“
height=”设置高度“
align=”设置表格文本的位置，center为水平对齐，left为向左对其，right为向右对齐。“
cellpadding=”设置td标签边框与内部文字的距离。“
cellspacing=” 设置每个单元格间距。“
background=”添加背景图片。“
bgcolor=”设置表格的背景色。“

注：thead tbody tfoot 的最终显示都是以 thead tbody tfoot的顺序从上到下显示。
在tbody tr td中都可以使用align属性。
tr无法用width属性。
标签的关系：table> caption,thead,tbody,tfoot> tr> td ,th
colspan=”设置从左向右合并（横向合并），如果是4则表示合并4列，后面如果有多余的要删除。“
rowpan=”从上向下合并（纵向合并），合并后如果有多余的要删除。“
注：一个单元格可以跨多行多列。

总结

虽然记得东西很多但是好在容易理解，了解HTML网页的标签属性，记住网页常用的标签属性，才能在后面学习中轻松快速的编写网页和掌握当天的知识点。