你知道嗎?有了CSS3,就算不用javascript,我們也可以製作出圖片輪播效果。今天這篇文章就要示範如何單純使用CSS3及HTML製作圖片輪播效果。
要製作純 CSS的輪播效果、就要先充份了解 CSS3 的 transitions 和 animation Read More
你知道嗎?有了CSS3,就算不用javascript,我們也可以製作出圖片輪播效果。今天這篇文章就要示範如何單純使用CSS3及HTML製作圖片輪播效果。
要製作純 CSS的輪播效果、就要先充份了解 CSS3 的 transitions 和 animation Read More
<picture>是一個新的HTML5標籤、我們可以使用它來設定在不同條件下(螢幕寬度、高度、方向、像素密度)載入不同的圖片。
當我們在設計響應式網頁時、對於圖片的處理方式通常會使用較高解析的圖片、再利用CSS將圖片縮小以符合小螢幕的畫面。以下的CSS可以將圖片限制在範圍裡、並且能夠維持圖片的長寬比例。
img {
max-width: 100%;
height: auto;
}