CSS-display属性详解

已于 2023-02-19 22:08:08 修改
阅读量667 收藏 2
点赞数 2
文章标签： css html 前端
于 2023-02-16 11:56:13 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49381647/article/details/129058061
版权

1.根据CSS规范的规定，每一个网页元素都有一个display属性，用于确定该元素的类型，每一个元素都有默认的display属性值，比如div元素，它的默认display属性值为“block”，称为块元素，而span元素的默认display属性值为“inline”，称为“行内”元素。块元素与行元素是可以转换的，也就是说display的属性值可以由我们来改变。display常用属性值1. none：隐藏

2.块元素与行元素是可以转换的，也就是说display的属性值可以由我们来改变。

  1.  none
  2. inline :指定对象为行元素
  3. block： 指定对象为块元素
  4. inline-block：指定对象为行内块元素
  5. table-cell：指定对象为表格单元格元素
  6. flex：弹性盒子
  7. inline转block

 

清晨:D
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【CSS知识点】——display属性详解
m0_50785976的博客
10-29 6813
display属性详解以及部分常用布局
详解css中的display属性
09-25
CSS中的`display`属性是一个非常重要的样式属性，用于定义元素的布局方式。它规定了元素应该生成的框的类型，从而影响元素的显示效果和周围的元素如何排列。在CSS布局中，`display`属性通常与`block`、`none`、`...
CSS 之 z-index 属性详解
热门推荐
weixin_45092437的博客
08-26 6万+
`z-index`属性是用来设置元素的堆叠顺序或者叫做元素层级，`z-index`的值越大，元素的层级越高。当元素发生重叠时，层级高的元素会覆盖在层级低的元素的上面，使层级低的元素的重叠部分被遮盖住。 当父元素设置了`z-index`属性时，子元素的`z-index`属性只与同级元素和父级元素作比较时才有意义，与其他元素对比时无意义。此时子元素与父元素外的所有的外部元素进行堆叠层级顺序对比时，都以父元素的`z-index`属性值为准进行对比，子元素本身的`z-index`属性值无效。...
css:display 属性汇总
m0_48355265的博客
04-28 1683
css：dispaly属性汇总
Css display 属性详解
HaoNanEr1989的博客
06-20 2万+
Css display属性详解
CSS 之 display属性详解
weixin_45092437的博客
10-18 1万+
display的属性值有：block、inline、flex、grid、table、flow、flow-root、ruby、list-item、table-row、table-cell、table-column、table-caption、table-row-group、table-header-group、table-footer-group、table-column-group、ruby-base、ruby-text、ruby-base-container、ruby-text-container等等。
【CSS】scroll-snap属性详解
正在解锁骑着骆驼去南极的世界
06-03 856
scroll-snap 是一个用于实现流畅滚动捕捉效果的 CSS 模块。它包含多个属性，可以应用于滚动容器和滚动子项上。
CSS 之 background 系列属性详解
weixin_45092437的博客
03-09 3万+
背景系列属性，共包含9种属性：background-color：设置元素的背景颜色。background-image：设置元素的背景图片。background-size：设置元素背景图片的大小。background-position：设置元素背景图片的位置。background-repeat：设置背景图片是否重复，以及如何重复。background-clip：设置元素背景的渲染区域。background-origin：设置元素背景的定位区域。background-attachment：设置元素的背景图片是否
php中display属性,CSS3中display属性布局详解
weixin_36244383的博客
03-09 207
这次给大家带来CSS3中display属性布局详解，CSS3中display属性布局的注意事项有哪些，下面就是实战案例，一起来看一下。最近在学习微信小程序，在设计首页布局的时候，新认识了一种布局方式display:flex.container {display: flex;flex-direction: column;align-items: center;background-color: #b...
CSS3的border-radius属性详解
祥哥的说
04-03 6390
 CSS3的border-radius属性详解border-radius: none　｜　length{1,4} [/ length{1,4} 其中每一个值可以为 数值或百分比的形式。 length/length　第一个lenght表示水平方向的半径，而第二个表示竖直方向的半径。 如果是一个值，那么 top-left、top-right、bottom-right、bottom-left 四个值相等...
详解CSS中的display:flex||inline-flex属性
09-27
主要给大家介绍了CSS中的display:flex和display:inline-flex属性，文中分别通过两段实例代码给大家介绍了display:flex和display:inline-flex的使用效果，感兴趣的朋友们可以参考借鉴，下面来一起看看吧。
详解css display:box 新属性
09-24
CSS的`display: box`属性是CSS3 Flexbox布局的一部分，它允许开发者更灵活地控制元素及其子元素的布局。这个属性在现代网页设计中已经被`display: flex`所取代，但理解`display: box`的工作原理可以帮助我们更好地...
CSS3 display知识详解
09-24
本篇文章给大家介绍css3 display知识详解，涉及到css3 display相关知识，感兴趣的朋友一起学习吧
css之display属性之inline-block布局实现详解
11-21
`display` 属性是CSS中一个非常重要的属性，它决定了元素如何在页面上布局。`display`属性的主要功能是控制元素生成的框的类型，从而影响元素的布局方式。在这个详解中，我们将深入讨论`display`属性中的`inline`、`...
网站基本布局CSS
m0_46608027的博客
07-24 767
* 滚动条轨道样式 *//* 滚动条样式 *//* 滑块样式 */
css 作业 2
最新发布
没有 bug 的代码是不完美的！
07-25 644
写完了
【css】flex布局父元素宽度或高度无法被子元素撑开-bug记录
qq_2511276124的博客
07-24 269
flex布局父元素宽度或高度无法被子元素撑开问题。 解决方案： ==**手动计算子元素内容所占宽高，手动赋值给父元素即可。**==
html中盒子位子怎么定义,盒子的布局位置box-ordinal-group属性详解
05-23
3. display 属性：用于控制盒子的显示方式，包括 block、inline、inline-block、flex 和 grid 等。 4. float 属性：用于指定盒子的浮动方式，使其脱离文档流并根据指定方向进行浮动。 5. clear 属性：用于控制浮动...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值