html标签知识(无表单、表格)

<meta> : 定义在head中
<hgroup></hgroup> : 标题分组标签
<br>: 换行标签
!&nbsp; : 空行
<p></p>: 段落标签
<blockquote></blockquote>: 表示长引用
<q></q>: 短引用
<h1></h1>: 标题标签
标签手册:https://www.runoob.com/tags/tag-a.html

块元素: 对页面进行布局
行内元素:用来设置文字
关系:块元素可以有行内元素

语义化标签:

    <header>头部标签</header>
    <main>主体标签</main>
    <footer>底部标签</footer>

    <nav>导航标签</nav>
    <aside>侧边栏标签</aside>
    <article>文章标签</article>
    <section>独立的区块</section>

    <!-- 主流使用 -->
    <div>主要的布局元素</div>
    <span>行内元素,用于网页中的文字</span>

列表:

    <!-- 有序列表 -->
    <ol>
        <li>列表项1</li>
    </ol>

    <!-- 无序列表: 用的多 -->
    <ul>
        <li>列表项1</li>
    </ul>

    <!-- 定义列表 -->
    <dl>
        <dt>定义列表项1</dt>
        <dd>对定义列表项1的描述</dd>
    </dl>

超链接:

    <!-- 跳转到指定位置,href使用它的标签或者类 -->
    <a href="#bottom">这是一个没有感情的</a>
    <!-- a 是行内元素,里面除了a标签,其他标签都能放 -->
    <a href="http://www.baidu.com" target="_blank" rel="noopener noreferrer">点击跳转,会打开新窗口</a>
    <a href="day01.html">本窗口刷新去其他页面</a>

    <!-- id属性:唯一不重复 -->
    <!-- 点击将跳转到网页顶部 -->
    <a id="bottom" href="#">回到顶部</a>
    <!-- 点击这个链接不会做什么事情,用来站位 -->
    <a href="javascript:;">无所事事</a>

图片:

    <img src="rng.png" alt="对于这图片的描述">
    <br>
    <img src="rng.png" alt="对于这图片的描述">
    <img width="200" src="rng.png" alt="对于这图片的描述">

内联框架

    <iframe src="https://www.baidu.com/" frameborder="0">baiduyiha</iframe>

音视频播放

    <!-- 音频,controls 用户可控制播放, autoplay(不兼容) 自动播放 -->
    <audio controls>
        对不起,浏览器不支持,请升级
        <source src="文件1">
        <source src="文件2.mp3" type="audio/mp3">
    </audio>

    <!-- 视频 -->
    <video controls>
        <source src="视频文件1.mp4" type="video/mp4">
    </video>

有些html标签这里没有的可以访问菜鸟教程html标签手册去查找。

猜你喜欢

转载自www.cnblogs.com/zy7y/p/13365470.html