5.17css

文字CSS样式：

属性名	含义	举例
font-family	设置字体类型	font-family:"黑体";
font-size	设置字体大小	font-size:12px;
font-style	设置字体风格	font-style:italic;
font-weight	设置字体的粗细	font-weight:bold;
font	在一个声明中设置所有字体属性	font:italic bold 36px "黑体";

文本css样式：

属性	含义	举例
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;

超链接伪类css样式：

伪类名称	含义	示例
a:link	未单击访问时超链接样式	a:link{color:red;}
a:visited	单击访问后超链接样式	a:visited{color:#333;}
a:hover	鼠标悬浮其上的超链接样式	a:hover{color:#ff7300;}
a:active	鼠标单击未释放的超链接样式	a:active{color:blue;}

若要设置多个伪类样式，请按照从link到active的顺序排放，否则部分样式无效。

背景css样式设置：
background-color   ←设置背景颜色                                         background-image:url('图片路径');    ←设置背景图片
background-repeat ←设置背景重复方式，其参数有 repeat全面重复覆盖  no-repeat不平铺，只显示一次 repeat-x/y 只向x或y方向平铺

列表：
无序列表 <ul>                                           有序列表<ol>                                                     自定义列表<dl>
                <li>        </li>                                             <li>          </li>                                                   <dt>标题</dt>
                </ul>                                                          </ol>                                                                      <dd>子内容</dd>
                                                                                                                                                               </dl>

列表css样式：
list-style-type←管理列表编号，无序默认是实心，有序是数字   参数有none(无标记符号) decimal(数字)等等

表格：

<table border="2">    dorder代表着表格边框大小     colspan="合并的个数"  col代表着列的意思，这个colspan代表着合并列
 <tr>    ←代表着一行                                                   rowspan="合并个数"   row代表着行的意思，这个代表着合并行
<td> </td>    ←代表着一列
</tr>

 </table>

<!--<table border="2">-->
    <!--<tr>-->
        <!--<td colspan="3">大数据学士后32班的成绩列表</td>-->
    <!--</tr>-->
    <!--<tr>-->
        <!--<td rowspan="2">李子豪</td>-->
        <!--<td>语文</td>-->
        <!--<td>90</td>-->
    <!--</tr>-->
    <!--<tr>-->
        <!--<td>数学</td>-->
        <!--<td>80</td>-->
    <!--</tr>-->
    <!--<tr>-->
        <!--<td rowspan="2">李子</td>-->
        <!--<td>语文</td>-->
        <!--<td>90</td>-->
    <!--</tr>-->
    <!--<tr>-->
        <!--<td>数学</td>-->
        <!--<td>80</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 action="reply.html"method="post">

<!--<p>-->
    <!--用户名<input type="text" name="name">-->
<!--</p>-->
<!--<p>-->
   <!--密码 <input type="password" e="password"name="pwd">-->
<!--</p>-->

<!--<p>-->
<!--<p>-->
    <!--<input type="checkbox" name="sports">篮球-->
    <!--<input type="checkbox" name="sports">羽毛球-->
    <!--<input type="checkbox" name="sports">足球-->
<!--</p>-->
<!--<p>-->
    <!--<input type="radio" name="sports">看书-->
    <!--<input type="radio" name="sports">拖地-->
    <!--<input type="radio" name="sports">跳舞-->
<!--</p>-->
    <!--<input type="submit" value="确定">-->
    <!--<input type="reset" value="重置">-->
<!--</p>-->

        <p>
            用户名<input type="text" name="name">
        </p>
        <p>
            密码<input type="passward" name="pwd">
        </p>
        <p>
            确认密码<input type="passward" name="pwd">
        </p>
        <p>
            手机号码<input type="phone number" name="pnb">
        </p>
        <p>
            邮箱<input type="mailbox" name="mailbox">
        </p>
        <p>
            年龄<input type="mailbox" name="mailbox">
        </p>
        <p>
            <input type="radio" name="sex">男
            <input type="radio" name="sex">女
        </p>
        <p>
            <input type="submit" value="确定">
            <input type="reset" value="重置">
        </p>
</form>