-
实现不定宽块状元素水平居中的方法:
通过给父元素设置float:left然后父元素设置position:relative;left:50%,子元素设置position:relative;left:-50%来实现水平居中。
把元素放在表格单元里,给元素外面套一层<table>...</table>,利用表格不定义宽度时不自动设置成body元素宽度,而是由内容撑开的特性,给table标签设置margin:0 auto;实现水平居中。
查看全部 -
transform属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。是css3里的属性。
transform:translateX();定义X轴的偏移量,正值向右偏移,负值向左偏移。
查看全部 -
优点:
浏览器兼容性好,因为他属生CSS2的内容
缺点:
text-align属性具有继承性,导致子级元素的文本也是居中显示的
查看全部 -
inlinke-block+text-algin属性配合使用
table+margin属性配合使用
absolute+transform属性配合使用
查看全部 -
三种布局实现方式
inline-block + text-align
table + margin
absolute + transform
查看全部 -
两列布局
解释:一列定宽,一列自适应
实现方式:
float + margin 属性配合使用
float + overflow 属性配合使用
display属性的table相关值使用
查看全部 -
多列布局的分类
两列布局
三列布局
圣杯布局与双飞翼布局
等分布局
等高布局
css3 多列布局
查看全部 -
居中布局实现方式
table + margin 实现水平方向居中 , table-cell + vertical-align 实现垂直方向居中
absolute + transform 实现水平方向和垂直方向居中
查看全部 -
垂直居中布局实现方式
table-cell + vertical-align 属性配合使用
absolute + transform 属性配合使用
查看全部 -
lnline-block + text-algin 属性配合使用
table + margin 属性配合使用
absolute + transform 属性配合使用
使用以上三种方式可以实现水平布局
查看全部 -
圣杯布局:定、自适应、定
div:浮动的div要放在前边,没浮动的div才能不独占一行
left
right
enter
css:
left:左浮动
right:右浮动
center:设定左右margin
查看全部 -
两列布局核心代码
查看全部 -
block/inline-block设置宽高有效
inline设置宽高无效。
text-align有继承性,所以子元素如果不需要水平居中,则需再次在子元素设置text-align。
查看全部 -
居中布局第一种
查看全部 -
什么居中布局
既要水平方向居中,也要垂直方向居中
查看全部
举报