插入背景圖問題
比如,這個案例里的,這是圖片文件夾里的,在css里插入左半邊圖的時,要怎么操作?
這是作者代碼,我看不懂,求解
.login_logo_webqq {
? ? ? ? ? ? background: url('../images/login_window_logo.png') no-repeat -210px -0px;
? ? ? ? ? ? margin-left: 100px;
? ? ? ? ? ? margin-top: 10px;
? ? ? ? ? ? width: 200px;
? ? ? ? ? ? height: 44px;
? ? ? ? ? ? cursor: move;
? ? ? ? }
2016-09-24
這就是常說的雪碧圖方法了,簡單來說就是插入一張較大的背景圖,然后使用參數(shù)限定背景圖中的某一部分顯示在元素背景上。
background: url('../images/login_window_logo.png') no-repeat -210px -0px;
這條語句的意思是:
插入背景圖:../images/login_window_logo.png;
不重復顯示該背景:no-repeat
-210px -0px:從背景圖的-210px -0px;坐標開始,截取背景圖中大小為width: 200px;height: 44px;的一部分作為該元素的背景
可以理解為,我們雖然加載了一張大圖,但是只使用其中的一部分
這樣的好處是,一次性加載包含很多圖片的大圖,通過該方法每次使用圖片中一部分,減少了服務器請求次數(shù),降低服務器載荷。
2016-09-24
#close{
background: url("../images/boxy_btn.png") no-repeat;
width:28px;
height:28px;
float: right;
margin-right: -10px;?
margin-top: -10px;
cursor: pointer;
}
這個代碼里,我把width和height去掉,背景圖就顯示不出來了,能解釋一下嗎
2016-09-24
-210px -0px,這部分的相對原點是哪里?