cssÖеÄborderÊôÐÔ
¡¡ÖÆ×÷¹ýÍøÒ³µÄÈ˶¼ÓÐΪ»Ïß¶ø·³ÄյľÀú£¬±¾ÎĽéÉܵÄС¼¼ÇÉÒ²Ðí¶ÔÄãÓÐËù°ïÖú¡£ÎÒÃÇÏÈÀ´ÈÏʶһÏ“Border”£¨»±ß¿ò£©£¬ËüÊÇCSSµÄÒ»¸öÊôÐÔ£¬ÓÃËü¿ÉÒÔ¸øÄÜÈ·¶¨·¶Î§µÄHTML±ê¼Ç£¨ÈçTD¡¢DIVµÈµÈ£©»±ß¿ò£¬Ëü¿ÉÒÔ¶¨Òå±ß¿òÏßµÄÀàÐÍ¡¢¿í¶ÈºÍÑÕÉ«£¬ÀûÓÃÕâ¸öÌØÐÔ£¬¿ÉÒÔÖÆ×÷Ò»Ð©ÌØÊâЧ¹û¡£ÏÂÃæ½«Í¨¹ýʵÀýÀ´ËµÃ÷ÆäÓ¦Óü¼ÇÉ¡£
¡¡¡¡1¡¢¸øÎı¾¼Ó±ß¿ò
¡¡¡¡ÉÏÃæµÄʾÀýÖУ¬¸øÒ»¶ÎÎÄ×Ö¼ÓÁ˲»Í¬µÄ±ß¿ò£¬Ö»ÊÇΪÁË˵Ã÷±ß¿òÏßµÄÑÕÉ«¡¢´ÖϸÊǿɱäµÄ¡£µÚÒ»¸ö±ß¿òµÄCSS´úÂëÊÇ£ºstyle="border:thin solid red"£»“border”ºóÃæµÄÈý¸ö²ÎÊýµÄº¬ÒåÊÇ£º±ß¿òÏߵĿí¶ÈÊÇ£ºthin£¨Ï¸Ïߣ©£»±ß¿òÏßµÄÀàÐÍ£ºsolid£¨ÊµÏߣ©£»±ß¿òÏßµÄÑÕÉ«£ºred£¨ºìÉ«£©¡£ÎÒÃǶ¨Òå±ß¿ò£¬Êµ¼ÊÉϾÍÊÇÉ趨ÕâÈý¸ö²ÎÊýÖµ¡£¡¡¡¡±ß¿òÏߵĿí¶ÈÓÐÈý¸ö±ê×¼Öµ£ºthin£¨Ï¸Ïߣ©¡¢medium£¨ÖдÖÏߣ©ºÍthick£¨´ÖÏߣ©£¬´ËÍ⣬Ҳ¿ÉÒÔ×Ô¶¨Òå¿í¶È£¬È磺1pt¡¢5px¡¢2cmµÈ¡£¡¡¡¡±ß¿òÏßµÄÀàÐÍÓоŸöÈ·¶¨Öµ£ºnone£¨Îޱ߿òÏߣ©¡¢ dotted£¨Óɵã×é³ÉµÄÐéÏߣ©¡¢ dashed£¨ÓɶÌÏß×é³ÉµÄÐéÏߣ©¡¢ solid£¨ÊµÏߣ©¡¢ double£¨Ë«Ïߣ¬Ë«Ïß¿í¶È¼ÓÉÏËüÃÇÖ®¼äµÄ¿Õ°×²¿·ÖµÄ¿í¶È¾ÍµÈÓÚborder-width¶¨ÒåµÄ¿í¶È£©¡¢ groove£¨3D¹µ²Û×´µÄ±ß¿ò£©¡¢ ridge£¨3D¼¹×´µÄ±ß¿ò£©¡¢ inset£¨3DÄÚǶ±ß¿ò£¬ÑÕÉ«½ÏÉ¡¢ outset£¨3DÍâǶ±ß¿ò£¬ÑÕÉ«½Ïdz£©£¬×¢Ò⣺Èç¹ûϵͳ²»Ö§³ÖÕâЩ±ß¿òµÄÊôÐÔÖµ£¬ÄÇô“dotted”¡¢“dashed”¡¢“double”¡¢“groove”¡¢“ridge”¡¢“inset”ºÍ“outset”¶¼»á±»“solid”´úÌæ¡£¡¡¡¡±ß¿òÏßµÄÑÕÉ«£º¿ÉÒÔÓÃÊ®Áù½øÖƵÄÑÕÉ«´úÂ룬Èç#00ffcc¡£¡¡¡¡´ÓÉÏÃæ¿ÉÒÔ¿´³ö£¬¸øÎı¾¼Ó±ß¿òȷʵºÜ¼òµ¥£¬ÉÏÀýÖкóÃæÄǼ¸¸ö±ß¿òµÄÉèÖã¬ÎÒ²»½²ÄãÒ²Ã÷°×Á˰ɣ¡ÔÚÕâÀï¸æËßÄãÒ»µãС¼¼ÇÉ£¬¸øÒ»¶ÎÎı¾¼Ó±ß¿ò£¬¿É°ÑCSS¼ÓÔÚ¡´P¡µ±ê¼ÇÀ¸ø¼¸¶ÎÎı¾¼Ó±ß¿ò£¬ÏȰÑÄǼ¸¶ÎÎı¾ÓÃDIV±ê¼ÇÀ¨ÆðÀ´£¬ÔÙ°ÑCSS¼ÓÔÚ¡´DIV¡µ±ê¼ÇÀÈôÊÇÒª¸øÒ»ÐÐÎı¾¼Ó¼¸¸ö²»Í¬µÄ±ß¿ò£¬ÔòÐèÒª°ÑÎı¾·ÅÔÚ±í¸ñÀÔÙ°ÑCSS·Ö±ð¼Óµ½¡´TD¡µ±ê¼ÇÀï¡£
¡¡¡¡2¡¢¸øµ¼º½²Ëµ¥¼Ó·Ö¸ôÏß
¡¡¡¡ÉÏÃæÕâ¸öÀý×ÓÖеÄС°×Ïߣ¬µ±È»¿ÉÒÔÓÃͼÏóÀ´×ö£¬µ«ÎÒÔÚÕâÀïÊÇÓÃCSSµÄ“border”µÄÀ©Õ¹ÊôÐÔ»Á˱߿òµÄÒ»Ìõ±ß£¬ÕâÑù´úÂëÒªÉٵĶࡣ»±ß¿òµÄµ¥±ßÓëÉÏÀýµÄ±ß¿òµÄËÄÌõ±ßÀàËÆ£¬Ò»¸ö±ß¿òµÄËÄÌõ±ßµÄÊôÐÔÈçÏ£º¡¡¡¡±ß¿òÏßÃû³Æ£ºborder-top£¨Éϱ߿òÏߣ©¡¢border-right£¨Óұ߿òÏߣ©¡¢border-bottom£¨Ï±߿òÏߣ©ºÍboder-l
Ïà¹ØÎĵµ£º
ÔÚJSPÒ³ÃæÉϼÓÈë
<%String path = request.getContextPath();%>
<link href="<%=path%>/css/style.css" rel="stylesheet" type="text/css">
ÏÂÁз½Ê½Ã²ËƲ»ÐУº
<link href="../css/style.css" rel="stylesheet" type="text/css">
<link href="../../css/style.css" rel ......
ÎÄ×Ö×Ô¶¯Ê¹ÓÃÑùʽ
.inputText{
border:1px solid #7898b8;
height:20px;
padding-left:2px;
line-height:20px;
background-image:url(images\\inputtext_bg.gif);
background-repeat:repeat-x;
color:#339900;
}
.inputTextÊÇ ×ÖÌå×Ô¶¯ÉèÖÃÑùʽµÄÃû³Æ
¸÷Öֿؼþ×Ô¶¯Ì×ÓÃÑùʽ
±ÈÈçtable,td
table{border-colla ......
/*
*´´½¨ÈË£ºÝþÒËÖÒ
*ÓÃ;£ºÑ§Ï°css£¬Ó¦ÓÃÓÚÐÂÎÅϵͳ
*/
*
{
/*°ÑĬÈÏÖµÉèÖÃΪ0*/
margin: 0;
padding: 0;
border-width: 0;
}
body
{
font-size: 14px;
}
a:link£¬a:visited
{
/*Êó ......
<div id="imgbox" style="height:110px;width:600px;overflow:hidden;">
<div id="imgbox1" style="float:left;width:1000%">
<img src="http://www.google.com.hk/intl/zh-CN/images/logo_cn.gif" mce_src="http://www.google.com.hk/intl/zh-CN/images/logo_cn.gif">
<img src="http://www ......
ä¯ÀÀÆ÷¼æÈÝ¿ÉÒÔ˵ÊÇǰ¶Ë¿ª·¢ËùÒªÃæ¶ÔµÄµÚÒ»¸öÌôÕ½£¬Ä¿Ç°ÎҵĵçÄÔÉÏÒѾ°²×°ÁË6ÖÖä¯ÀÀÆ÷£¨»ùÓÚIEÄں˵IJ»Ë㣬ÈçMaxthonµÈ£©¡£
¡¡¡¡CSS hacksÀûÓÃä¯ÀÀÆ÷µÄ©¶´À´Òþ²ØÌض¨ä¯ÀÀÆ÷µÄCSS¹æÔò¡£ÊµÏÖä¯ÀÀÆ÷¼æÈÝÖ÷ÒªÓÐÁ½ÖÖ·½Ê½Ìõ¼þÑùʽ±íºÍCSS Hacks£¨Selector Hacks¡¢Attribute Hacks£©¡£¶Ô´Ë¸ù¾ÝһЩ×ÊÁÏ»ã×ÜÁËһЩCSS Hacks·½·¨¡ ......