解析:

 .texthidden { display:block;/*统一转化为块级元素*/ overflow: hidden; width: 0;
height: 0; }
就像上面的一段 CSS 所展示的方法，将宽度和高度设定为 0，然后超过部分隐藏，
就会弥补上述一、二方法中的缺陷，也达到了隐藏内容的目的。 

解析:

 比如：Bootstrap，流式栅格系统 

解析:

 @media screen and (min-width: 400px) and (max-width: 700px) { … }
@media handheld and (min-width: 20em), screen and (min-width: 20em) {….}
媒体查询，就是响应式布局。 

解析:

 <svg xmlns=”http://www.w3.org/2000/svg”xmlns:xlink=”http://www.w3.org/1999/xlink”>
<circle cx=”40″ cy=”40″ r=”24″ style=”stroke:#006600; fill:#00cc00″/>
<text x=”250″ y=”150″ font-family=”Verdana”font-size=”10px”fill=”blue”>Hello,
out there</text>
<defs><style type= ” text/css ” >
<![CDATA[.sample{stroke:blue;fill:#0080FF;opacity:1;}]]></style></defs>
<use xlink:href=”#sample1″ class=”sample”/>
</svg> 

解析:

 又能保证我们的 CSS 整洁易读。但是这些神奇的选择器会浪费很多的浏览器资源。）