HTML

我的HTML笔记

标题标签 < h1>–< h6>:双标签，六个等级,独占一行
段落标签 < p></ p>：两端之间有一个缝隙，根据浏览器窗口大小自动换行
换行标签 < br/>是一个单标签：换行标签只是换行，两段之间没有缝隙

字体加粗标签 < strong></ strong>或< b></ b>
斜体字标签 < em></ em> 或 < i></ i>
删除线 < del></ del> 或 < s></ s>
下划线 < ins></ ins> 或 < u></ u>

div标签 和span标签 盒子标签用来装内容
div标签是双标签：独占一行
span 标签是双标签：不独占一行 跨距

图像 标签 < img src=“url” />
src属性：标注图片路径
alt属性：当文件不显示时，用文字代替
title属性：鼠标放到图片上显示的文字
width属性：图像宽度
height属性：图像高度 !宽度高度任意修改一个 另一个会自动等比缩放
border属性：图像边框

图片相对路径：
同一级：直接图片名
下一级：images/img.jpg
上一级：…/img.jpg

图片绝对路径：
电脑中图片所在的完整地址 或 图片所在的网络地址

链接标签 < a href=“url” >文字</ a>
herf属性：必须属性，用于存放链接的地址
target属性：用于存放链接页面打开的方式 默认为_self 当前页面打开 _blank在新页面打开
链接标签可分为：①外部链接、②内部链接、③空链接（herf="#"）、④下载链接（.exe.zip…）、⑤元素链接（图片、文字、表格、音频…）

锚点链接：
快速跳转到页面的指定位置< a href="# 名字（标志）"> 名字</ a> //#是必须的
若不在同一个页面< a href=“XXXXXX.html#名字”>hello</ a>

特殊字符
空格 &nbsp
< &lt
> &gt
& &amp
其他的特殊字符 用的时候 再查阅

表格标签
< table></ table>定义表格的标签
< tr></ tr>定义表格中的行,必须嵌套在< table>标签中
< td></ td>定义表格中的单元格,必须嵌套在< tr>标签中
< th></ th>是表头标签,表头中的文字加粗 居中显示
表格属性：
align属性：left 、center、right ，对齐
border属性：是否具有边框 1或” “，默认为” “，没有边框
cellpadding属性：像素值，规定单元格边沿与其内容之间的距离，默认1像素，通常设置为0
cellspacing属性：规定单元格与单元格之间的距离，默认2像素，通常设置为0
width属性：宽度
height属性：高度
表格结构标签：为了语义清晰，都是包含在< table >标签里的
< thead ></ thead>表头
< caption></ caption> 表格标题
< tbody>< tbody>表格部分
合并单元格（属性）：
确定目标单元格：
跨行：上侧为目标单元格 rowspan
跨列：左侧为目标单元格 colspan
合并单元格三部曲：
1、先确定是跨行还是跨列
2、写上合并方式=合并的单元格数量< td colspan=“2”></ td>
3、删除多余的单元格
无序列表（重点）：
< ul>标签表示HTML页面中的无序列表。一般会以项目符号呈现列表项，而列表项使用< li>标签定义

                            <ul>
                                <li>1</li>
                                <li>2</li>
                                <li>3</li>
                            </ul>

             1、无序列表的各个列表项之间没有顺序级别之分，是并列的。
             2、< ul></ ul>中只能嵌套< li></ li>，直接在< ul></ ul>标签中输入其他标签或者文字的做法是不被允许的。
             3、< li></ li>之间相当于一个容器，可以容纳所有元素。
             4、无序列表会带有自己的样式属性，实际使用时，通常用CSS设置。

有序列表 < ol></ ol> ：
1、< ol></ ol>中只能嵌套< li>，直接在< ol></ ol>标签中输入其他标签或者文字的做法是不被允许的。
2、< li></ li>之间相当于一个容器，可以容纳所有元素。
3、有序列表会带有自己的样式属性，实际使用时，通常用CSS设置。
自定义列表< dl></ dl>：该标签用于定义描述列表，该标签会与< dt>（定义项目名字）和< dd>（描述每一个项目的名字）一起使用。

表单标签：
表单的组成：在HTML中，一个完整的表单通常是由表单域、表单控件（表单元素）和提示信息三个部分组成。
表单域：一个包含表单元素的区域。< form>标签定义表单域，将它范围内收集的信息，提交给服务器
表单控件（表单元素）：在表单域中可以定义各种表单元素，这些表单元素就是允许用户在表单中输入或许选择的内容控件。

     <input>标签 
type:       text：单行文本输入框
    password：密码输入框
    radio：单选按钮
    checkbox：复选框
    button：普通按钮
    submit：提交按钮：将form表单元素提交给后端服务器
    reset：重置按钮：将重置表单信息，还原成默认状态
    image：图像形式的提交按钮
    file：文件域
name:用户自定义控件的名称
value：用户自定义的<input>控件中的默认文本值
size：<input>控件在页面中显示的宽度（正整数）
checked：单选复选框设置此属性，页面打开时默认选中 checked="checked"
maxlength：规定输入字符的最大长度                                              


 

< label>标签：双标签，绑定一个表单元素，增加用户体验 ，label标签里的for属性对应着，值相同

< select>标签：双标签，下拉菜单；下拉选项用< option></ option> selected="selected"属性可以将选项设置位默认选项

< textarea>标签：双标签，文本域 包含cols=“每行字数，即为列” rows=“行数” ，实际开发中，多是用CSS来调整其大小