原文:CSS控制顯示圖片的一部分

使用情形:防止反復請求圖片資源,我們經常采用一張圖片多種效果或內容顯示。 假設我有紙張豎直方向的一張圖片,豎直y軸方向分別是字母:A,B,C.... 現在分別要顯示A B C 等字母,我們的CSS可以這么寫: 這里圖片一個字母所占的width px,height px .mar wordA background: url .. images ranking.gif no repeat scrol ...

2014-10-15 16:38 0 2641 推薦指數:

查看詳情

css “裁剪”圖片顯示圖片一部分

背景:朋友有一個需求,就是列表頁顯示圖片要做裁剪,不然不按比例縮小圖片看起來就變形了。本來想好的解決辦法是用PHP來生成縮略圖,然而試了好幾個開源縮略圖類都沒有一個滿意的,突然想到為什么不直接用CSS呢? <style> #sample{ width ...

Thu May 21 06:44:00 CST 2015 0 16788
CSS從大圖中摳圖然后顯示其中的一部分

相信大家在使用css時會遇到一個情況吧 就是一張大圖片里面什么都有 各種圖標都有 然而自己就是不太會使用其中的小圖標 這是我最近的一次學習 首先上圖 這么大一張圖片 那么這么使其只顯示一部分 並且為我所用勒 這是上代碼 核心的代碼是 這里將div設置為id ...

Sat May 05 22:20:00 CST 2018 0 2325
HTML中圖片的截取一部分顯示

需求:   在一個頁面下生成一個廣告圖片,寬高比為3:1,其實就是把圖片的寬度調整成100%,然后這時候高度肯定是高比寬度的1/3大的,只要將中間的部分顯示出來就行了。將圖片放到一個長寬比為3:1的div中,div的overflow屬性設置成hidden防止被圖片撐大,然后將圖片向上移動,讓中間 ...

Tue Nov 14 07:27:00 CST 2017 0 10697
兩種方法實現用CSS切割圖片只取圖片中一部分

切割圖片這里不是真正的切割,只是用CSS圖片中的一部分而已,主要有兩種方式,一是做為某一元素的背景圖片,二是用img元素的屬性。下面有個不錯的示例,大家可以參考下 切割圖片這里不是真正的切割,只是用CSS圖片中的一部分而已。這樣做的好處就是減少了打開網頁時請求圖片的次數。主要有兩種 ...

Fri Dec 30 07:09:00 CST 2016 0 1585
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM