HTML标签

2019-04-28  本文已影响0人  562843cce5ff

关于h标签

整个网页只能有一个h1标签
h1的标签的权重比较高,用来表达比较重要的东西!

关于路径

要使用相对路径,绝对路径的可移植性差


表单标签

lable标签

将文字包裹在lable标签中,给input标签添加id,给lable标签添加for属性关联id

<lable for="user">用户名:</lable><input type="text" id="user"><br/>
<lable for="psw">密码:</lable><input type="password" id="user" id="pwd>

datalist标签作为了解

给input添加待选列表

请输入水果名称:<input type="text" list="fruit">
<datalist id="fruit">
              <option>芒果</option>
              <option>草莓</option>
              <option>香蕉</option>
              <option>葡萄</option>
</datalist>

select标签

下拉菜单
label="北京" 分组选项名称
optgroup 标签定义分组方便阅读;
selected="selected" 为默认选中的选项

<select>
        <optgroup label="北京">
        <option selected="selected">海淀区</option>
        <option>丰台区</option>
        <option>朝阳区</option>
        </optgroup>
        <optgroup label="上海">
            <option>杨浦区</option>
            <option>黄浦区</option>
            <option>卢湾区</option>
        </optgroup>
        <optgroup label="广州">
            <option>天河区</option>
            <option>越秀区</option>
        </optgroup>
    </select>

在多选框和单选框中所有的name必须一致且没有都有自己对应的value值

audio标签

    <audio autoplay="autoplay" controls="controls" loop="loop" muted="muted" preload="auto">
        <source src="song.ogg" type="audio/ogg">
        <source src="song.mp3" type="audio/mpeg">
    </audio>

video标签

    <video autoplay="autoplay" controls="controls" loop="loop" poster="" preload="auto" muted="muted>
        <source src="/i/movie.mp4" type="video/mp4">
        <source src="/i/movie.ogg" type="video/ogg">
        <source src="/i/movie.webm" type="video/webm">
    </video>

这种方式需要先针对不能支持vedio的浏览器先引入html5media.js才可以使用
autoplay自动播放
controls为控件
loop为循环
porster为占位图片等资源
preload为预加载但是和autoplay相冲只能用一个
muted为该视频播放时为静音
source标签为多种格式方便浏览器兼容type来指定格式

详情和摘要标签

<details>
    <summary>HTML 5</summary>
    This document teaches you everything you have to learn about HTML 5.
</details>

html中废弃和新增的的标签

    //废弃
    <b></b>    
    <u></u>
    <s></s>
    <i></i>
    //新增
    <strong></strong>
    <ins></ins>
    <deleted></deleted>
    <em></em>
上一篇 下一篇

猜你喜欢

热点阅读