css 小问题

1.为什么使用语义化标签

   1.1、语义化标签可以使人明白标签的含义和作用;1.2.有利于搜索引擎抓取进而有利于站点推广;3.移动设备的无障碍阅读。


2.css优化的方法

   2.1 合理使用简写;2.2 使用工具对css代码进行优化压缩; 2.3 对css代码进行重用 ;2.4  谨慎使用后代选择器,因为后代选择器是css中最昂贵的选择器;

   2.5不要使用标签修饰;2.6 谨慎使用通用选择器,因为其要对所以的标签进行初始化 ;2.7 类选择器、ID选择器前不要加修饰符;

   2.8 去掉0后面的单位;2.9 去掉多余的空格; 2.10 不要使用小图片进行平铺;


3.line-height:150%与line-height:1.5的区别

这个问题设计到line-height的继承性,加入line-height带有单位的话,继承的是计算后的值;不带单位的话继承的是这个参数。

例如:

<div style="line-height:x">(x分别为150%、1.5)

  <p style="font-size:30px;">line-height</p>

</p>

当x=150%时,<p>继承来的line-height为浏览器的font-size*150%,加入浏览器为16px,则实际的line-height为24px,要小于30px,所以字体之间会出现重叠;

当x=1.5时,   <p>继承来的line-height为参数1.5,此时<p>的line-height为30*1.5=45px>30px所以不会出现重叠的问题。

为了应对各种不可知的情况,习惯上不要给line-height任何单位。


4.css的优先级问题  

  4.1.如果浏览器支持important,那么此属性的优先级最高;      4.2.对于不同的选择器,ID>class>tags;

  4.3.最近优先级就越高;  4.4.规定的优先级高于浏览器默认的优先级


5.布局的技术

   可以使用float、负边距、相对定位(绝对定位)来完成布局任务

原文地址:https://www.cnblogs.com/shamoguying1140/p/2760562.html