关于HTML的碎知识点
1. <!DOCTYPE html>
(1)文档类型声明,作用就是告诉我们浏览器使用哪种HTML版本来显示网页。
(2)注意:该标签处于文档中的最前端,不是HTML标签,它就是文档类型声明标签。
2. <html lang="en">
(1)lang语言种类,用来定义当前文档显示的语言。
(2)en就是英文网页,zh-cn就是中文网页。
3. <meta charset="utf-8">
(1)utf-8称为万国码。
(2)注意:对于中文网页要使用<meta charset=”utf-8”>声明编码,否则会出现乱码。有些浏览器会把属性值改为gbk。
4.<p></p> 段落标签
(1)文本在一个段落中会根据浏览器的大小自动换行。
(2)段落与段落之间保有空隙。
5.<br/> <!--换行标签-->
6.文本格式化标签
(1) <b>加粗标签</b>
(2) <em>倾斜标签</em><i>倾斜标签</i>
(3) <s>删除线标签</s>
(4) <u>下划线标签</u>
7.<img src="" alt="" title=""> 图像标签
(1)src是img标签的必须属性,它用来指定图像文件的路径和文件名。
(2)alt属性是替换文本,当图片不能正常显示时去显示的。
(3)title属性时鼠标放在图片上会显示图片的信息。
8.列表的创建
(1)无序列表的创建<ul> <li> </li></ul> ul里边只能放<li>标签,<li>标签里边可以存放任何元素。
(2)有序列表的创建<ol><li></li></ol>
(3)自定义列表<dl><dt></dt><dd></dd></dl>
9.超链接标签<a href="" target=""></a>的使用
(1)href必须属性,属性值时填写超链接的网址。
(2)target属性时用于指定的链接页面的打开方式,其中属性值为_self时为默认状态,_bank在新的窗口中打开。
(3)href=”#”表示为空连接。
(4)锚点链接:在连接文本中的href属性中设置属性值为#+名字,找到目标位置标签,里面添加一个id属性值等于href属性值的名字。
10.表格的制作
(1)表格由<table></table>标签定义,每个表格均有若干行<tr></tr>标签定义,每行被分割为若干行单元格(<td></td>标签来定义的)。
(2)字母td指表格数据,即数据单元格的内容可以包含任何东西。
(3)标签<th></th>是表格第一行的重点提示。
(4)标签<caption></caption>时表格上边的标题。
(5)属性cellpadding 规定内容与单元格之间的空隙,属性cellspacing 规定单元格之间的空隙、
(6)表格结构标签:<thead></thead>表格头部标签 <tbody></tbody>表格的主体区域。可有这样表示:
<table>
<thead>
<th>头部</th> <th>头部2</th>
</thead>
<tbody>
<td>主要部分</td><td>主要部分2</td>
</tbody>
</table>
(7)合并单元格:1.跨行合并 rouspan=”合并个数” 代码写在最上边的那个单元格上。 2.跨列合并:colspan=”合并个数” 代码写在左侧那个单元格上。可以这样表示:
<table align="center" border="1" cellspacing="0" width="1000" height="1000">
<tr>
<!-- 跨列合并 -->
<td></td><td colspan="2"></td>
</tr>
<tr>
<!-- 跨行合并 -->
<td rowspan="2"></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td>
</tr>
</table>
11.表单标签
(1)一个完整的表单有三部分组成:表单域,表单件,提示信息
(2)表单域标签:<form action=”url” method=”” name=”” ></form>实现用户信息的收集和传递,把表单内的表单信息交给服务器。action=“url”url为地址,用于指定接受并处理表单数据的服务器。Method属性用于设置表单数据的提交方式,其取值为get和post。name属性用于指定表单的名称。
(3)表单元素:input输入元素 select下滑表单元素 textarea文本域元素。
(4)<input>标签用于收集用户信息,name和value是每个表单元素都该有的属性主要给后台人员使用。
(5)maxlength属性是设置用户在文本中输入最多个字符,可表示为:
用户信息:<input type="text" name="text" value="用户信息" maxlength="6"/>
(6)密码框type属性值为passsword:
密码:<input type="password" name="“ value="请输入密码">
(7)单选按钮type属性值为radio:name属性是表单元素名字,这里性别单选按钮必须有相同的名字name才能实现多选一,列:
性别:男<input type="radio" name="ra"> 女:<input type="radio" name="ra">
(8)多选按钮type属性值为checkbox 列:
爱好: <input type="checkbox"> 吃饭<input type="checkbox"> 睡觉<input type="checkbox"> 打豆豆
(9)单选按钮和复选框可以设置checked属性,当页面打开时就可以默认选中该按钮 列:
合同: <input type="radio" checked="checked">
(10)提交按钮type属性值为submit,把表单元素送给后台:通过value属性改变submit里边的文字 列:
<input type="submit" name="" id="" value="提交按钮">
(11)重置按钮 type属性值为reset:列:
<input type="reset" name="" id="" value="重置按钮">
(12)点击按钮type属性值为button:列:
<input type="button" value="点击按钮">
(13)上传文件按钮 type属性值为file:
<input type="file" value="上传文件按钮">
(14)label标签为input元素定义标注:label标签用于绑定一个表单元素,当点击<label></label>标签内的文本时,浏览器就会自动把光标对应到表单元素上,标签<label>里的for属性值和标签<input>里的id属性值必须时相同的,列:
<label for="text">男生</label>
<input type="radio" id="text">
(15)下拉表单元素<select name=”” id=””></select>:在option中定义selected=”selected”时,可以设置为默认选项中,例如;
<select name="" id="" aria-valuetext="籍贯">
<option value="" selected="select">籍贯</option>
<option value="">河南</option>
<option value="">北京</option>
<option value="">上海</option>
</select>
(16)文本表单元素<textarea></textarea>:例如:
<form action="">
<textarea name="" id="" cols="30" rows="10">
输入今日反馈
</textarea>
</form>