ç¨css设置ç½é¡µä¸ç
èæ¯å¾çï¼ä¸»è¦æå¦ä¸å 个å±æ§ï¼
1ï¼èæ¯é¢è² {">说æï¼åæ°åå¼åé¢è²å±æ§ä¸æ ·æ³¨æï¼å¨HTMLå½ä¸ï¼è¦ä¸ºæ个对象å ä¸èæ¯è²åªæä¸ç§åæ³ï¼é£å°±æ¯å
åä¸ä¸ªè¡¨æ ¼ï¼å¨è¡¨æ ¼ä¸è®¾ç½®å®èæ¯è²ï¼åæ对象æ¾è¿åå
æ ¼ãè¿æ ·åæ¯è¾éº»ç¦ï¼ä¸ä½ä»£ç è¾å¤ï¼è¿è¦ä¸ºè¡¨æ ¼ç大å°åå®ä½ä¼¤äºèçãç°å¨ç¨CSSå°±å¯ä»¥è½»æ¾å°ç´æ¥æå®äºï¼èä¸å¯¹è±¡çèå´å¾å¹¿ï¼å¯ä»¥æ¯ä¸æ®µæåï¼ä¹å¯ä»¥åªæ¯ä¸ä¸ªåè¯æä¸ä¸ªåæ¯ãä¾åï¼ç»é¨åæåå èæ¯é¢è²ç»é¨åæåå èæ¯é¢è²è¡¨æ ¼èå½±é¢è²ï¼
代ç 示ä¾:
style=" margin-left: 0px; padding: 0px; clear: both; line-height: 24px;">
2ï¼èæ¯å¾çï¼background-image
è¯æ³ï¼{background-image: url(URL)|none}说æï¼ URLå°±æ¯èæ¯å¾ççåæ¾è·¯å¾ãå¦æç¨ânoneâæ¥ä»£æ¿èæ¯å¾ççåæ¾è·¯å¾ï¼å°ä»ä¹ä¹ä¸æ¾ç¤ºãä¾åï¼ç»é¨åæåå èæ¯å¾ç
代ç 示ä¾:
.imgbgstyle { background-image: url(logo.gif)}
3ï¼èæ¯éå¤ï¼background-repeat
è¯æ³ï¼{background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}ä½ç¨ï¼èæ¯å¾çéå¤æ§å¶çæ¯èæ¯å¾çå¹³éºä¸å¦ï¼ä¹å°±æ¯è¯´ï¼ç»åèæ¯å®ä½çæ§å¶å¯ä»¥å¨ç½é¡µä¸çæå¤åç¬æ¾ç¤ºä¸å¹
èæ¯å¾ç
说æï¼åæ°åå¼èå´ï¼
·inherit 继æ¿Â·no-repeat ä¸éå¤å¹³éºèæ¯å¾ç·repeat·repeat-x 使å¾çåªå¨æ°´å¹³æ¹åä¸å¹³éºÂ·repeat-y 使å¾çåªå¨åç´æ¹åä¸å¹³éº
注æï¼å¦æä¸æå®èæ¯å¾çéå¤å±æ§ï¼æµè§å¨é»è®¤çæ¯èæ¯å¾çåæ°´å¹³ãåç´ä¸¤ä¸ªæ¹åä¸å¹³éºã
4ï¼èæ¯åºå®ï¼background-attachment
è¯æ³ï¼{background-attachment:fixed|scroll}说æï¼åæ°åå¼èå´
·fixedï¼ç½é¡µæ»å¨æ¶ï¼èæ¯å¾çç¸å¯¹äºæµè§å¨ççªå£èè¨ï¼åºå®ä¸å¨Â·scrollï¼ç½é¡µæ»å¨æ¶ï¼èæ¯å¾çç¸å¯¹äºæµè§å¨ççªå£èè¨ï¼ä¸èµ·æ»å¨
注æï¼èæ¯å¾çåºå®æ§å¶èæ¯å¾çæ¯å¦éç½é¡µçæ»å¨èæ»å¨ãå¦æä¸è®¾ç½®èæ¯å¾çåºå®å±æ§ï¼æµè§å¨é»è®¤èæ¯å¾çéç½é¡µçæ»å¨èæ»å¨ã为äºé¿å
è¿äºè±å¨çèæ¯å¾çå¨æ»å¨æ¶ä¼¤å®³æµè§è
çè§åï¼æ以å¯ä»¥è§£é¤èæ¯å¾çåæåå
容çæç»ï¼è¯¥ä¸ºåæµè§å¨çªå£æç»ã
ä¾åï¼ä½¿èæ¯å¾æ¡ä¸éæåâæ»å¨âçCSS
代ç 示ä¾:
BODY { background: purple url(bg.jpg); background-repeat:repeat-y; background-attachment:fixed }
5ï¼èæ¯å®ä½ï¼background-position
è¯æ³ï¼{background-position:æ°å¼|top|bottom|left|right|center}ä½ç¨ï¼èæ¯å®ä½ç¨äºæ§å¶èæ¯å¾çå¨ç½é¡µä¸æ¾ç¤ºçä½ç½®ã说æï¼åæ°åå¼èå´
·带
é¿åº¦åä½çæ°ååæ°Â·topï¼ç¸å¯¹åæ¯å¯¹è±¡é¡¶å¯¹é½Â·bottomï¼ç¸å¯¹åæ¯å¯¹è±¡åºå¯¹é½Â·leftï¼ç¸å¯¹åæ¯å¯¹è±¡å·¦å¯¹é½Â·rightï¼ç¸å¯¹åæ¯å¯¹è±¡å³å¯¹é½Â·centerï¼ç¸å¯¹åæ¯å¯¹è±¡ä¸å¿å¯¹é½
·æ¯ä¾å
³ç³»
å
³é®å解é:top left = left top = 0% 0%