一、字体样式
| 属性名 | 含义 | 举例 |
| font-family | 设置字体类型 | font-family:"黑体"; |
| font-size | 设置字体大小 | font-size:12px; |
| font-style | 设置字体风格 | font-style:italic; |
| font-weight | 设置字体的粗细 | font-weight:bold; |
| font | 在一个声明中设置所有字体属性 | font:italic bold 36px "黑体"; |
一次声明全部以上内容要按3421顺序 font: style weight size family ;
例：font: italic bold 36px "宋体";
二、文本样式
| 属性 | 含义 | 举例 |
| color | 设置文本颜色 | color :red; |
| text-align | 设置元素水平对齐方式 | text-align:right; |
| text-indent | 设置首行文本的缩进 | text-indent:20px; |
| line-height | 设置文本的行高 | line-height:25px; |
| text-decoration | 设置文本的装饰(下划线之类的) none、underline、overline | text-decoration:underline; |
三、超链接伪类样式
| 伪类名称 | 含义 | 示例 |
| a:link | 未单击访问时超链接样式 | a:link{color:red;} |
| a:visited | 单击访问后超链接样式 | a:visited{color:#333;} |
| a:hover | 鼠标悬浮其上的超链接样式 | a:hover{color:#ff7300;} |
| a:active | 鼠标单击未释放的超链接样式 | a:active{color:blue;} |
四、背景样式
background-color ——设置背景颜色 background-image:url('图片路径'); ——设置背景图片
background-repeat ——设置背景重复方式，其参数有 repeat全面重复覆盖 no-repeat不平铺，只显示一次； repeat-x/y 只向x或y方向平铺
五、列表样式
1.无序列表
<ul>
<li> 内容 </li>
</ul> 注意：无序列表无序，有前缀符号，可用
例：
<ul style="list-style: squa"> 注意：<ul style="list-style: 前缀符号形状"> squa是正方形 <li>我是陈京旗1</li> <li>我是陈京旗2</li> <li>我是陈京旗3</li>2.有序列表
<ol>
<li> 内容 </li>
</ol> 注意：有序列表 有前缀序号1 2 3........
例：
<ol>
<li>我是陈京旗1</li>
<li>我是陈京旗2</li>
<li>我是陈京旗3</li>
</ol>
3.自定义列表
<dl>
<dt>标题，可有可无</dt>
<dd>子内容</dd>
</dl>
例：
<dl>
<dt>a
<dd>我是陈京旗1</dd>
<dd>我是陈京旗2</dd>
</dt>
<dt>b
<dd>我是陈京旗1</dd>
<dd>我是陈京旗2</dd>
</dt>
</dl>
列表样式：
list-style-type —— 管理列表编号，无序默认是实心，有序是数字 参数有none(无标记符号) decimal(数字)等等
六、表格
<table border="2"> dorder代表着表格边框大小 colspan="合并列数" col代表着列的意思，这个colspan代表着合并列
<td> </td> —— 代表着一列
</tr>
例：
<table border="1">
<!--表格table，border是边框大小-->
<tr> <!--tr是行-->
<td colspan="3" >大数据32班学习成绩</td> <!--td是列单元格，-->
</tr>
<tr>
<td rowspan="2">陈京旗</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
<tr>
<td rowspan="2">吴天</td>
<td>语文</td>
<td>150</td>
</tr>
<tr>
<td>数学</td>
<td>150</td>
</tr>
</table>
七、表单
<form method="post" action="需要输出信息的地址">
<input type="text" name="username" value="用户名"> 所有表单类型中，type代表类型，不同类型不同效果。name代表着该表单的名字(不会主动在网页显示)。value代表该表单的值，若是文本框则代表文本框初始值。
</form>
| 属性 | 说明 |
| type | 指定元素的类型：text(文本框)、password、checkbox(多选按钮框)、radio(单选按钮框)、submit、reset、file、hidden、image、button，默认为text |
| name | 指定表单元素的名称 |
| value | 元素的初始值。type为radio时必须指定一个值 |
| size | 指定表单元素的初始宽度。当type为text或password时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位 |
| maxlength | type为text或password时，指定输入的最大字符串数 |
| checked | type为radio或checkbox时，指定按钮是否是被默认选择 |
注意：若选择radio或submit时，其name必须一致，否则后续录入信息时不匹配等情况;
例：
<!--form表单--><!--<form action="传到目的地址" method="传值方式post">-->
<form action="表格.html" method="post">
<p>
用户名：<input type="text" name="name">
</p>
<p>
<!--maxlength最大长度-->
密码：<input type="password" name="pwd maxlength="6">
</p>
<p>
<input type="submit" value="确定"> <input type="reset" value="重置"> </p>
<!--复选框-->
<p> <!--checked默认选中-->
<input type="checkbox" name="spots" checked>篮球
<input type="checkbox" name="spots">足球
<input type="checkbox" name="spots">羽毛球
</p>
<!--单选框-->
<p>
<input type="radio" name="affair">洗澡
<input type="radio" name="affair">吃饭
<input type="radio" name="affair">睡觉
</p>
</form>