ʹÓÃĸ°æÒ³Ê±ÄÚÈÝÒ³ÈçºÎ¼ÓÈëcssºÍjavascript
×î½üÒ»Ö±ºÜ棬×öÒ»¸öѧУµÄÍøÕ¾ÏîÄ¿£¬ÊÇasp.net2.0£¬×öÕâ¸öÏîÄ¿¹ý³ÌÖÐÓкöà¾Ñé¿ÉÒÔ×ܽáһϣ¬²»¹ýÏÖÔÚÏîÄ¿½ø¶ÈºÜ½ô£¬ÏÈ·ÅÒ»·Å£¬µÈ×öÍêÁËÒ»Æð×ܽáһϡ£½ñÌì¼òµ¥Ð´Ð´Ê¹ÓÃĸ°æÒ³Ê±ÄÚÈÝÒ³ÖÐÈçºÎʹÓÃcssºÍjavascriptµÄÎÊÌâ¡£
ÓÉÓÚÍøÕ¾µÄÖ÷ҪƵµÀÒ³ºÍÁбíÒ³µÄÍ·²¿ºÍµ×²¿¶¼ÊÇÒ»ÑùµÄ£¬Èç¹û½«Ã¿¸öÒ³Ãæ·ÅÔÚµ¥¶ÀµÄÒ³ÃæÖУ¬µ±Í·²¿ºÍµ×²¿ÐèÒª¸ü¸Äʱά»¤Á¿Ì«´ó¡£ÓÚÊÇÏë°ÑÍ·²¿ºÍµ×²¿×ö³Éĸ°æÒ³£¬ÆµµÀÒ³ºÍÁбíÒ³µÄ¾ßÌåÄÚÈݷŵ½ÄÚÈÝÒ³ÖС£ÕâÑùµ±Í·ºÍµ×ÐèÒª¸Ä¶¯Ê±£¬Ö»ÒªÐÞ¸ÄÒ»ÏÂĸ°æÒ³¾Í¿ÉÒÔÁË¡£
ºÃ´¦ÓÐÁË£¬ÎÊÌâÒ²½Ó×ÅÀ´ÁË¡£ÔÀ´ÔÚÆµµÀÒ³ºÍÁбíÒ³ÖÐÓÐÆä¸÷×ÔµÄcssÒýÈëºÍһЩjavascriptº¯Êý£¬µ±Ê¹ÓÃĸ°æÒ³Ê±£¬·ÅÔÚÄÚÈÝÒ³ÖÐÕâЩcssÑùʽºÍ javascriptº¯ÊýÔõô´¦ÀíÄØ£¿ÒòΪ´ó¼ÒÖªµÀ£¬Ê¹ÓÃĸ°æÒ³µÄÄÚÈÝÒ³ÊDz»Äܰüº¬<head></head>±ê¼ÇµÄ£¬¶øcss ºÍjavascriptº¯ÊýµÄÉùÃ÷ÊÇÒª·Åµ½<head></head>ÖмäµÄ£¬ÕâЩcssÑùʽºÍjavascriptº¯ÊýÈçºÎ´¦ ÀíÄØ£¿ÉÏÍø²éÁËһϣ¬´óÖÂÓÐÈýÖÖ½â¾ö·½°¸£º·½°¸Ò»£º°ÑËùÓеÄcssÑùʽºÍjavascriptº¯Êý·Åµ½Ä¸°æÒ³µÄ<head></head>ÖУ¬ ÎÒ¾õµÃÕâÑù×öµÄ±×¶Ë¾ÍÊǵ¼ÖÂĸ°æÒ³µÄ<head></head>ÇøÌØ±ðÓ·Ö×£¬Í¬Ê±Èç¹ûÔÀ´Á½¸öƵµÀÒ³Öаüº¬Í¬ÃûµÄcssÉùÃ÷»ò javascriptº¯Êý£¬µ«È´ÊDz»Í¬Ñùʽ»òÖ´Ðв»Í¬²Ù×÷£¬Ôõô°ìÄØ£¿ËùÒÔÕâµÚÒ»ÖÖ·½°¸ºÜ¿ì±»ÎÒ·ñ¶¨ÁË¡£·½°¸¶þÊÇÔÚÄÚÈÝÒ³µÄPageLoadʼþÖÐͨ¹ý´ú ÂëÀ´Ö¸¶¨±¾ÄÚÈÝÒ³µÄcssÎļþ¡£¾ßÌå´úÂëÈçÏ£º
static public class ControlHelper
{
static public void AddStyleSheet(Page page, string cssPath)
{
HtmlLink link = new HtmlLink();
link.Href = cssPath;
link.Attributes["rel"] = "stylesheet";
link.Attributes["type"] = "text/css";
page.Header.Controls.Add(link);
}
}
ÕâÑù£¬ÔÚ¾ßÌåÒ³Ãæ£¬ÎÒÃǾͿÉÒÔͨ¹ýÈçÏ´úÂëÌí¼Ó CSS ÒýÓãº
protected void Page_Load(object sender, EventArgs e)
{
ControlHelper.AddStyle
Ïà¹ØÎĵµ£º
<style>
.a
{
background-color:#000000;
}
.b
{
background-color:#ffffff;
}
</style>
<ul>
<li id="aaa1" onclick="setClassName(this,'a')"> <a href="#">aaaa</a> </li>
<li id="aaa2" onclick="setClassName(this,'a')"> <a href="#"&g ......
¡¡¡¡ÆÁ±ÎIEä¯ÀÀÆ÷£¨Ò²¾ÍÊÇIEϲ»ÏÔʾ£©*:lang(zh) select {font:12px !important;} /*FF,OP¿É¼û£¬ÌرðÌáÐÑ£ºÓÉÓÚOpera×î½üµÄÉý¼¶£¬Ä¿Ç°´Ë¾äֻΪFFËùʶ±ð*/
¡¡¡¡select:empty {font:12px !important;} /*safari¿É¼û*/
¡¡¡¡ÕâÀïselectÊÇÑ¡Ôñ·û£¬¸ù¾ÝÇé¿ö¸ü»»¡£µÚ¶þ¾äÊÇMACÉÏsafariä¯ÀÀÆ÷¶ÀÓеġ£½öIE7ÓëIE5.0¿ÉÒÔʶ±ð*+html ......
overflow´Ó×ÖÃæÒâÒåÉÏÀ´½²¾ÍÊÇÒç³öµÄÒâ˼£¬»»¾ä»°Ëµ£¬ÄãÓиö²ã£¬µ«ÊÇÀïÃæµÄÄÚÈÝ£¬Í¼Æ¬»òÕßÎÄ×ÖÒª±È²ã´ó£¬overflow¾ÍÊÇÕë¶ÔÕâÖÖÇé¿ö½øÐд¦ÀíµÄ¡£
°üº¬4¸öÊôÐÔÖµ£¬visible,hidden,auto,scroll
visible¾ÍÊdz¬³öµÄÄÚÈÝÈÔÈ»Õý³£±»ÏÔʾ³öÀ´¡£
hidden¾ÍÊdz¬³öµÄÄÚÈݱ»Òþ²Ø¡£ &nbs ......
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ÎÞ±êÌâÎĵµ</title>
<style type="text/css">
#wai{
width:500px;
height:500px;
background-color: #990;
}
#nei {
float:left;
width:200p ......
ÔÚ½øÐÐÒ³ÃæÉè¼ÆµÄʱºò£¬ÏàÐÅÏÂÃæÕâЩ¶«Î÷Ó¦¸ÃÄܹ»°ïÖúÄ㣬DIV+CSS£¬Ï£Íû¿ÉÒÔΪÄã½Úʡһµãʱ¼ä¡£
Ò»¡¢ ÉÆÓÃcssËõд¹æÔò
/*×¢ÒâÉÏ¡¢ÓÒ¡¢Ï¡¢×óµÄÊéд˳Ðò*/
1. ¹ØÓڱ߾ࣨ4±ß£©£º
1px 2px 3px 4px (ÉÏ¡¢Ó ......