欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
您的位置:DIVCSS5首页 > CSS入门 >

秒懂css布局

 

小技巧知识整合,小白们的福利

设置元素的现实方式

display:block

默认宽度为父级元素宽度

可设置宽高

换行显示

display:inline

默认宽度为内容宽度

不可设置宽高

同行显示

display:inline-block

默认宽度为内容宽度

可以设置高宽

同行显示

整块换行,inline行间换行

默认标签有 表单标签

display:none

设置元素不显示

与visibility:hidden的区别

visibility:hidden仅仅隐藏元素不可见,但是后面元素不能占据他的位置。

块级元素水平居中

1

.content{margin:auto; with:990px;}

居中导航

<ul>

<li>导航</li>

</ul>

float:right

默认宽带为内容宽度

脱离文档流

向指定方向一直移动

float元素在同一文档流

float元素半脱离文档流(对元素,脱离文档流,对内容在文档流)

清除浮动

clearfix

.clearfix:after{content:".";display:block;clear:both;height:0; overflow:hidden;visibility:hidden;}

.clearfix{zoom:1;}

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/rumen/r50851.shtml

我要分享到:

必备CSS教程 Essential CSS Tutorials

必备HTML基础教程 Essential HTML Tutorials

如对文章有任何疑问请提交到DIV CSS论坛,或有任何网页制作CSS问题立即到CSS论坛发贴求解 或 直接DIVCSS5网页顶部搜索遇到DIVCSS疑问。
CSS教程文章修订日期:2018-09-12 22:32 原创:DIVCSS5
本文www.divcss5.com DIVCSS5版权所有。