美文网首页前端开发前端知识点
HTML块级元素和行内元素

HTML块级元素和行内元素

作者: 繁络 | 来源:发表于2019-06-01 19:47 被阅读214次

    一、从概念的角度来看块级元素和行级元素咱们可以理解为:

        块级元素一般都是新起一行,可以容纳行内元素和其他块级元素;

        行内元素一般都是语义级别的基本元素,一般只能容纳文本或者其他行内元素。

    二、块级元素和行内元素的区别

        1、块级元素会独占一行,其宽度自动填满其父元素宽度;行内元素会排列到同一行里,其宽度随元素的内容变化而变化。

        2、块级元素可以设置宽高;行内元素设置宽高无效。

        3、块级元素可以设置margin,padding属性;行内元素的水平方向的padding会有边距效果,但是竖直方向的padding没有效果。

    常用块级元素列表:

    <div>    定义文档中的分区或节

    <h1>、<h2>、<h3>、<h4>、<h5>、<h6>    定义标题,数字越小字体越大越粗

    <p>    段落标签

    <ul>    定义无序列表

    <ol>    定义有序列表

    <li>    定义列表项目

    <dl>    定义列表

    <dt>    定义列表中的项目

    <dd>    定义列表中的条目

    <hr>    创建一条水平线

    常用行级元素列表:

    <span>    组合文档中的行内元素

    <i>    倾斜文本

    <em>    定义为强调的内容

    <b>    字体加粗

    <strong>    语气更强的强调内容

    <a>    标签可定义锚

    <img>    嵌入图片

    <input>    输入框

    <select>    创建单选或多选菜单

    <textarea>    多行文本输入框

    <button>    按钮标签

    <sub>    下标文本

    <sup>    上标文本

    记得点个赞哦~

    相关文章

      网友评论

        本文标题:HTML块级元素和行内元素

        本文链接:https://www.haomeiwen.com/subject/dlogtctx.html