HTML
标记语言为非编程语言
负责完成页面的结构
组成：
标签：被<>包裹的由字母开头，可以结合合法字符（ -|数字 ），能被浏览器解析的特殊符号，标签有头有尾
指令：被<>包裹的由 ! 开头
转义字符：
空格 < : < > ： >
页面模板
<!doctype html> <!--页面开始--> <html> <!--头--> <head> <!--字符编码--> <meta charset="utf-8"> <!--页面标签的标题--> <title>页面</title> <!--内部或外部的css样式 | js脚本 | 页面其他设置 --> </head> <!--身体--> <body> <!--存放给展示用户的内容--> xx </body> <!--页面结束--> </html>
常用标签
最常用标签:没有语义，也没有特殊功能，也没有特殊样式
<div></div>
换行标签: <br> 标题标签: h1 - h6 段落标签: <p>xxx</p> 段落与段落之间间隔很大
文本标签：同行显示
span 文本标签
i 斜体
em 斜体方式强调
b 加粗
strong 加粗方式强调
sup 上角标
sub 下角标
超链接标签：a
<a href="连接地址" target="_blank">超链接</a> href="连接地址" arget="_blank/_self" 属性表示新开一个窗口
锚点：快速定位到页面指定位置
<a name='top'></a> 通过 a 的 name 设置锚点
<a href='#top'>返回Top</a> 再通过 a 的 href 属性转跳到锚点位
图片标签
<img src="图片地址" alt="资源加载失败显示的文字" title="鼠标悬浮显示文字提示">
列表标签： ul ol
有序： <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> 无序： <ol> <li></li> <li></li> <li></li> <li></li> <li></li> </ol>
表格标签 table
border: 表格边框宽度
cellspacing: 单元格之间的距离
rules: all(全部) | groups(组线) | rows(行线) | cols(列线)
cellpadding: 内容距上距左的距离
<table border="10" width="500" height="300" cellspacing="0" rules="all" cellpadding="20">
<caption>表格标题</caption>
<thead>
<tr>
<!--th{标题}*3-->
<th>标题</th>
<th>标题</th>
<th>标题</th>
</tr>
</thead>
<tbody>
<!--(tr>td{单元格}*3)*2-->
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
</tbody>
<tfoot>
<!--tr>td{单元格}*3-->
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
</tfoot>
</table>
了解
分割线： <hr> （了解） 显示文本：<pre></pre>
标签分类
单标签 br hr img meta link 功能具体，不需要内容，设置为单标签 eg:<link rel="stylesheet" href="">
双标签 h1 p span div 具有子标签，包含内容 eg:<h1>内容</h1>
css
负责页面的风格设计
选择器：由标签，类，id单独组合出现
作用域：一组打括号包含的区域
样式块：满足css连接语法的众多样式
css的三种引入方式
1.行间式
样式块写在标签的style的属性中 属性 与 属性 间用 ; 分号隔开 <div style="color: red"></div>
2.内联式
写在style标签中 用选择器与html建立连接 <style type="text/css"> .farther div { color: red; font-size: 100px; float: right; } </style>
3.外联式
css外式完全与html文件脱离，形成单独的.css文件，样式书写在.css文件中 用 link 标签将css文件与 html 建立连接 < link rel="stylesheet" href="" > rel="stylesheet" 表示连接什么样的文件，样式连接表
三种引入方式的执行顺序：
外联 < 内联 < 行间 行间式最后执行