介绍 box-align: | | | |中心基线结束开始伸展; & lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=皍tf-8"祝辞
& lt; style>
div
{
宽度:350 px;
身高:100 px;
边界:1 px固体黑色;/* 10 */Internet Explorer
显示:-ms-flexbox;
-ms-flex-pack:中心;
-ms-flex-align:中心;/* Firefox */显示:-moz-box;
-moz-box-pack:中心;
-moz-box-align:中心;/* Safari, Chrome, Opera */显示:-webkit-box;
-webkit-box-pack:中心;
-webkit-box-align:中心;/* W3C */显示:框;
box-pack:中心;
box-align:中心;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div>
& lt; p>我是居中对齐的。你们;/p>
& lt;/div>
& lt; p> & lt; b>注释:& lt;/b>即不支持box-pack和box-align属性。;/p>
& lt;/body>
& lt;/html>
这篇文章给大家分享的是有关css中box-align属性的使用方法的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。
css box-align属性用于指定箱的子元素的对齐方式,例设置box-align:开始,则对于正常方向的框,每个子元素是顶部对齐。对于反方向的框,每个子元素是底部对齐。目前没有浏览器支持box-align属性,但IE, Firefox, Safari和Chrome都可通过私有属性来支持。
<强>
box-align属性指定箱的子元素如何对齐。
<>强语法:
<强>属性值:
开始:对于正常方向的框,每个子元素的上边缘沿着框的顶边放置。对于反方向的框,每个子元素的下边缘沿着框的底边放置。
结束:对于正常方向的框,每个子元素的下边缘沿着框的底边放置。对于反方向的框,每个子元素的上边缘沿着框的顶边放置。
中心:均等地分割多余的空间,一半位于子元素之上,另一半位于子元素之下。
基线:如果box-orient是内嵌单轴或横向,所有的子元素都置于他们的基线对齐
伸展:拉伸子元素以填充包含块。
<强>注释:
目前没有浏览器支持box-align属性与探险家10通过私有属性-ms-flex-align支持.Firefox通过私有属性——MOZ-box-align支持.Safari和Chrome通过私有属性-WebKit-box-align支持。
<强> css box-align属性示例
效果图:
感谢各位的阅读!关于css中box-align属性的使用方法就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!
