CSS,ͼƬ£¬Ô¤¼ÓÔØÀý×Ó
Ô¤¶ÁÄÚÈݶÔÓÚ²¿·ÖÍøËÙÂý£¬»òÕß¼ÓÔØÄÚÈݹý¶àµÄÒ³Ã棬ÊǷdz£ÓÐЧµÄÌá¸ßÓѺó̶ȵķ½·¨¡£·ÀÖ¹³öÏÖÓÉÓÚÑùʽ±í£¬ºÍ¹Ø¼üͼƬ¼ÓÔØÖͺ󣬵¼ÖµÄÒ³Ãæ²¼¾Ö´íÂÒ£¬ÒÔ¼°¹Ø¼üͼƬ²»ÄÜÂíÉÏչʾ¡£
Ò²¿ÉÒÔ·ÀÖ¹ÓÉÓÚÒ³ÃæÐÅÏ¢¼ÓÔز»È«£¬µ¼ÖÂjs³ö´í¡£
¾¹ýÒ»·¬³¢ÊÔ£¬´Ë·½·¨¿ÉÒÔ¼æÈÝIE¼°ÆäËûä¯ÀÀÆ÷¡£
ÔÚIEÏÂ ÓÃ new Image().src
µÄÐÎʽ½øÐмÓÔØ
ÔÚÆäËûµÄä¯ÀÀÆ÷ÖÐ ÓÃa ¶¯Ì¬<object>
±êÇ©
Ô´ÂëÒÔ¼°DEMO
Demo ÏÂÔصØÖ·£ºhttp://download.csdn.net/source/2327166
ÕâÀïÊÇ×îÖÕµÄʵÏÖ.
ÔÚÕâ¸öÀý×ÓÀïÃ棬ԤÏȼÓÔØÏÂÒ»¸öÒ³ÃæËùÐèÒªµÄ¹Ø¼üÄÚÈÝ. ÄÚÈÝÊÇÒ»¸öCSS, Ò»¸ö JS ºÍÒ»¸ö PNG .
window
.
onload
=
function
(
)
{
var
i
=
0
,
max
=
0
,
o
=
null
,
//
list of stuff to preload
preload
=
[
'
http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.png
'
,
'
http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.js
'
,
'
http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.css
'
]
,
isIE
=
navigator
.
appName
.
indexOf
(
'
Microsoft
'
)
===
0
;
for
(
i
=
0
,
max
=
preload
.
length
;
i
<
max
;
i
+=
1
)
{
if
(
isIE
)
{
new
Image
(
)
.
src
=
preload
[
i
]
;
continue
;
}
o
=
document
.
createElement
(
'
object
'
)
;
o
.
data
=
preload
[
i
]
;
//
IE stuff, otherwise 0x0 is OK
//
o.width = 1;
//
o.height = 1;
//
o.style.visibility = "hidden";
//
o.type = "text/plain"; // IE
o
.
width
=
0
;
o
.
height
=
0
;
//
only FF appends to the head
//
all others require body
document
.
body
.
appendChild
(
o
)
;
}
}
;
A demo is here:
http://phpied.com/files/object-prefetc
Ïà¹ØÎĵµ£º
µÚÒ»Õ£ºÓ¦ÖªµÀ
1.1 DIV+CSS
µÄ½Ð·¨ÊDz»×¼È·µÄ
ÎÒÏë·²ÊÇÀ´µ½“Õâ¸öרÌ┵Äͬѧ£¬ºÜ´ó²¿·ÖÊdzå×ÅDIV+CSSÀ´µÄ£¬Ä¿µÄ¾ÍÊÇѧϰ
DIV+CSSµÄ£¬ËµµÄÔÙÖ±½ÓһЩ¾ÍÊÇѧϰÈçºÎÓÃDIV+CSS²¼¾ÖÒ³Ã棬ÈçºÎ´ÓÒ»ÕÅͼƬÖÆ×÷³É±ê×¼µÄDIV+CSSÒ³Ãæ¡£
Èç¹ûÄã¿´ÍêµÚÒ»¶Î»¹Ã»Óз¢ÏÖ´íÎóµÄ»°£¬ÄÇÄã¾ÍºÜÓб ......
¡¡CSSѧÆðÀ´²¢²»ÄÑ£¬µ«ÔÚ´óÐÍÏîÄ¿ÖУ¬¾Í±äµÃÄÑÒÔ¹ÜÀí£¬ÌرðÊDz»Í¬µÄÈËÔÚCSSÊéд·ç¸ñÉÏÉÔÓв»Í¬£¬ÍŶÓÉϾ͸ü¼ÓÄÑÒÔ¹µÍ¨£¬Îª´Ë×ܽá
ÁËһЩÈçºÎʵÏÖ¸ßЧÕû½àµÄCSS´úÂëÔÔò£º
1
. ʹÓÃResetµ«²¢·ÇÈ«¾ÖReset
¡¡¡¡²»Í¬ä¯ÀÀÆ÷ÔªËصÄĬÈÏÊôÐÔÓÐËù²»Í¬£¬Ê¹ÓÃReset¿ÉÖØÖÃä¯ÀÀÆ÷ÔªËصÄһЩĬÈÏÊôÐÔ£¬ÒÔ´ïµ½ä¯ÀÀÆ÷µÄ¼æÈÝ¡£µ«ÐèÒª×¢Ò ......
CSS£«DIVÊÇÍøÕ¾±ê×¼Öг£ÓõÄÊõÓïÖ®Ò»£¬Í¨³£ÎªÁË˵Ã÷ÓëHTMLÍøÒ³Éè¼ÆÓïÑÔÖеıí¸ñ¶¨Î»·½Ê½µÄÇø±ð£¬ÒòΪXHTMLÍøÕ¾Éè¼Æ±ê×¼ÖУ¬²»ÔÙʹÓñí¸ñ¶¨Î»¼¼Êõ£¬¶øÊDzÉÓÃcss+divµÄ·½Ê½ÊµÏÖ¸÷ÖÖ¶¨Î»¡£ÄÇôʹÓÃDIV+CSS±àÂëʱºÜÈÝÒ×·¸Ò»Ð©´íÎó¡£±¾ÎÄÁоÙÁËһЩ³£¼ûµÄ´íÎó£º
1. ¼ì²éHTMLÔªËØÊÇ·ñÓÐƴд´íÎó¡¢ÊÇ·ñÍü¼Ç½áÊø±ê¼Ç
ÓÐʱºòÎÒÃÇÔÚ ......
//»ñÈ¡Ò»¸öÌض¨ÔªËصÄÑùʽÊôÐÔ
function getStyle(elem,name){
//Èç¹û¸ÃÊôÐÔ´æÔÚÓÚstyleÖÐ ÔòËû×î½ü±»ÉèÖùý
if(elem.style[name]){
return elem.style[name];
}
//·ñÔò³¢ÊÔIE·½·¨
else if(elem.currentStyle){
return elem.currentStyle[name];
//W3C·½·¨
}else if(document.defaultview && document ......
¡¡¡¡IE5¼°ÆäÒÔºó°æ±¾Ö§³ÖÔÚCSSÖÐʹÓÃexpression£¬ÓÃÀ´°ÑCSSÊôÐÔºÍJavas cript±í´ïʽ¹ØÁªÆðÀ´£¬ÕâÀïµÄCSSÊôÐÔ¿ÉÒÔÊÇÔªËعÌÓеÄÊôÐÔ£¬Ò²¿ÉÒÔÊÇ×Ô¶¨ÒåÊôÐÔ¡£¾ÍÊÇ˵CSSÊôÐÔºóÃæ¿ÉÒÔÊÇÒ»¶ÎJavas cript±í´ïʽ£¬CSSÊôÐÔµÄÖµµÈÓÚJavas cript±í´ïʽ¼ÆËãµÄ½á¹û¡£ ÔÚ±í´ïʽÖпÉÒÔÖ±½ÓÒýÓÃÔªËØ×ÔÉíµÄÊôÐԺͷ½·¨£¬Ò² ......