text-align-last 苹果浏览器(macOS – Safari)兼容的解决方法

text-align-last:justify 用于最后一行元素两端对齐,可以把元素平均的分布在父元素中,并且左右没有空白。 不过苹果浏览器(safari)不支持text-align-last, 解决的方法也很简单。原理是使用伪元素 :after, 添加个最后一行,这样 text-align-last就可以不用了。 text-align-last 兼容的代码 .tal:after { conten

继续阅读

border-collapse把table边框的样式设置成单线

table 默认的情况,如果给单元格,添加边框的时候。每个边框都会有自己的边框。这样看上去就出现了,类似的双边框情况。看上去一点也不美观,还是把边框设置成单线的时候,比较美观。table中有个border-collapse属性,就是用来合并边框的。防止出现“双边框的情况。

继续阅读

css如何让图片或者文字两端对齐

css原生的就支持图片或者文字两端对齐。两端对齐,在css布局中是很常见的。两端对齐,是子元素水平的,均匀的分布在父元素内 。css中使用两端对齐,使用的是 text-align-last:justify 。 之前没怎么使用过两端对齐,之前一直用浮动或者inline-block加宽度来模拟两端对齐, 这里记录一下如何使用text-align-last:justify实现两端对齐。

继续阅读

background url 的双引号,要不写呢?

朋友的一个网站,有一个背景图片不显示。 看了一下源代码,发现背景图是写在双引号里面的。这个没什么问题,平时也是这么写的。怎么感觉双引号有点多呢。仔细一看,这是个行内样式的方式写的, style的内容也是在双引号之间的,这样就有冲突了。 style=”background:url(“mypic.jpg”)” ,这是个错误的写法。

继续阅读