|
要求:在本文档中的题目下作答,在所写的代码下面粘贴运行后的网页截图,提交本word文档即可。9 G1 K1 p# p2 G7 E
小明的女朋友跟他生气了,他想哄女朋友开心。他在想为女朋友做点儿什么呢?他看女朋友最近经常浏览淘宝、京东、新浪、百度这些网站,于是,就给她做了简单的页面。女朋友看了之后感觉不太好看,小明同学想将列表的方式转化为表格。过了一段时间,小明同学学到了css,发现css可以美化它写的网站。
9 k5 A W6 G% O/ _( |<DOCTYPE html>) q8 V$ g _1 `
<html>! }- _$ Z' T, K
<head></head>
0 X# X& U7 {2 Q2 O# c: }6 l5 x <body>, @- K% f$ {6 u7 [8 p' t) Q4 w5 I
<table border="1" cellpadding = "20" cellspacing="0">' N* m1 {: r. j4 V7 r+ e& E- `1 L
<tr>( h( g6 c0 N( n, J( Q
<th>网站名称</th>
5 d, ?# [4 s3 y5 c4 Y4 C Y <th>网站地址</th>' i7 P; U9 a- M1 j: T; Z. y) c' h
</tr>, X6 X" _( O, h, T
<tr> ?+ L# _( p1 E# ^0 v: H ?
<td>京东</td>
7 w, R3 e. X! A; ? <td>http://www.jingdong.com</td>' H7 P: L1 O' Y( r7 @2 S
</tr>
' _! r0 _$ l. m# i <tr>
' N* q2 k- R5 t1 \% E+ Z <td>百度</td>
0 I* L ?1 E8 D5 {5 j# ? <td>http://www.baidu.com</td>' ~# A& x: N6 R' y4 q
</tr>4 W+ v9 I" S( {+ S
<tr>
' h, F4 R% U+ m* h <td>新浪</td>
3 _$ g5 l; h) ]2 V) H <td>http://www.sina.com.cn</td>7 o( s5 q% W5 B* G9 N5 {8 G
</tr>
8 ~. x( h* C, ?/ ~ <tr>3 S* A# y F5 f& r: {4 k9 V, [
<td>淘宝</td>- \( g3 O, f, O$ x* O& c
<td>http://www.taobao.com </td>! f! E. u9 l% ~+ \6 l
</tr>' r% k' d: Q; @5 F) | x
</table>
1 L$ S! S- U3 F- D* l$ P: I k </body>2 ~0 R" ^3 k9 x4 L U
</html>
/ C. ^2 W9 b9 o/ y" ?' c! M; @8 \) {: t+ T% E
1.请同学们使用css实现网页背景颜色为#f1f1f1, 表格左右居中,内容居中展示,距上50px, 奇数行背景色为#f5f2eb,取消a标签下划线效果,效果图如下:, X4 z i0 N6 K. `, g
- ^" Q1 p& h% N( o! U4 [% v
& V* w; t5 l5 @
2.小明同学想是不是通过div+css也可以实现这样的表格样式呢,大家想想怎么做呢?
' K* E6 }% w- v: L1 X |
|