Heim >Web-Frontend >H5-Tutorial >Zusammenfassung der erweiterten HTML5-Inline-Tags (kurzer Artikel)

Zusammenfassung der erweiterten HTML5-Inline-Tags (kurzer Artikel)

黄舟
黄舟Original
2017-02-20 13:40:311426Durchsuche

Inline-Elemente teilen sich eine Zeile mit anderen, aber das Festlegen der Breite und Höhe ist ungültig. Seine Eigenschaften:

① und andere Elemente befinden sich in einer Zeile

②Höhe, Zeilenhöhe, Außenränder und Innenränder können nicht geändert werden

③Die Breite beträgt The Die Breite des Texts oder Bilds kann nicht geändert werden

④ Inline-Elemente können nur Text oder andere Inline-Elemente aufnehmen

Der Code lautet wie folgt:

<!doctype html>  

    <html lang="en">  

    <head>  

        <meta charset="UTF-8">  

        <title>标签基础2</title>  

    </head>  

    <body>  

        <!-- 内联元素 与别人公用一行 但是设置宽高无效 -->  

        <!-- 无语义 -->  

        <span>无语义</span>  

        <!-- 图片 alt图片加载失败显示-->  

        <img src="d" alt="加载失败">  

        <!-- 超链接 -->  

        <a href="http://www.baidu.com">跳转</a>  

        <!-- 斜体强调 -->  

        <var>斜体强调作用</var>  

        <!-- em和i经常用于制作小图标 -->  

        <em>斜体强调作用</em>  

        <i>斜体强调作用</i>  

        <!-- 加粗强调 -->  

        <strong>加粗强调</strong>  

        <!-- 表单 提交数据-->  

        <form action="">  

            <!-- 输入框 -->  

            <input type="text">  

            <!-- 密码输入框 -->  

            <input type="password">  

            <!-- 按钮 -->  

            <input type="button" value="按钮">  

            <!-- 提交表单 -->  

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

            <!-- 日期 年月日-->  

            <input type="date">  

            <!-- 日期 年周 -->  

            <input type="week">  

            <!-- 日期 年月 -->  

            <input type="month">  

            <!-- 日期 当前时间 -->  

            <input type="time">  

            <!-- 选择文件 -->  

            <input type="file" value="打开文件">  

            <!-- 只能输入数字 -->  

            <input type="number">  

            <!-- 颜色选择器 -->  

            <input type="color">  

            <!-- 重置 -->  

            <input type="reset">  

            <!-- 复选框 -->  

            <input type="checkbox">我爱你   

            <input type="checkbox">你爱我   

            <!-- 单选框 name 同名字为一组-->  

            <input type="radio" name="sex" checked="checked">男   

            <input type="radio" name="sex">女   

        </form>  

        <!-- 多行文本 cols宽度 rows高度 -->  

        <textarea name="" id="" cols="30" rows="10"></textarea>  

        <!-- 选择列表 默认第一个选项的值为初始值-->  

        <select name="" id="">  

            <option value="">选项1</option>  

            <option value="">选项2</option>  

            <option value="">选项3</option>  

        </select>  

    </body>  

    </html>



Das Obige ist eine Zusammenfassung der vom Herausgeber eingeführten erweiterten HTML5-Inline-Tags. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn