前端学习——html

1.常用标签
    1.文本标题（h1~h6）
        权重最大，优先作为关键字被搜索。
    2.段落文本（p）
    3.换行标签（br）
    4.水平线（hr）
    5.加粗有两个标记（推荐strong）
        <b>加粗内容</b>只是显示加粗
        <strong>强调的内容</strong>突出的文本
    6.倾斜有两个标记（推荐em）
        <em>强调文本</em>
        <i>倾斜文本</i>
    7.删除线有两个标记（推荐del）
        <s>文本</s>
        <del>文本</del>
    8.扩展
        <u>文本</u>下划线
        <sub></sub>下标
        <sup></sup>上标
2.显示特殊符号
    1.尖角号（<>）
        &lt;  左尖角号
        &gt;  右尖角号
    2.空格（ ）
        &nbsp;  宽度受字体限制，不推荐使用
        &emsp;  一个中文宽度，推荐使用
    3.版权符号（©）
        &copy;
    4.商标符号
        &trade;  ™
        &reg;  ®
3.span标签
    当元素需要单独修饰时套上span标签。
4.列表
    1.无序列表
        <ul>
            <li>无序列表</li>
            <li>无序列表</li>
        </ul>
    2.有序列表
        <ol>
            <li>有序列表</li>
            <li>有序列表</li>
        </ol>
    3.自定义列表
        <dl>
            <dt>无缩进</dt>
            <dd>有缩进</dd>
        </dl>
5.图片
    <img src="图片路径" title="鼠标悬停上去之后的提示信息" alt="图片不显示之后（加载失败）的提示信息" width="200px" height="200px">
6.超链接
    <a href="链接" title="鼠标悬停时的提示信息" target="规定在何处打开文档">内容</a>
     target属性：A. target="_self" 默认值
                B. target="_blank" 新窗口打开
7.table表格
    <table>  <!--创建表格-->
        <tr> <!--创建行-->
            <td>1</td> <!--创建单元格-->
            <td>2</td>
        </tr>
    </table>
    table属性：
    1.width 2.height 3.边框border 4.边框颜色bordercolor 5.背景颜色bgcolor 6.水平对齐align="left/right/center"
    7.cellspacing="单元格与单元格之间的间距" 8.cellpadding="单元格与内容之间的空隙"
    行tr属性：
    1.高度height 2.背景颜色bgcolor 3.文字水平对齐align="left/right/center" 4.文字垂直对齐valign="top/middle/bottom"
    单元格td属性：
    1.高度height 2.背景颜色bgcolor 3.文字水平对齐align="left/right/center" 4.文字垂直对齐valign="top/middle/bottom"

    表格合并列：
    colspan="所要合并的单元格的列数" 必须给td
    表格合并行：
    rowspan="所要合并的单元格的行数" 必须给td
8.表单
    1.<form method="get/post" action="向何处发送表单数据">
        <input/>
            A.属性：type定义输入框的类型
                a)文本框 type="text"  密码框 tyoe="password"
                b)提交框 type="submit"和<button>提交按钮</button>一样
                c)按钮框 type="button" 单纯的按钮
                d)重置框 type="reset"  清空的效果
                e)单选框 type="radio"  同一个单选框列表需要有一个相同的name值
                    默认值：checked="checked"或只写checked
                f)复选框 type="checkbox"  同一个复选框列表需要有一个相同的name值
                g)上传文件 type="file"
                h)图片按钮 type="image" 用选中的图片替代“提交”按钮，点击图片是提交功能
                i)隐藏按钮 type="hidden" 提交时带给后端一些信息
                    <input type="hidden" name="" id="" value="带给后端的个人信息">
                j)禁用按钮 disabled="disabled"
                k)只读属性 readonly="readonly"
            B.属性：placeholder 描述输入字段预期值的简短的提示信息。兼容到IE8以上
            C.属性：name必须设置，否则在提交表单时，用户在其中输入的数据不会被发送给服务器
            D.属性：value
    </form>
    2.下拉菜单<select><option></option></select>
        A.select属性：size="数值"，数值代表能够显示出几个选项。
        B.select属性：multiple 可以进行多选。
        C.option属性：必须设置value，为了让后端拿到信息。
        D.option属性：selected，默认选中。
    3.多行文本输入框<textarea></textarea>
        A.属性：cols="列数" rows="行数"，但需要注意，只是适用于英文字母和阿拉伯数字，不适用于汉字，故不常用。常用css控制宽高。
        B.属性：placeholder="提示性内容"
        C.想要提前写好一些内容，直接在两个标签之间写即可，不用value属性
        D.css里可以设置属性resize:vertical(水平方向不可以随意拉伸)/horizontal(竖直方向不可以随意拉伸)/both/none
    4.字段集<fieldset></fieldset>
        A.默认出现一个边框
        B.想在边框左上角添加一个压线文字，使用<legend></legend>
        C.边框内部可以再写其他的表单类型
        D.所有的东西都可以使用css进行修饰
    5.H5新增标签
        A.section元素，表示页面中的一个内容区块
        B.article元素，表示一块与上下文无关的独立的内容
        C.aside元素，在article之外的，与article内容相关的辅助信息，侧边栏
        D.header元素，表示页面中一个内容区块或整个页面的标题
        E.footer元素，表示页面中一个内容区块或整个页面的脚注
        F.nav元素，表示页面中导航链接部分
        G.figure元素，表示一段独立的流内容，使用figcaption元素为其添加标题（第一个或最后一个子元素的位置）
        H.main元素，表示页面中的主要内容（ie不兼容）
        I.video元素，audio元素，音视频标签
            audio：controls控制栏：
                                loop：循环
                                autoplay：自动播放
                                muted：自动静音
            video：controls控制栏：
                                loop：循环
                                autoplay：自动播放
                                muted：自动静音
                                poster：视频缩略图
                                width和height是随原视频等比例缩放，也可以通过css修饰
        J.表单新增
        <input/>
            A.type="color" 取色器
            B.type="email" 邮箱地址输入框，自带地址校验，地址不对的话提交不了
            C.type="url" URL地址，自带地址校验
            D.type="tel" 电话号码，使用在手机端，弹出拨号盘
            E.type="range" 滑块效果，min="滑块最小值"，max="滑块最大值"，value="预置值"，step="步长"
            F.type="number" 仅能输入数字，min="数字最小值"，max="数字最大值"，value="预置值"，step="步长"
            G.type="search" 搜索框，在框后面会有一个清空内容的叉
            H.type="date" 日期选择器，month 月份选择器，week 周选择器，datetime-local 时分选择器
        K.选项列表
        <datalist>
            <option value=""></option>
        </datalist>
        L.表单新增属性
            a）autofocus  自动获取焦点
            b)required  必填项
            c)multiple  在邮箱表单中支持填写多个邮箱地址，地址间用逗号隔开
            d)pattern=""  正则表达式