锘??xml version="1.0" encoding="utf-8" standalone="yes"?>
Database access
鏍囩搴撲腑鐨勬爣絳劇敤鏉ユ彁渚涘湪
JSP
欏甸潰涓彲浠ヤ笌鏁版嵁搴撹繘琛屼氦浜掔殑鍔熻兘錛岃櫧鐒跺畠鐨勫瓨鍦ㄥ浜庢棭鏈熺函
JSP
寮鍙戠殑搴旂敤浠ュ強灝忓瀷鐨勫紑鍙戞湁鐫鎰忎箟閲嶅ぇ鐨勮礎鐚紝浣嗘槸瀵逛簬
MVC
妯″瀷鏉ヨ錛屽畠鍗存槸榪濆弽瑙勮寖鐨勩傚洜涓轟笌鏁版嵁搴撲氦浜掔殑宸ヤ綔鏈韓灝卞睘浜庝笟鍔¢昏緫灞傜殑宸ヤ綔錛屾墍浠ヤ笉搴旇鍦?/span>
JSP
欏甸潰涓嚭鐜幫紝鑰屾槸搴旇鍦ㄦā鍨嬪眰涓繘琛屻?/span>
瀵逛簬
Database access
鏍囩搴撴湰涔︿笉浣滈噸鐐逛粙緇嶏紝鍙粰鍑哄嚑涓畝鍗曠ず渚嬭璇昏呯暐寰簡瑙e畠浠殑鍔熻兘銆?/span>
Database access
鏍囩搴撴湁浠ヤ笅
6
緇勬爣絳炬潵榪涜宸ヤ綔錛?/span>
<sql:setDataSource>
銆?/span>
<sql:query>
銆?/span>
<sql:update>
銆?/span>
<sql:transaction>
銆?/span>
<sql:setDataSource>
銆?/span>
<sql:param>
銆?/span>
<sql:dateParam>
銆?/span>
<sql:setDataSource>
鏍囩鐢ㄤ簬璁劇疆鏁版嵁婧愶紝涓嬮潰鐪嬩竴涓ず渚嬶細
<sql:setDataSource
聽聽聽聽聽聽聽聽 var="dataSrc"
聽聽聽聽聽聽聽聽 url="jdbc:postgresql://localhost:5432/myDB"
聽聽聽聽聽聽聽聽 driver="org.postgresql.Driver"
聽聽聽聽聽聽聽聽 user="admin"
聽聽聽聽聽聽聽聽 password="1111"/>
璇ョず渚嬪畾涔変竴涓暟鎹簮騫朵繚瀛樺湪鈥?/span>
dataSrc
鈥濆彉閲忓唴銆?/span>
<sql:query>
鏍囩鐢ㄤ簬鏌ヨ鏁版嵁搴擄紝瀹冩爣絳句綋鍐呭彲浠ユ槸涓鍙ユ煡璇?/span>
SQL
銆備笅闈㈢湅涓涓ず渚嬶細
<sql:query var="queryResults" dataSource="${dataSrc}">
聽聽聽聽聽 select * from table1
</sql:query>
璇ョず渚嬪皢榪斿洖鏌ヨ鐨勭粨鏋滃埌鍙橀噺鈥?/span>
queryResults
鈥濅腑錛屼繚瀛樼殑緇撴灉鏄?/span>
javax.servlet.jsp.jstl.sql.Result
綾誨瀷鐨勫疄渚嬨傝鍙栧緱緇撴灉闆嗕腑鐨勬暟鎹彲浠ヤ嬌鐢?/span>
<c:forEach>
寰幆鏉ヨ繘琛屻備笅闈㈢湅涓涓ず渚嬨?/span>
<c:forEach var="row" items="${queryResults.rows}">
聽聽聽聽聽 <tr>
聽聽聽
聽聽聽聽聽聽聽聽聽聽 <td>${row.userName}</td>
聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽 <td>${row.passWord}</td>
聽聽聽聽聽 </tr>
</c:forEach>
鈥?/span>
rows
鈥濇槸
javax.servlet.jsp.jstl.sql.Result
瀹炰緥鐨勫彉閲忓睘鎬т箣涓錛岀敤鏉ヨ〃紺烘暟鎹簱琛ㄤ腑鐨勨滃垪鈥濋泦鍚堬紝寰幆鏃訛紝閫氳繃鈥?/span>
${row.XXX}
鈥濊〃杈懼紡鍙互鍙栧緱姣忎竴鍒楃殑鏁版嵁錛屸?/span>
XXX
鈥濇槸琛ㄤ腑鐨勫垪鍚嶃?/span>
<sql:update>
鏍囩鐢ㄤ簬鏇存柊鏁版嵁搴擄紝瀹冪殑鏍囩浣撳唴鍙互鏄竴鍙ユ洿鏂扮殑
SQL
璇彞銆傚叾浣跨敤鍜?/span>
<sql:query>
鏍囩娌℃湁浠涔堜笉鍚屻?/span>
<sql:transaction>
鏍囩鐢ㄤ簬鏁版嵁搴撶殑浜嬪姟澶勭悊錛屽湪璇ユ爣絳句綋鍐呭彲浠ヤ嬌鐢?/span>
<sql:update>
鏍囩鍜?/span>
<sql:query>
鏍囩錛岃?/span>
<sql:transaction>
鏍囩鐨勪簨鍔$鐞嗗皢浣滅敤浜庡畠浠箣涓娿?/span>
<sql:transaction>
鏍囩瀵逛簬浜嬪姟澶勭悊瀹氫箟浜?/span>
read_committed
銆?/span>
read_uncommitted
銆?/span>
repeatable_read
銆?/span>
serializable4
涓殧紱葷駭鍒?/span>
9.6.1聽
鐢ㄤ簬璁劇疆鏁版嵁婧愮殑
<sql:setDataSource>
鏍囩
9.6.2聽
鐢ㄤ簬鏌ヨ鐨?/span>
<sql:query>
鏍囩
9.6.3聽
鐢ㄤ簬鏇存柊鐨?/span>
<sql:update>
鏍囩
9.6.4聽
鐢ㄤ簬浜嬪姟澶勭悊鐨?/span>
<sql:transaction>
鏍囩
9.6.5聽
鐢ㄤ簬浜嬪姟澶勭悊鐨?/span>
<sql:param>
銆?/span>
<sql:dateParam>
鏍囩
]]>
浠g爜濡備笅錛?br /><%@ page contentType="image/jpeg" import="java.awt.*,
java.awt.image.*,java.util.*,javax.imageio.*" %>
<%!
Color getRandColor(int fc,int bc)
{
聽Random random = new Random();
聽if(fc>255) fc=255;
聽if(bc>255) bc=255;
聽int r=fc+random.nextInt(bc-fc);
聽int g=fc+random.nextInt(bc-fc);
聽int b=fc+random.nextInt(bc-fc);
聽return new Color(r,g,b);
}
%>
<%
out.clear();//榪欏彞閽堝resin鏈嶅姟鍣紝濡傛灉鏄痶omacat鍙互涓嶈榪欏彞
response.setHeader("Pragma","No-cache");
response.setHeader("Cache-Control","no-cache");
response.setDateHeader("Expires", 0);
int width=60, height=20;
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
Random random = new Random();
g.setColor(getRandColor(200,250));
g.fillRect(0, 0, width, height);
g.setFont(new Font("Times New Roman",Font.PLAIN,18));
聽
g.setColor(getRandColor(160,200));
for (int i=0;i<155;i++)
{
int x = random.nextInt(width);
int y = random.nextInt(height);
int xl = random.nextInt(12);
int yl = random.nextInt(12);
g.drawLine(x,y,x+xl,y+yl);
}
String sRand="";
for (int i=0;i<4;i++){
String rand=String.valueOf(random.nextInt(10));
sRand+=rand;
g.setColor(new Color(20+random.nextInt(110),20+random.nextInt(110),20+random.nextInt(110)));
g.drawString(rand,13*i+6,16);
}
// 灝嗚璇佺爜瀛樺叆SESSION
session.setAttribute("rand",sRand);
g.dispose();
ImageIO.write(image, "JPEG", response.getOutputStream());
%>
login.jsp--------------------鐧誨綍欏甸潰錛屽湪榪欓噷鎴戞槸鎻愪緵杈撳叆楠岃瘉鐮佺劧鍚庢彁浜よ繘琛岄獙璇?br />浠g爜濡備笅錛?br /><%@ page language="java" import="java.sql.*" errorPage="" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>鐢ㄦ埛鐧誨綍</title>
<script language="javascript">
聽 function loadimage(){
聽聽聽 document.getElementById("randImage").src = "image.jsp?"+Math.random();
聽 }
聽 </script>
</head>
<body>
<table width="256" border="0" cellpadding="0" cellspacing="0">
聽 <!--DWLayoutTable-->
聽 <form action="validate.jsp" method="post" name="loginForm">
聽 <tr>
聽聽聽 <td width="118" height="22" valign="middle" align="center"><input type="text" name="rand" size="15"></td>
聽聽聽 <td width="138" valign="middle" align="center"><img alt="code..." name="randImage" id="randImage" src="image.jsp" width="60" height="20" border="1" align="absmiddle"></td>
聽 </tr>
聽 <tr>
聽聽聽 <td height="36" colspan="2" align="center" valign="middle"><a href="javascript:loadimage();"><font class=pt95>鐪嬩笉娓呯偣鎴?lt;/font></a></td>
聽 </tr>
聽 <tr>
聽聽聽 <td height="36" colspan="2" align="center" valign="middle"><input type="submit" name="login" value="鎻愪氦"></td>
聽 </tr>
聽 </form>
</table>
</body>
</html>
validate.jsp-------------鐢ㄦ潵楠岃瘉杈撳叆鐨勯獙璇佺爜鏄惁姝g‘
浠g爜濡備笅錛?br /><%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>
<%
String rand = (String)session.getAttribute("rand");
String input = request.getParameter("rand");
if(rand.equals(input)){
聽out.print("<script>alert('楠岃瘉閫氳繃錛?);</script>");
} else{
聽out.print("<script>alert('璇瘋緭鍏ユ紜殑楠岃瘉鐮侊紒');location.href='login.jsp';</script>");
}
%>
涓婇潰鐢熸垚鐨勬槸綰暟瀛楃殑楠岃瘉鐮侊紝鎴戜滑瀵瑰叾榪涜涓涓嬩慨鏀瑰氨鍙互鐢熸垚鏁板瓧瀛楁瘝娣峰悎鐨勯獙璇佺爜浜嗐?br />淇敼閮ㄥ垎鐨勪唬鐮佸涓嬶細
<%
......
......
......
for (int i=0;i<155;i++)
{
聽 ......
聽 ......
}
//-----------------浠ヤ笅鏄娣誨姞鐨勪唬鐮?-------------
char c[] = new char[62];
for (int i = 97, j = 0; i < 123; i++, j++) {
c[j] = (char) i;
}
for (int o = 65, p = 26; o < 91; o++, p++) {
c[p] = (char) o;
}
for (int m = 48, n = 52; m < 58; m++, n++) {
c[n] = (char) m;
}聽聽聽聽聽聽聽
String sRand="";
for (int i=0;i<4;i++){
int x = random.nextInt(62);
String rand=String.valueOf(c[x]);
sRand+=rand;
//---------------------------------------------
%>
鎹湁閮ㄥ垎鏈嬪弸鍙嶅簲錛屽湪嫻嬭瘯榪囩▼涓嚭鐜癹ava.lang.IllegalStateException: getOutputStream() has already been called for this response鐨勫紓甯革紝緇忚繃嫻嬭瘯鍙戠幇錛屼嬌鐢╰omcat5涓涓嬬殑鐗堟湰紜疄浼氬嚭鐜拌闂錛岃В鍐崇殑鍔炴硶灝辨槸鎶妕omcat鎹㈡垚楂樼偣鐗堟湰灝卞彲浠ヤ簡銆?/p>
絎竴縐嶅彲鑳芥槸浣犺繕娌℃湁鐞嗚ВCSS澶勭悊欏甸潰鐨勫師鐞嗐傚湪浣犺冭檻浣犵殑欏甸潰鏁翠綋琛ㄧ幇鏁堟灉鍓嶏紝浣犲簲褰撳厛鑰冭檻鍐呭鐨勮涔夊拰緇撴瀯錛岀劧鍚庡啀閽堝璇箟銆佺粨鏋勬坊鍔燙SS銆傝繖綃囨枃绔犲皢鍛婅瘔浣犲簲璇ユ庢牱鎶奌TML緇撴瀯鍖栥?
鍙︿竴縐嶅師鍥犳槸浣犲閭d簺闈炲父鐔熸倝鐨勮〃鐜板眰灞炴?渚嬪錛歝ellpadding,銆乭space銆乤lign="left"絳夌瓑)鏉熸墜鏃犵瓥錛屼笉鐭ラ亾璇ヨ漿鎹㈡垚瀵?搴旂殑浠涔圕SS璇彞銆?褰撲綘瑙e喅浜嗙涓縐嶉棶棰橈紝鐭ラ亾浜嗗浣曠粨鏋勫寲浣犵殑HTML錛屾垜鍐嶇粰鍑轟竴涓垪琛紝璇︾粏鍒楀嚭鍘熸潵鐨勮〃鐜板睘鎬х敤浠涔圕SS鏉ヤ唬鏇褲?
緇撴瀯鍖朒TML
鎴戜滑鍦ㄥ垰瀛︿範緗戦〉鍒朵綔鏃訛紝鎬繪槸鍏堣冭檻鎬庝箞璁捐錛岃冭檻閭d簺鍥劇墖銆佸瓧浣撱侀鑹層佷互鍙婂竷灞鏂規銆傜劧鍚庢垜浠敤Photoshop鎴栬匜ireworks鐢誨嚭鏉ャ佸垏鍓叉垚灝忓浘銆傛渶鍚庡啀閫氳繃緙栬緫HTML灝嗘墍鏈夎璁¤繕鍘熻〃鐜板湪欏甸潰涓娿?
濡傛灉浣犲笇鏈涗綘鐨凥TML欏甸潰鐢–SS甯冨眬(鏄疌SS-friendly鐨?錛屼綘闇瑕佸洖澶撮噸鏉ワ紝鍏堜笉鑰冭檻鈥滃瑙傗濓紝瑕佸厛鎬濊冧綘鐨勯〉闈㈠唴瀹圭殑璇箟鍜岀粨鏋勩?
澶栬騫朵笉鏄渶閲嶈鐨勩備竴涓粨鏋勮壇濂界殑HTML欏甸潰鍙互浠ヤ換浣曞瑙傝〃鐜板嚭鏉ワ紝CSS Zen Garden鏄竴涓吀鍨嬬殑渚嬪瓙銆侰SS Zen Garden甯姪鎴戜滑鏈緇堣璇嗗埌CSS鐨勫己澶у姏閲忋?
HTML涓嶄粎浠呭彧鍦ㄧ數鑴戝睆騫曚笂闃呰銆備綘鐢╬hotoshop綺懼績璁捐鐨勭敾闈㈠彲鑳戒笉鑳芥樉紺哄湪PDA銆佺Щ鍔ㄧ數璇濆拰灞忓箷闃呰鏈轟笂銆備絾鏄竴涓粨鏋勮壇濂界殑HTML欏甸潰鍙互閫氳繃CSS鐨勪笉鍚屽畾涔夛紝鏄劇ず鍦ㄤ換浣曞湴鏂癸紝浠諱綍緗戠粶璁懼涓娿?
寮濮嬫濊?/strong>
棣栧厛瑕佸涔犱粈涔堟槸"緇撴瀯"錛屼竴浜涗綔瀹朵篃縐頒箣涓?璇箟"銆傝繖涓湳璇殑鎰忔濇槸浣犻渶瑕佸垎鏋愪綘鐨勫唴瀹瑰潡錛屼互鍙婃瘡鍧楀唴瀹規湇鍔$殑鐩殑錛岀劧鍚庡啀鏍規嵁榪欎簺鍐呭鐩殑寤虹珛璧風浉搴旂殑HTML緇撴瀯銆?
濡傛灉浣犲潗涓嬫潵浠旂粏鍒嗘瀽鍜岃鍒掍綘鐨勯〉闈㈢粨鏋勶紝浣犲彲鑳藉緱鍒扮被浼艱繖鏍風殑鍑犲潡錛?
鏍囧織鍜岀珯鐐瑰悕縐?
涓婚〉闈㈠唴瀹?
绔欑偣瀵艱埅(涓昏彍鍗?
瀛愯彍鍗?
鎼滅儲妗?
鍔熻兘鍖?渚嬪璐墿杞︺佹敹閾跺彴)
欏佃剼(鐗堟潈鍜屾湁鍏蟲硶寰嬪0鏄?
鎴戜滑閫氬父閲囩敤DIV鍏冪礌鏉ュ皢榪欎簺緇撴瀯瀹氫箟鍑烘潵錛岀被浼艱繖鏍鳳細
錛渄iv id="header"錛烇紲/div錛?
錛渄iv id="content"錛烇紲/div錛?
錛渄iv id="globalnav"錛烇紲/div錛?
錛渄iv id="subnav"錛烇紲/div錛?
錛渄iv id="search"錛烇紲/div錛?
錛渄iv id="shop"錛烇紲/div錛?
錛渄iv id="footer"錛烇紲/div錛?
榪欎笉鏄竷灞錛屾槸緇撴瀯銆傝繖鏄竴涓鍐呭鍧楃殑璇箟璇存槑銆傚綋浣犵悊瑙d簡浣犵殑緇撴瀯錛屽氨鍙互鍔犲搴旂殑ID鍦―IV涓娿侱IV瀹瑰櫒涓彲浠ュ寘鍚換浣曞唴瀹瑰潡錛屼篃鍙互宓屽鍙︿竴涓狣IV銆傚唴瀹瑰潡鍙互鍖呭惈浠繪剰鐨凥TML鍏冪礌---鏍囬銆佹钀姐佸浘鐗囥佽〃鏍箋佸垪琛ㄧ瓑絳夈?
鏍規嵁涓婇潰璁茶堪鐨勶紝浣犲凡緇忕煡閬撳浣曠粨鏋勫寲HTML錛岀幇鍦ㄤ綘鍙互榪涜甯冨眬鍜屾牱寮忓畾涔変簡銆傛瘡涓涓唴瀹瑰潡閮藉彲浠ユ斁鍦ㄩ〉闈笂浠諱綍鍦版柟錛屽啀鎸囧畾榪欎釜鍧楃殑棰滆壊銆佸瓧浣撱佽竟妗嗐佽儗鏅互鍙婂榻愬睘鎬х瓑絳夈?
浣跨敤閫夋嫨鍣ㄦ槸浠剁編濡欑殑浜?/strong>
id鐨勫悕縐版槸鎺у埗鏌愪竴鍐呭鍧楃殑鎵嬫,閫氳繃緇欒繖涓唴瀹瑰潡濂椾笂DIV騫跺姞涓婂敮涓鐨刬d,浣犲氨鍙互鐢–SS閫夋嫨鍣ㄦ潵綺劇‘瀹氫箟姣忎竴涓〉闈㈠厓绱犵殑澶栬琛ㄧ幇,鍖呮嫭鏍?棰樸佸垪琛ㄣ佸浘鐗囥侀摼鎺ユ垨鑰呮钀界瓑絳夈備緥濡備綘涓?header鍐欎竴涓狢SS瑙勫垯錛屽氨鍙互瀹屽叏涓嶅悓浜?content閲岀殑鍥劇墖瑙勫垯銆?
鍙﹀涓涓緥瀛愭槸錛氫綘鍙互閫氳繃涓嶅悓瑙勫垯鏉ュ畾涔変笉鍚屽唴瀹瑰潡閲岀殑閾炬帴鏍峰紡銆傜被浼艱繖鏍鳳細#globalnav a:link鎴栬?#subnav a:link鎴栬?content a:link銆備綘涔熷彲浠ュ畾涔変笉鍚屽唴瀹瑰潡涓浉鍚屽厓绱犵殑鏍峰紡涓嶄竴鏍楓備緥濡傦紝閫氳繃#content p鍜?footer p鍒嗗埆瀹氫箟#content鍜?footer涓璸鐨勬牱寮忋備粠緇撴瀯涓婅錛屼綘鐨勯〉闈㈡槸鐢卞浘鐗囥侀摼鎺ャ佸垪琛ㄣ佹钀界瓑緇勬垚鐨勶紝榪欎簺鍏冪礌鏈韓騫朵笉浼氬鏄劇ず鍦ㄤ粈涔堢綉緇?璁懼涓?PDA榪樻槸鎵嬫満鎴栬呯綉緇滅數瑙?鏈夊獎鍝嶏紝瀹冧滑鍙互琚畾涔変負浠諱綍鐨勮〃鐜板瑙傘?
涓涓粩緇嗙粨鏋勫寲鐨凥TML欏甸潰闈炲父綆鍗曪紝姣忎竴涓厓绱犻兘琚敤浜庣粨鏋勭洰鐨勩傚綋浣犳兂緙╄繘涓涓钀斤紝涓嶉渶瑕佷嬌鐢╞lockquote鏍囩錛屽彧瑕佷嬌鐢╬鏍囩錛屽茍瀵筽 鍔犱竴涓狢SS鐨刴argin瑙勫垯灝卞彲浠ュ疄鐜扮緝榪涚洰鐨勩俻鏄粨鏋勫寲鏍囩錛宮argin鏄〃鐜板睘鎬э紝鍓嶈呭睘浜嶩TML錛屽悗鑰呭睘浜嶤SS銆?榪欏氨鏄粨鏋勪簬琛ㄧ幇鐨?鐩稿垎紱?)
鑹ソ緇撴瀯鐨凥TML欏甸潰鍐呭嚑涔庢病鏈夎〃鐜板睘鎬х殑鏍囩銆備唬鐮侀潪甯稿共鍑綆媧併備緥濡傦紝鍘熷厛鐨勪唬鐮侊紲table width="80%" cellpadding="3" border="2" align="left"錛烇紝鐜板湪鍙互鍙湪HTML涓啓錛渢able錛烇紝鎵鏈夋帶鍒惰〃鐜扮殑涓滆タ閮藉啓鍒癈SS涓幓錛屽湪緇撴瀯鍖栫殑HTML涓紝 table灝辨槸琛ㄦ牸錛岃屼笉鏄叾浠栦粈涔?姣斿琚敤鏉ュ竷灞鍜屽畾浣?銆?
涓婇潰璇寸殑鍙槸鏈鍩烘湰鐨勭粨鏋勶紝瀹為檯搴旂敤涓紝浣犲彲浠ユ牴鎹渶瑕佹潵璋冩暣鍐呭鍧椼傚父甯鎬細鍑虹幇DIV宓屽鐨勬儏鍐碉紝浣犱細鐪嬪埌"container"灞備腑鍙堟湁鍏跺畠灞傦紝緇撴瀯綾諱技榪欐牱錛?
錛渄iv id="navcontainer"錛?
錛渄iv id="globalnav"錛?
錛渦l錛瀉 list錛?ul錛?
錛?div錛?
錛渄iv id="subnav"錛?
錛渦l錛瀉nother list錛?ul錛?
錛?div錛?
錛?div錛?
宓屽鐨刣iv鍏冪礌鍏佽浣犲畾涔夋洿澶氱殑CSS瑙勫垯鏉ユ帶鍒惰〃鐜幫紝渚嬪錛氫綘鍙互緇?navcontainer涓涓鍒欒鍒楄〃灞呭彸錛屽啀緇?globalnav涓涓鍒欒鍒楄〃灞呭乏錛岃岀粰#subnav鐨刲ist鍙︿竴涓畬鍏ㄤ笉鍚岀殑琛ㄧ幇銆?
鐢–SS鏇挎崲浼犵粺鏂規硶
涓嬮潰鐨勫垪琛ㄥ皢甯姪浣犵敤CSS鏇挎崲浼犵粺鏂規硶錛?
HTML灞炴т互鍙婄浉瀵瑰簲鐨凜SS鏂規硶
HTML灞炴?
CSS鏂規硶璇存槑
align="left"
align="right" float: left;
float: right; 浣跨敤CSS鍙互嫻姩 浠諱綍鍏冪礌:鍥劇墖銆佹钀姐乨iv銆佹爣棰樸佽〃鏍箋佸垪琛ㄧ瓑絳?
褰撲綘浣跨敤float灞炴э紝蹇呴』緇欒繖涓誕鍔ㄥ厓绱犲畾涔変竴涓搴︺?
marginwidth="0" leftmargin="0" marginheight="0" topmargin="0" margin: 0; 浣跨敤CSS, margin鍙互璁劇疆鍦ㄤ換浣曞厓绱犱笂, 涓嶄粎浠呮槸body鍏冪礌.鏇撮噸瑕佺殑錛屼綘鍙互鍒嗗埆鎸囧畾鍏冪礌鐨則op, right, bottom鍜宭eft鐨刴argin鍊箋?
vlink="#333399" alink="#000000" link="#3333FF" a:link #3ff;
a:visited: #339;
a:hover: #999;
a:active: #00f;
鍦℉TML涓紝閾炬帴鐨勯鑹蹭綔涓篵ody鐨勪竴涓睘鎬у煎畾涔夈傛暣涓〉闈㈢殑閾炬帴椋庢牸閮戒竴鏍楓備嬌鐢–SS鐨勯夋嫨鍣紝欏甸潰涓嶅悓閮ㄥ垎鐨勯摼鎺ユ牱寮忓彲浠ヤ笉涓鏍楓?
bgcolor="#FFFFFF" background-color: #fff; 鍦–SS涓紝浠諱綍鍏冪礌閮藉彲浠ュ畾涔夎儗鏅鑹詫紝涓嶄粎浠呭眬闄愪簬body鍜宼able鍏冪礌銆?
bordercolor="#FFFFFF" border-color: #fff; 浠諱綍鍏冪礌閮藉彲浠ヨ緗竟妗?boeder)錛屼綘鍙互鍒嗗埆瀹氫箟top, right, bottom鍜宭eft
border="3"cellspacing="3" border-width: 3px; 鐢–SS錛屼綘鍙互瀹氫箟table鐨勮竟妗嗕負緇熶竴鏍峰紡錛屼篃鍙互鍒嗗埆瀹氫箟top, right, bottom and left杈規鐨勯鑹層佸昂瀵稿拰鏍峰紡銆?
浣犲彲浠ヤ嬌鐢?table, td or th 榪欎簺閫夋嫨鍣?
濡傛灉浣犻渶瑕佽緗棤杈規鏁堟灉錛屽彲浠ヤ嬌鐢–SS瀹氫箟錛?border-collapse: collapse;
錛渂r clear="left"錛?
錛渂r clear="right"錛?
錛渂r clear="all"錛?
clear: left;
clear: right;
clear: both;
璁稿2鍒楁垨鑰?鍒楀竷灞閮戒嬌鐢?float灞炴ф潵瀹氫綅銆傚鏋滀綘鍦ㄦ誕鍔ㄥ眰涓畾涔変簡鑳屾櫙棰滆壊鎴栬呰儗鏅浘鐗囷紝浣犲彲浠ヤ嬌鐢╟lear灞炴?
cellpadding="3"
vspace="3"
hspace="3" padding: 3px; 鐢–SS錛屼換浣曞厓绱犻兘鍙互璁懼畾padding灞炴э紝鍚屾牱錛宲adding鍙互鍒嗗埆璁劇疆top, right, bottom and left銆俻adding鏄忔槑鐨勩?
align="center" text-align: center;
margin-right: auto; margin-left: auto;
Text-align 鍙傜敤浜庢枃鏈?
璞iv錛宲榪欐牱鐨勫潡綰у彲浠ラ氳繃margin-right: auto; 鍜宮argin-left: auto;鏉ユ按騫沖眳涓?
涓浜涗護浜洪仐鎲劇殑鎶宸у拰宸ヤ綔鐜
鐢變簬嫻忚鍣ㄥCSS鏀寔鐨勪笉瀹屽杽錛屾垜浠湁鏃跺欎笉寰椾笉閲囧彇涓浜涙妧宸?hacks)鎴栧緩绔嬩竴縐嶇幆澧?Workarounds)鏉ヨCSS瀹炵幇浼犵粺鏂規硶鍚屾牱鐨勬晥 鏋溿備緥濡傚潡綰у厓绱犳湁鏃朵警闇瑕佷嬌鐢ㄦ按騫沖眳涓殑鎶宸э紝鐩掓ā鍨媌ug鐨勬妧宸х瓑絳夈傛墍鏈夎繖浜涙妧宸ч兘鍦∕olly Holzschlag鐨勬枃绔犮奍ntegrated Web Design: Strategies for Long-Term CSS Hack Management銆嬩腑鏈夎緇嗚鏄?/p>