第一题:制作百度知道页面中的“品牌全知道”板块。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>品牌全知道</title> </head> <body> <img src="../picture/iknowshouye.jpg" alt="车展" title="车展" width="200" height="50"/> <h3>品牌全知道</h3> <ul> <li><img src="../picture/icon-1.jpg" alt="理肤泉敏感" title="理肤泉敏感" width="25" height="20"/>理肤泉敏感全知道</li> <li><img src="../picture/icon-2.jpg" alt="薇姿健康肌肤" title="薇姿健康肌肤" width="25" height="20"/>薇姿健康肌肤全知道</li> <li><img src="../picture/icon-3.jpg" alt="中信银行" title="中信银行" width="25" height="20"/>中信银行全知道</li> <li><img src="../picture/icon-4.gif" alt="Windows7" title="Windows7" width="25" height="20"/>Windows7全知道</li> <li><img src="../picture/icon-5.jpg" alt="海信电视" title="海信电视" width="25" height="20"/>海信电视全知道</li> <li><img src="../picture/icon-6.jpg" alt="多美滋" title="多美滋" width="25" height="20"/>多美滋全知道</li> <li><img src="../picture/icon-7.jpg" alt="三星手机" title="三星手机" width="25" height="20"/>三星手机全知道</li> </ul> </body> </html>
第二题:使用HTML5的结构元素布局贵美商城购物车页面。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> header,section,footer{ height: 300px; border: 1px solid crimson; } </style> </head> <body> <header> <h2>网页头部</h2> </header> <section> <h2>网页主体部分</h2> </section> <footer> <h2>网页底部</h2> </footer> </body> </html>