《网页设计基础》课件——13-4 制作“昆明介绍网”.pptxVIP

下载本文档

1
0
约2.18千字
约 9页
2025-06-26 发布于福建
举报
版权申诉

《网页设计基础》课件——13-4 制作“昆明介绍网”.pptx

此“教育”领域文档为创作者个人分享资料，不作为权威性指导和指引，仅供参考

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

制作“昆明介绍网”

目录CONTENTS制作“昆明介绍网”

制作“昆明介绍网”

制作“昆明介绍网”案例描述：设计并制作“昆明介绍网”，网页效果如下。

制作“昆明介绍网”在body标签中添加下列代码body divclass=citydivclass=leftdivclass=bottomp美丽的昆明，气候温和，夏无酷暑，冬无严寒，四季如春，气候宜人/p/div/divdivclass=rightdivclass=icon/div pclass=writer昆明牛牛/p pclass=info“一座享“春城”之美誉的城市”/p/divdivclass=context p昆明，这座美丽的城市，位于中国的西南地区，云贵高原的中部，享有“春城”的美誉。它不仅是云南省的省会，也是一座特大城市和滇中城市群的中心城市，被国务院批复确定为中国西部地区重要的中心城市之一。这座城市以其独特的地理位置、丰富的民族文化、美食文化以及花卉文化而闻名于世。/pp昆明有许多的景点。翠湖公园是昆明市区的一颗“绿宝石”，这里绿树成荫，湖光山色相映成趣。滇池则是昆明的灵魂，作为云南最大的淡水湖，它拥有绝美的景色和丰富的生态资源。大观公园不仅有美丽的自然风光，还拥有一个游乐园，其中的星际飞碟和极速风车等项目为游客带来了刺激和乐趣。/p /div /div/body

制作“昆明介绍网”在style标签中添加下列代码*{ padding:0; margin:0; border:0;}.city{ width:1200px; height:400px; margin:40pxauto;}.city.left{ height:300px; width:800px; padding:30px; background-image:url(images/kunming.jpg); float:left; position:relative;}.city.left.bottom{ position:absolute; left:0; bottom:0px; width:100%; height:50px; color:#FFF; background-image:linear-gradient(totop,rgba(0,0,0,0.2),rgba(0,0,0,0.6));}

制作“昆明介绍网”在style标签中添加下列代码.city.left.bottomp{ padding:12px0030px; font-size:1.5em; font-family:仿宋; font-weight:bold;}.city.right{ width:280px; height:300px; background-image:repeating-linear-gradient(70deg,#0b10751%,#0f418c2%); padding:30px; float:left; position:relative;} .city.right.icon{ width:120px; height:120px; border:4pxsolid#FFF; border-radius:50%; background-image:url(images/haiou.jpg); overflow:hidden; margin:0auto; box-shadow:1px3px5px1px#AAAinset}

制作“昆明介绍网”在style标签中添加下列代码.city.right.writer{ color:#FFF; font-family:宋体; font-size:18px; line-height:3em; font-weight:bold; text-align:center; text-shadow:#4441px2px3px;}.city.right.info{ color:#FFF; font-family:宋体; font-size:18px; line-height:2em; font-weight:bold; text-align:center; text-shadow:#4441px2px3px;}.context{ width:100%; padding-top:10px; color:#FFF; font-size:20px; line-height:2em; font-family:楷体; text-indent:2em; background-i