前端学习-Day2

最新推荐文章于 2024-09-14 21:53:48 发布

WienBZ

最新推荐文章于 2024-09-14 21:53:48 发布

阅读量34

点赞数

文章标签：学习 html5 Powered by 金山文档

本文链接：https://blog.csdn.net/m0_61900957/article/details/129694077

版权

表格标签

表头单元格标签<th>

加粗居中显示。

表格属性

属性名	属性值	描述
align	left、center、right	规定表格相对周围元素的对齐方式。
border	1或""	规定表格单元是否拥有边框，默认为""，表示没有边框。
cellpadding	像素值	规定单元边沿与其内容之间的空白，默认1像素。
cellspacing	像素值	规定单元格之间的空白，默认2像素。
width/height	像素值或百分比	规定表格的宽度/高度。

注意:这些属性要写在表格标签table里面去。

<table align="center" border="1" cellspacing="0" cellpadding="10" width="500" height="250">

表格结构标签

合并单元格

跨行合并：rowspan="合并单元格的个数"

跨列合并：colspan="合并单元格的个数"

目标单元格：（写合并代码）

跨行：最上侧单元格为目标单元格，写合并代码

跨列：最左侧单元格为目标单元格，写合并代码

合并单元格三部曲：

确定跨行还是跨列

找到目标单元格，写上合并方式。如：<td colspan="2"></td>

删除多余的单元格

表格总结

<table>表格标签

<tr>行标签

<td>单元格标签

<th>表头标签

<thead>表格头部区域标签

<tbody>表格主体区域标签

列表标签

无序列表

<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
...
</ul>

无序列表的各个列表项之间是没有顺序之分的，是并列的。

<ul></ul>中只能嵌套<li></li>，输入其他标签或文字是不允许的。

<li></li>之间相当于一个容器，可以容纳所以元素。

无序列表会带有自己的属性样式，但在实际使用中，我们会使用CSS来设置。

有序列表（理解）

<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
...
</ol>

<ol></ol>中只能嵌套<li></li>，输入其他标签或文字是不允许的。

<li></li>之间相当于一个容器，可以容纳所以元素。

无序列表会带有自己的属性样式，但在实际使用中，我们会使用CSS来设置。

自定义列表

<dl>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>
</dl>

<dl>定义列表

<dt>定义项目/名字

<dd>描述每一个项目/名字

<dl></dl>里面只能包含<dt>和<dd>

<dt>和<dd>的个数没有限制，经常是一个<dt>对应多个<dd>

表单标签

为了收集用户信息。

表单域、表单控件（元素)、提示信息组成。

表单域

<form>会把它范围内的表单元素信息提交给服务器。

<form action="url地址" method="提交方式" name="表单域名称">
各种表单元素控件
</form>

表单控件（元素)

<input>表单元素

<input type="属性值" />

单标签

type属性设置不同的属性值用来指定不同的控件类型（文本字段、复选框、掩码后的文本控件、单选按钮、按钮等）

除了type属性外，<input>还有其他很多属性：

属性	属性值	描述
name	由用户自定义	定义input元素名称。
value	由用户自定义	规定input元素的值。
checked	checked	规定此input元素首次加载时应当被选中。
maxlength	正整数	规定输入字段中的字符的最大长度。

name是表单元素名字，radio单选按钮（如性别）必须有相同的名字name值，才能实现多选一。（checked）复选框也要有相同的name值。

value有可以显示出来，有的显示不出来。

name和value是每个表单元素都有的属性值，主要给后台人员使用。

单选按钮和复选框可以设置checked属性，当页面打开时默认选中这个按钮。

<label>标签

<label>标签用于绑定一个表单元素。

<input type="radio" name="sex" id="nan"/><label for="nan">男</label>
<input type="radio" name="sex" id="nv"/><label for="nv">女</label>

        <label for="text">昵称：</label><input type="text" id="text">
        用户名：<input type="text" name="username" value="请输入用户名" maxlength="6"> <br />
        密码：<input type="password" name="pwd"> <br>
        性别:<input type="radio" name="sex" value="男" id="nan"><label for="nan">男</label> <input type="radio" name="sex"
            value="女" checked="checked" id="nv"><label for="nv">女</label> <br>