css常見問題及技巧

1.父級元素如<a>已經設置成了塊級元素(display:block),子元素如<img>設置了float,這時父元素a依然無高度沒有被撐開

解決：在<a>元素的樣式中添加overflow:hidden 

2.媒體查詢功能@media screen and(min-width: 1280px){xxxxx:xxxxx}這樣書寫瀏覽器可能不會解析成功,and與後面的括號要分開

解決： @media screen and (min-width: 1280px){xxxxx:xxxxx}

3.爲了讓圖片不管在什麼屏幕大小下，均可以按照指定比例來顯示，而且不會有加載時的跳躍感能夠利用padding屬性。

<div class="article_cover" style="width:100%;padding-top:57%;background-image:url(http://xxxxx.png);background-size:contain">

</div>