html网页编写实例
- 格式:doc
- 大小:176.00 KB
- 文档页数:5
1、题目:按照题目中所给出的网页截图及说明,写出相同的页面效果。
页面包含如下:index.html、footer.html、header.html、insurance.html、rates.html、redbank.html、welcome.html。
主干代码:Index:<!doctype><html><head><link rel="stylesheet" type="text/css" href="style.css"><title>ITSO Bank</title><meta http-equiv="content-type" content="text/html;charset=UTF-8"><script type="text/javascript" src="jquery.js"></script><style type="text/css">body{font-family: Georgia;font-size: 30px;}</style></head><body><div class="header"><img src="logo.bmp"><span><b> ITSO<b></span><span><strong><b>RedBank<b></strong></span><div class="links"><button><input type="image" src="rates1.gif"><a href="rates.html" target="frame"><font color=000000>rates</font></a></input></button><button><input type="image" src="land.gif"><a href="redbank.html" target="frame"><font color=000000>redbank</font></a></input></button><button><input type="image" src="insurance.gif"><a href="insurance.html" target="frame"><font color=000000>insurance</font></a></input></button></div><hr /></div><div class="iframe"><iframe class="frame_class" frameborder="0" name="frame" height="230px" width="1000px"></iframe></div><div class="footer"><hr /><button><input type="image" src="home.gif"><a id="foot" href="welcome.html" target="frame"><font color=000000>ITSO Home</font></a></input></button></div></body></html>Rates:<!doctype><html><head></head><body><table border=1 cellspacing=0 width=100% bordercolorlight=#666666 bordercolordark=#efefef style="text-align: center;"><tr bgcolor=#CCFFFF><th>loan type</th><th>1 years</th><th>5 years</th><th>15 years</th><th>40 years</th></tr><tr bgcolor=FFFFCC><td>New Car Loan</td><td>0</td><td>0</td><td>n/a</td><td>n/a</td></tr><tr bgcolor=FFFFCC><td>Used Car Loan</td><td>0</td><td>10</td><td>n/a</td><td>n/a</td></tr><tr bgcolor=FFFFCC><td>Home Cauity Loan</td><td>4</td><td>0</td><td>0</td><td>n/a</td></tr><tr bgcolor=FFFFCC><td>Mortgage</td><td>n/a</td><td>n/a</td><td>4.0</td><td>0.0</td></tr></table></body></html>Redbank:<!doctype><html><head></head><body><p style="color:#4f6b72; font-family: Georgia; ">Please enter your custome ID (SSN)</p><input type="text"><p style="color:#4f6b72; font-family: Georgia;">Please enter your custome PASSWORD</p><input type="password"><input type="button" value="Submit" style="width: 100px; position: absolute; left: 35px; top: 160px;"></body></html>Insurance:<!doctype><html><head><title>insurance</title><meta http-equiv="content-type" content="text/html;charset=UTF-8"><style type="text/css">body{font-family: Georgia;font-size: 30px;}</style></head><body><ul class="list"><li>Auto</li><li>Life</li><li>Home Owner's</li><li>Renters</li></ul></body></html>Welcome:<!doctype><html><head><link rel="stylesheet" type="text/css" href="welcome.css"><style type="text/css">body{font-family:'Tangerine', serif;font-size: 90px;}</style></head><body><span><strong>Welcome to the ITSO </strong></span><span><strong style="color:red">RedBank</strong></span></body></html>截图:。