CSS表格设计与HTML基础实训.pdfVIP

  1. 1、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。。
  2. 2、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载
  3. 3、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
  4. 4、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
  5. 5、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们
  6. 6、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
  7. 7、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多

实训8CSS表格设置

【实训目的】

学习CSS的基本和高级语法以及列表和超样式的设计方法。掌握表格格式的设置方

法。掌握手写HTML代码的基本方法。学习HTML中属性值的设置。

【实训环境】

1、DreamweaverCS4。

2、W3school。

3、浏览软件。

4、相关浏览器。

5、截图软件。

【实训内容】

1、制作出如下所示表格样式,做在一张页面上。

Practicaltraining8CSStable

settings

[Purposeoftraining]

LearnthebasicandadvancedsyntaxofCSSandhowtostylelistsands.Masterhowtosetuptable

formats.MasterthebasicsofhandwritingHTMLcode.LearnhowtosetattributevaluesinHTMLtags.

[Practicaltraining

environment]

1.DreamweaverCS4.2.

W3schooltutorial.3.Picture

browsingsoftware.4.Related

browsers.5.Picture

screenshotsoftware.

【Practicaltraining

content】

1.Createthetablestyleasshownbelowandputitononepage.

2、制作下面的表格,表格的基本结构已经做好(table-2.html),只需要添加样式即可。

2、制作出“隔行变色表格”效果,样张如下图所示。

2.MakeForthetableabove,thebasicstructureofthetablehasbeencompleted(table-2.html).Youonlyneedtoaddsty.。

2.Createtheeffectofinterlacedcolorchangingtable,asshowninthe

picturebelow.

(1)ProductList是表格标题,注意它的格式。

(2)表格使用thead/thead、tbody/tbody、tfoot/tfoot结构来写,

product这一行放在thead中,Computer到Freezer行放在tbody中,Total行

放在tfoot中。

(2)表格的立体效果由不同的边框颜色制作出来。

3、制作出“动态变化表格”效果,样张如下图所示。

提示:tr:

hover

【实训要求】

1、所有代码采用手工编写

2、网页代码结构规范、简洁。

3、注意的基本结构

1)ProductLististhetabletitle,payattentiontoitsformat

(。

2)The

文档评论(0)

honglajiao + 关注
实名认证
文档贡献者

该用户很懒,什么也没介绍

1亿VIP精品文档

相关文档