块元素和内联元素

最新推荐文章于 2022-01-06 19:29:01 发布

passerby_Ai

最新推荐文章于 2022-01-06 19:29:01 发布

阅读量112

点赞数 1

分类专栏： Html css 基础

本文链接：https://blog.csdn.net/weixin_45736498/article/details/104675212

版权

Html css 基础专栏收录该内容

27 篇文章 0 订阅

订阅专栏

块元素

概念：块元素会独占一行，无论他的内容有多少他都会独占一行
比如：p div h1 h2 h3…

关于div

div这个标签是没有任何语义，就是一个纯粹的块元素，并且不会为它里面的元素设置任何的样式。
div元素主要用来对页面进行布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--    background-color:设置背景颜色-->
    <div style="color: royalblue;background-color: aquamarine">我是div元素 </div>
    <div style="color: royalblue;background-color: crimson">我是div元素 </div>


</body>
</html>

内联元素

概念：只占用自身大小的元素，不会占用一行
常见的内联元素： a img if rame span

关于span

span没有任何的语义，专门用来选中文字，然后为文字设置样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--    background-color:设置背景颜色-->
    <div style="color: royalblue;background-color: aquamarine">我是div元素 </div>
    <div style="color: royalblue;background-color: crimson">我是div元素 </div>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>
    <span>我是一个span标签</span>

</body>
</html>

关联

块元素主要用来做页面中的布局，内联元素主要用来选中文本设置样式，一般情况下只使用块元素包含内联元素，不会使用内联元素包含一个块元素

a元素可以包含任意元素，除了他本身
p元素不可以包含任何其他的块元素

passerby_Ai

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
块元素和内联元素

块元素概念：块元素会独占一行，无论他的内容有多少他都会独占一行比如：p div h1 h2 h3…关于divdiv这个标签是没有任何语义，就是一个纯粹的块元素，并且不会为它里面的元素设置任何的样式。div元素主要用来对页面进行布局<!DOCTYPE html><html lang="en"><head> <meta ch...
复制链接

扫一扫