html笔记

1、表单标签
    * 可以提交数据到网站的服务器，这个过程可以使用表单标签实现

    * <form></form> : 定义一个表单的范围
        - 属性
            ** action：提交到地址，默认提交到当前的页面
                <form action="abc.html">
            ** method: 表单的提交方式
                - 常用的有两种  get 和 post ，默认是get
                - 区别：
                    1、get请求地址栏会携带提交的数据，post不会
                    2、get请求安全级别较低，post较高
                    3、get请求数据大小的限制，post没有限制
            ** enctype：一般请求下不需要这个属性，做文件上传时需要设置这个属性

    ** 输入项：可以输入内容或者选择内容的部分
        - 大部分的输入项 使用 <input type="输入项的类型"/>

        *** 普通输入项： <input type="text" name="name"/>

        *** 密码输入项： <input type="password" name="pwd"/>

        *** 单选输入项： <input type="radio" name="" value=""/>
            - 在里面需要有属性 name
            - name 的属性值必须相同
            - 必须有一个 value 
            - 默认选中的属性  checked="checked"
            <input type="radio" name="sex" value="woman" checked="checked"/>女
            <input type="radio" name="sex" value="man"/>男


        *** 多选输入项： <input type="checkbox"/>
            - 属性 name 的值必须相同
            - 必须有一个 value
            - 默认选中的属性  checked="checked"
            <input type="checkbox" name="habit" checked="checked"/>羽毛球
            <input type="checkbox" name="habit"/>篮球
            <input type="checkbox" name="habit"/>排球
            <input type="checkbox" name="habit"/>足球

        *** 文件输入项（文件上传）
                <input type="file"/>

        *** 下拉输入项
            - 默认的选择 selected="selected"
            <select name="birth">
                <option value="1991" selected="selected">1991</option>
                <option value="1992">1992</option>
                <option value="1993">1993</option>
            </select>
        *** 文本域
            自我介绍：<textarea cols="" rows=""></textarea>

        *** 隐藏项（不会显示在页面上）
            <input type="hidden"/>

        ***提交按钮
            <input type="submit" value="注册"/>

        *** 使用图片提交
            <input type="image" src="图片路径" />

        *** 重置按钮：回到初始状态
            <input type="reset"/>

        *** 普通按钮
            <input type="button" value=""/>

2、其它标签的使用
    <pre> 原样输出 </pre>

    <b> 加粗 </b>
    <u> 下划线 </u>
    <i> 斜体 </i>
    <s> 删除线 </s>

    <sub> 上标 </sub>
    <sup> 下标 </sup>

    <hr> 直线 </hr>

    <p>段落</p>
        - 比<br>多一行

    <div>自动换行</div>
    <span> 不会自动换行</span>
3、html的头标签的使用
    * 在head里面使用的标签就是头标签

    * <title> 标题
    * <meta> 标签：设置页面的一些相关内容
        - 关键词
        <meta name="keywods" content="毕姥爷，熊出没，刘翔">
        - 定时跳转
        <meta http-equiv="refresh" content="3;url=www.baidu.com"/>

    * <base> 标签：设置超链接的基本设置
        - 可以统一设置超链接的打开方式
            - 设置所有页面都在新窗口打开
            <base target="_blank"> 
    * link标签：引入外部文件
4、框架标签的使用
    * <frameset>
        - rows : 按照行进行划分
            - <frameset rows="80,*"> </frameset>
        - cols : 按照列进行划分
            - <frameset cols="80,*">
    * <frame>
        - 具体显示的页面
            - <frame name="lower_left" src="b.html">
    * 使用框架标签的时候，要把body去掉
5、列表标签
    * <dl>
        <dt>
            <dd>
    * 有序 <ol>
             <li>
    * 无序 <ul>
             <li>
6、图像标签
    <img src="图片路径" width="" height="" alt=""/>
        ** alt:1.图片显示的内容
                2.浏览器兼容性很差
7、路径（相对路径）
    - 在同一级目录：直接写
    - 在下一层目录: a/1.jpg
    - 在上一层目录：../
8、超链接标签
    <a href="路径"> 显示在页面上的内容</a>
    - 打开方式 target="_self   _blank"
    - 默认是当前页面打开
9、表格标签
    <table>
        <tr>
            <td>  </td>
            <th>  </th>     //加粗并居中
        </tr>
    <table>
    - 先数多少行，再数多少列