HTML总结（一）

最新推荐文章于 2021-06-05 10:12:46 发布

原创最新推荐文章于 2021-06-05 10:12:46 发布 · 147 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html

基础专栏收录该内容

1 篇文章

订阅专栏

本文介绍了HTML语义化的重要性，包括如何正确使用如header、footer等标签，以及其对程序阅读、浏览器解析、SEO优化和样式展示的好处。同时，详细列举了HTML表单的各种元素，如文本框、密码框、单选按钮、复选框等。

html语义化

在html中自带了一些标签，这些标签有特定的含义。比如h1~h6标签，代表的是标题、p标签代表了段落。
html5中新添加的是header、footer、nav这些标签在调用时应该尽量按照他的语意来使用。
优点：
1、有利于程序的阅读，便于团队的开发与维护。
2、浏览器方便读取。
3、有利于搜索引擎的优化（比如根据标签来搜索）
4、有一些标签会有默认样式比如h1，如果浏览器禁止了css样式还可以达到突出样式的效果。

一些标签

    <form action="test1.html">
        <!-- 文本框 -->
        <label for="username">用户名：</label><input id="username" type="text">
        <!-- 密码框 -->
        <br>
        密码：<input type="password">
        <br>
        <!-- 单选按钮 -->
        <input type="radio" name="sex">男
        <input type="radio" name="sex">女
        <br>
        <input type="radio" name="school">黑大
        <input type="radio" name="school">理工
        <input type="radio" name="school">林大
        
        <!-- 复选框 -->
        <h4>爱好：</h4>
        <div>
            <input type="checkbox" name="hobby">吃饭
            <input type="checkbox" name="hobby" >睡觉 
            <input type="checkbox" name="hobby">打豆豆
        </div>

        <select>
            <option value="17">17级</option>
            <option value="18">18级</option>
            <option value="16">16级</option>
        </select>


        <textarea></textarea>

        <button>click</button>
        <input type="submit" value="表单提交">

    </form>