css记录

2018-03-30 本文已影响8人 dogLin

overflow: hidden;
text-overflow: ellipsis; 
white-space: nowrap;

display:none的效果是将元素从DOM中去掉，并且其他的元素会占用他的原来位置。
visibility:hidden的效果是元素依然存在DOM树中，并且原来的位置变成空白。

div在不设置word-break:break-all的样式的话，如果div内容全部为英文或者数字的话，内容内的文字不会自动换行。

在写LESS的时候发现在less中加入calc时出现了问题：
在less中这么写：

div {
    width : calc(100% +30px);
}

结果Less把这个当成运算式去执行了，结果给我解析成这样：

div {
  width: calc(130%);
}

于是，我把Less改写成这样：

div {
    width : calc(~"100% + 30px");
}

解析结果正常：

div {
  width: calc(100% + 30px);
}

如果用到变量应该这么写：

div {
    @diff : 30px;
    width : calc(~"100% + @{diff}");
 }