美文网首页
5、块元素、行内元素的区别

5、块元素、行内元素的区别

作者: 小黄不头秃 | 来源:发表于2022-05-23 00:13 被阅读0次

一、什么是块元素和行内元素?

块元素:在网页中通过块对页面进行布局;(一般是独占一行)
行内元素:主要用来包裹文字;(一般不会独占一行)

  • 一般情况下在块元素中放行内元素;
  • 块元素中什么元素都可以放;
  • p元素中不能放任何的块元素;

浏览器会对不符合规范的内容进行修正;

二、一些块元素和行内元素的举例。

  • header 表示网页的头部;
  • main表示网页的主题;
  • footer表示网页的底部;
  • nav表示网页中的导航;
  • aside和主题相关的其他内容,侧边栏;
  • article表示一个独立的文章;
  • section表示一个独立的区块,上边的标签都不能表示的时候就用section;
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>块和行内和语义化</title>
</head>
<body>
     <header>hahah</header>
     <main>null</main>
     <footer>nothing </footer>
     <nav>哦吼</nav>
     <aside>侧边栏</aside>
     <article>就表示一个文章,不知道可以表示有多长。。。</article>
     <section>section</section>
     <div>div</div>
     <span>span</span>
    </body>
</html>

相关文章

  • 任务8——CSS常见样式

    1.块级元素和行内元素分别有哪些? 区别1块级元素可以包含块级元素和行内元素;行内元素只能包含文本和行内元素 区别...

  • 块级元素和行内元素

    块级元素列表 行内元素 行内元素与块级元素区别 行内元素于块级元素直观上的区别 行内元素会在一条直线上排列,都是同...

  • 入门任务8

    块级元素和行内元素分别有哪些?## 块级元素 行内元素 区别 块级元素可以包含行内元素和其他块级元素,行内元素只能...

  • CSS常见样式问题搜集

    1.块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别? 块级元素:块级元素 行内元素:行内元素 区别...

  • css学习笔记之常见样式

    1 块级元素 和 行内元素区别 1 差异 块级元素可以包含行内元素和块级元素 行内元素只能包含文本和行内元素 块级...

  • CSS常见样式

    块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 块级元素 行内元素 块级元素与行内元素的区别块级可...

  • css常见样式

    块元素与行内元素区别区别一:块元素:display:block;行内元素:display:inline;可以通过修...

  • css常见样式

    块级元素和行内元素分别有哪些? 块级元素: 行内元素: 特性区别:1.块级元素可以包含行内元素和块级元素,而行内元...

  • Css元素|属性

    块级元素和行内元素 块级元素 (内联)行内元素 区别描述: 块元素(宽)占满整行,行内元素只占内容所在的宽度。 块...

  • 6. CSS常见样式

    知识 块级元素和行内元素 特性区别 由图可知: 块级元素可以包含块级元素和行内元素,而行内元素只能包含行内元素和文...

网友评论

      本文标题:5、块元素、行内元素的区别

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