提供Discuz ,ECShop ,PHPCMS ,帝国CMS ,CSS教程 ,PHP教程 ,DedeCMS ,WordPress ,HTML教程等cms问题查询.
当前位置: CSS教程 > css display属性怎样用【css教程】,display属性

display属性定义及用法

display属性在网页规划顶用的异常之多,它的属性值也比较多,然则用的多的就block、inline-block、inline和none属性值,别的属性值很少见,一切在这就重点引见一下常常使用的这几个属性值的用法;

在css中,display属性是用来定义元素应当生成的框的范例,经常常使用来将块状元素转换为内联元素、将内联元素转换为块状元素或许将块状元素/内联元素转换为inline-block元素,inline-block元素既有块状元素的特征已有内联元素的特征。

display属性语法花样

1.css语法:display:none/inline/block/inline-block/list-item/run-in/table/inline-table/table-row-group/table-header-group/table-footer-group/table-row/table-colume-group/table-column/table-cell/table-caption/inherit

2.JavaScript 语法: object.style.display="inline"

display属性值申明

none:设置元素不显现

block:设置元素为块级元素

inline:设置元素为内联元素

inline-block:行内块元素,既有块状元素的特征已有内联元素的特征

list-item:设置元素为列表

run-in:依据上下文作为块级元素或内联元素显现

compact / marker:已从CSS2.1中删除

table:设置元素为块级表格来(相似 <table>),表格前后有换行符

inline-table:设置元素为内联表格(相似 <table>),表格前后没有换行符

table-row-group:设置元素为一个或多个行的分组(相似 <tbody>)

table-header-group :相似 <thead>标签

table-footer-group:相似 <tfoot>标签;table-row :相似 <tr>标签

display属性的none属性值

元素的display属性的属性值设置为none时,该元素将隐蔽不显现,而其会离开文档流,不占有网页空间;异常相干:css隐蔽元素之display和visibility属性的用法笔记

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>display属性的none属性值</title>
<style type="text/css">
body{background-color: #aaa;}
.div{width:400px;height:60px;border:1px solid;margin-top:10px;}
.none{display:none;}
</style>
</head>
<body>
<div class="div">元素1</div>
<div class="div none">元素2</div>
<div class="div">元素3</div>
</body>
</html>

以上就是css display属性怎样用的细致内容,更多请关注ki4网别的相干文章!

「梦想一旦被付诸行动,就会变得神圣,如果觉得我的文章对您有用,请帮助本站成长」

分享到:
赞(0) 打赏

支付宝扫一扫打赏

微信扫一扫打赏

标签:

上一篇:

下一篇:

相关推荐

0 条评论关于"css display属性怎样用【css教程】,display属性"

最新评论

    暂无留言哦~~

博客简介

看古风美女插画Cos小姐姐,素材合集图集打包下载:炫龙网,好看二次元插画应有尽有,唯美小姐姐等你来。

友情链接

他们同样是一群网虫,却不是每天泡在网上游走在淘宝和网游之间、刷着本来就快要透支的信用卡。他们或许没有踏出国门一步,但同学却不局限在一国一校,而是遍及全球!申请交换友链

服务热线:
 

 QQ在线交流

 旺旺在线