css中的display属性有哪些值?各有什么作用?

css中的display属性有哪些值?各有什么作用?

display属性值介绍:

(推荐教程:css快速入门)

none    此元素不会被显示。    

block    此元素将显示为块级元素,此元素前后会带有换行符。    

inline    默认。此元素会被显示为内联元素,元素前后没有换行符。    

立即学习“前端免费学习笔记(深入)”;

inline-block    行内块元素。(CSS2.1 新增的值)    

list-item    此元素会作为列表显示。    

run-in    此元素会根据上下文作为块级元素或内联元素显示。    

compact    CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。    

marker    CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。    

table    此元素会作为块级表格来显示(类似

),表格前后带有换行符。    

inline-table    此元素会作为内联表格来显示(类似

),表格前后没有换行符。    

table-row-group    此元素会作为一个或多个行的分组来显示(类似

)。    

table-header-group    此元素会作为一个或多个行的分组来显示(类似

)。  

(视频教程推荐:css快速入门) 

table-footer-group    此元素会作为一个或多个行的分组来显示(类似

)。    

table-row    此元素会作为一个表格行显示(类似

)。    

table-column-group    此元素会作为一个或多个列的分组来显示(类似

)。    

table-column    此元素会作为一个单元格列显示(类似

)    

table-cell    此元素会作为一个表格单元格显示(类似

)    

table-caption    此元素会作为一个表格标题显示(类似

)    

inherit    规定应该从父元素继承 display 属性的值。    

以上就是css中的display属性有哪些值?各有什么作用?的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2885053.html

(0)
上一篇 2025年3月10日 20:35:05
下一篇 2025年3月8日 19:20:41

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 前端常见css的面试题目

    随着疫情的不断好转,各地都开始逐步的复工,当然对我们来说,也马上迎来所谓的金三银四跳槽季。在此,分享自己在前端领域中积累的一些经验,供自己温故知新。   对于前端来说,涉及的知识面广,内容繁多,但是万变不离其宗,主要也就是围绕着html(5…

    2025年3月10日
    200
  • 谈谈CSS实现水平垂直居中布局的方法

    最近面试的时候,面试官问到了CSS水平垂直居中布局的方式,对于刚入前端没多久的我,无疑是一脸懵逼,闲了赶紧查阅资料分析一波,给各位分享一下,避免落坑。 首先先说明一下html和一些基础css样式,下面就不再赘述!html 垂直水平居中 登录…

    2025年3月10日
    200
  • 在html元素中设置css样式的方式是什么

    如果我们要在HTML元素中设置CSS样式,那么我们就需要在元素中设置”id” 和 “class”选择器。 (推荐教程:CSS教程) 下面我们来分别说一下id选择器和class选择器。 id选择…

    2025年3月10日
    200
  • css如何设置透明度不会影响子元素

    通过RGBA设置透明度,只有最新的浏览器支持,支持IE9+,可通过RGBA的alpha通道的方式设定。 (推荐教程:CSS教程)  显示文字   登录后复制 前三个值是rgb的颜色值,最后一个透明度的值,取值为0~1,值越小越透明。 兼容所…

    2025年3月10日
    200
  • css怎样实现DIV高度自适应

    可以添加表格特性。 (推荐教程:CSS教程) 父级元素添加属性  display: table; 子一级元素添加属性 display: table-cell; 立即学习“前端免费学习笔记(深入)”; 代码:          .div-ro…

    2025年3月10日
    200
  • 利用css实现鼠标悬停效果

    我们先来看下效果: (推荐教程:CSS教程) html代码: 立即学习“前端免费学习笔记(深入)”;                     这是是pic-1                                        这…

    2025年3月10日
    200
  • css如何实现按钮居中显示

    先来看下效果: (推荐教程:CSS教程) 通过简单的Css样式就可以实现 立即学习“前端免费学习笔记(深入)”; 登录后复制 使用margin-left:auto;margin-right:auto; 可以让你的div居中对齐。 .styl…

    2025年3月10日
    200
  • CSS如何清除浮动?3种方法介绍

    css如何清除浮动?本篇文章给大家介绍一下使用css清除浮动的3种方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 首先这里就不讲为什么我们要清楚浮动,反正不清除浮动事多多。 下面我就讲三种常用清除浮动的方法,够用了。…

    2025年3月10日 编程技术
    200
  • 如何利用css实现圆环效果

    css实现圆环效果有多种方法,这里为大家分享五种方法: (推荐教程:CSS教程) 首先我们来看一下实现效果: 立即学习“前端免费学习笔记(深入)”; 接下来为大家介绍方法: 1、两个标签的嵌套      登录后复制 .element1{  …

    2025年3月10日
    200
  • 书写CSS样式有哪三种方式

    书写css样式的三种方式: (推荐教程:CSS教程) 一、行内式 是通过标签的style属性来设置元素的样式,其基本语法格式如下: 立即学习“前端免费学习笔记(深入)”; HelloWord 登录后复制 语法中style是标签的属性,实际上…

    2025年3月10日
    200

发表回复

登录后才能评论