html – 对齐内联块中心
发布时间:2020-12-14 19:43:03 所属栏目:资源 来源:网络整理
导读:中心对齐内联块元素的最简单方法是什么? 理想情况下,我不想为元素设置宽度.这种方式取决于在元素内输入的文本,内联块元素将扩展到新的宽度,而不必改变CSS内的宽度.内联块元素应该彼此重心(不是并排),以及元素内的文本. 请参阅下面的代码或参见jsFiddle. 当
中心对齐内联块元素的最简单方法是什么?
理想情况下,我不想为元素设置宽度.这种方式取决于在元素内输入的文本,内联块元素将扩展到新的宽度,而不必改变CSS内的宽度.内联块元素应该彼此重心(不是并排),以及元素内的文本. 请参阅下面的代码或参见jsFiddle. 当前的HTML: <div> <h2>Hello,John Doe.</h2> <h2>Welcome and have a wonderful day.</h2> </div> 目前的SCSS: @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600); body { margin: 0 auto; background: rgba(51,51,1); font-family: 'Open Sans',sans-serif; } div { width: 100%; height: auto; margin: 15% 0; text-align: center; h2 { margin: 0 auto; padding: 10px; text-align: center; float: left; clear: left; display: inline-block; &:first-child { color: black; background: rgba(255,255,1); } &:last-child { color: white; background: rgba(117,80,161,1); } } } 在两个元素之间添加一个br并取出浮动:left / clear:left可能是最简单的方法;但是,如果有另一种方式,我很好奇. 解决方法
像这样?
http://jsfiddle.net/bcL023ko/3/ 移除浮动:左侧并添加边距:0自动使元素居中.或者它是您正在寻找的其他东西?
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |