CSS ³õ¼¶½Ì³Ì
CSS ¸ÅÊö
CSS Ö¸²ãµþÑùʽ±í (Cascading Style Sheets)
Ñùʽ¶¨ÒåÈçºÎÏÔʾ HTML ÔªËØ
Ñùʽͨ³£´æ´¢ÔÚÑùʽ±íÖÐ
°ÑÑùʽÌí¼Óµ½ HTML 4.0 ÖУ¬ÊÇΪÁ˽â¾öÄÚÈÝÓë±íÏÖ·ÖÀëµÄÎÊÌâ
ÍⲿÑùʽ±í¿ÉÒÔ¼«´óÌá¸ß¹¤×÷ЧÂÊ
ÍⲿÑùʽ±íͨ³£´æ´¢ÔÚ CSS ÎļþÖÐ
¶à¸öÑùʽ¶¨Òå¿É²ãµþΪһ
Ñùʽ½â¾öÁËÒ»¸öÆÕ±éµÄÎÊÌâ
HTML ±êÇ©Ô±¾±»Éè¼ÆΪÓÃÓÚ¶¨ÒåÎĵµÄÚÈÝ¡£Í¨¹ýʹÓà <h1>, <p>, <table> ÕâÑùµÄ±êÇ©£¬HTML µ±³õ±»Ö¸ÍûÓÃÀ´±í´ï“ÕâÊDZêÌ┡¢“ÕâÊǶÎÂ䔡¢“ÕâÊDZí¸ñ”Ö®ÀàµÄÐÅÏ¢¡£¶øÎĵµµÄ²¼¾Ö±»ÆÚÍûÓÉä¯ÀÀÆ÷À´Íê³É£¬¶ø²»Ê¹ÓÃÈκεĸñʽ»¯±êÇ©¡£
ÓÉÓÚÁ½ÖÖÖ÷ÒªµÄä¯ÀÀÆ÷£¨Netscape ºÍ Internet Explorer£©²»¶ÏµØ½«Ð嵀 HTML ±êÇ©ºÍÊôÐÔ£¨±ÈÈç×ÖÌå±êÇ©ºÍÑÕÉ«ÊôÐÔ£©Ìí¼Óµ½ HTML ¹æ·¶Ö®ÖУ¬Òò´Ë´´½¨ÎĵµÄÚÈÝÇåÎúµØ¶ÀÁ¢ÓÚÎĵµ±íÏÖ²ãµÄÕ¾µã±äµÃÔ½À´Ô½À§ÄÑ¡£
ΪÁ˽â¾öÕâ¸öÎÊÌ⣬ÍòάÍøÁªÃË£¨W3C£©£¬Õâ¸ö·ÇÓªÀûµÄ±ê×¼»¯ÁªÃË£¬¼ç¸ºÆðÁË HTML ±ê×¼»¯µÄʹÃü£¬²¢ÔÚ HTML 4.0 Ö®Íâ´´Ôì³ö STYLES£¨Ñùʽ£©¡£
ËùÓеÄÖ÷Á÷ä¯ÀÀÆ÷¾ùÖ§³Ö²ãµþÑùʽ±í¡£
Ñùʽ±í¼«´óµØÌá¸ßÁ˹¤×÷ЧÂÊ
Ñùʽ±í¶¨ÒåÈçºÎÏÔʾ HTML ÔªËØ£¬ÖîÈç HTML 3.2 µÄÑùʽÖеÄ×ÖÌå±êÇ©ºÍÑÕÉ«ÊôÐÔͨ³£±»±£´æÔÚÍⲿµÄ .css ÎļþÖС£Í¨¹ý½ö½ö±à¼Ò»¸ö¼òµ¥µÄ CSS Îĵµ£¬ÍⲿÑùʽ±íʹÄãÓÐÄÜÁ¦Í¬Ê±¸Ä±äÕ¾µãÖÐËùÓÐÒ³Ãæ²¼¾ÖµÄÍâ¹Û¡£
ÓÉÓÚÔÊÐíͬʱ¿ØÖƶàÖØÒ³ÃæµÄÑùʽºÍ²¼¾Ö£¬CSS ¿ÉÒԳƵÃÉÏ WEB Éè¼ÆÁìÓòµÄÒ»¸öÍ»ÆÆ¡£×÷ΪÍøÕ¾¿ª·¢Õߣ¬Äã¿ÉÒÔΪÿ¸ö HTML ÔªËض¨ÒåÑùʽ£¬²¢½«Ö®Ó¦ÓÃÓÚÄãÏ£ÍûµÄÈÎÒâ¶àµÄÒ³ÃæÖС£ÈçÐè½øÐÐÈ«¾Ö±ä»»£¬Ö»Ðè¼òµ¥µØ¸Ä±äÑùʽ£¬È»ºóÍøÕ¾ÖеÄËùÓÐÔªËؾù»á±»×Ô¶¯µØ¸üС£
¶àÖØÑùʽ½«²ãµþΪһ¸ö
Ñùʽ±íÔÊÐíÒÔ¶àÖÖ·½Ê½¹æ¶¨ÑùʽÐÅÏ¢¡£Ñùʽ¿ÉÒÔ±»¹æ¶¨ÓÚµ¥¸öµÄ HTML ÔªËØÖУ¬ÔÚ HTML Ò³µÄÍ·ÔªËØÖУ¬»òÔÚÒ»¸öÍⲿµÄ CSS ÎļþÖС£ÉõÖÁ¿ÉÒÔÔÚÒ»¸öµ¥Ò»µÄ HTML ÎĵµÄÚ²¿ÒýÓöà¸öÍⲿÑùʽ±í¡£
²ãµþ´ÎÐò
µ±Í¬Ò»¸öHTMLÔªËر»²»Ö¹Ò»¸öÑùʽËù¶¨Òåʱ£¬»áʹÓÃÄĸöÑùʽÄØ£¿
Ò»°ã¶øÑÔ£¬ËùÓеÄÑùʽ»á¸ù¾ÝÏÂÃæµÄ¹æÔò²ãµþÓÚÒ»¸öеÄÐéÄâÑùʽ±íÖУ¬ÆäÖÐÊý×Ö 4 ÓµÓÐ×î¸ßµÄÓÅÏÈȨ¡£
ä¯ÀÀÆ÷ȱʡÉèÖÃ
ÍⲿÑùʽ±í
ÄÚ²¿Ñùʽ±í£¨Î»ÓÚ <head> ±êÇ©ÄÚ²¿£©
ÄÚÁªÑùʽ£¨ÔÚ HTML ÔªËØÄÚ²¿£©
Òò´Ë£¬ÄÚÁªÑùʽ£¨ÔÚ HTML ÔªËØÄÚ²¿£©ÓµÓÐ×î¸ßµÄÓÅÏÈȨ£¬ÕâÒâζ×ÅËü½«ÓÅÏÈÓÚÒÔϵÄÑùʽÉùÃ÷£º<head> ±êÇ©ÖеÄÑùʽÉùÃ÷£¬ÍⲿÑùʽ±íÖеÄÑùʽÉùÃ÷£¬»òÕßä¯ÀÀÆ÷ÖеÄÑùʽÉùÃ÷£¨
Ïà¹ØÎĵµ£º
ÍøÒ³Éè¼ÆDIV+CSSÔªËؽâÎö£¬<head>²¿·ÖÇ°£º
£¨Ò»£© DOCTYPE ºÍDTD
ÓÃDWн¨Íøҳʱ£¬×Ü»áÉú³ÉÒ»¾ä
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Õâ¾äÊÇDOCTYPEÉùÃ÷£¬DOCTY ......
ÓÃcssʵÏÖÍøÒ³±³¾°½¥±äµÄ´úÂëÈçÏ£º
Ò»¡¢´ÓÉÏÍùϽ¥±ä
Example Source Code [www.mb5u.com]
body{
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);
}
¶þ¡¢´Ó×óÉÏÖÁÓÒϽ¥±ä
Example Source Code [www.mb5u.com]
body{
FILTER: Alpha( style=1, ......
1.ÔÚJSPÖÐÉú³É¶¯Ì¬XML
¿ÉÒÔʹÓÃJSPÉú³ÉXML,ʹÓÃCSS»òÕßXSLת»»ºÍÏÔʾXML;
Ö»ÒªÔÚ¾²Ì¬µÄXMLÎĵµÄ£°åÖмÓÈëJava´úÂëºÍJSP±ê¼Ç£¬XML¾Í¿ÉÒÔÓо²±ä¶¯£¬²úÉú¶¯Ì¬µÄÄÚÈÝ£¬Éú³ÉXMLÎĵµµÄ·½·¨ºÜ¼òµ¥£¬Ö»ÐèÒªÔÚÎļþÖÐʹÓÃÖ¸Áîcontenttype,Èç<%@ page contenttype="text/xml"%>£»
ÔÚXMLÎĵµÖÐͬÑù¿ÉÒÔʹ ......
1¡¢ÍøÒ³¾ÓÖÐÏÔʾ£º
ÐèÒªÉèÖÃÁ½¸öµØ·½£¬Ò»¸öÊÇbody£¬Ò»¸öÊÇÍâ±ß¿òdiv¡£
CSS£º
body{
margin:0;
padding:0;
text-align:center;
}
#main{ /*×îÍâ²ãDIV*/
width:760px;
margin:0 auto;
padding:0
}
2¡¢ÎÄ×Ö´¹Ö±¾ ......