DIV+CSS网页布局商业案例精粹光盘源文件资源-CSDN下载

共642个文件

gif：490个

jpg：79个

css：37个

DIV+CSS

商业案例

4星 · 超过85%的资源需积分: 10 156 浏览量 2008-05-16 17:35:02 上传评论 3 收藏 6.8MB RAR 举报

《DIV+CSS网页布局商业案例精粹光盘源文件》是一个集合了众多基于DIV和CSS技术的网页设计实例，旨在帮助读者深入理解并掌握这两种关键技术在实际商业项目中的应用。这个压缩包包含了丰富的源文件，提供了实践学习和探索的宝贵资源。让我们详细了解一下DIV和CSS这两个核心概念。DIV，全称是Division，意为“分隔”，是HTML中一个非常重要的布局容器标签。通过使用<div>标签，我们可以将网页内容划分为多个独立的区块，然后对每个区块进行独立的样式控制，实现灵活的页面布局。 CSS，即Cascading Style Sheets（层叠样式表），是用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。CSS允许我们将样式与内容分离，使得页面设计更加整洁、可维护，同时提高了页面加载速度和用户体验。在商业案例中，DIV+CSS布局的优势尤为突出。它能够实现精确的定位，使得网页元素可以按照设计师的意图自由排列，无论是响应式设计还是固定布局，都能轻松应对。此外，CSS3引入了更多的选择器、伪类和动画效果，使得网页更具动态性和交互性，这对于吸引用户、提升品牌形象至关重要。压缩包中的"源文件"很可能包含了以下内容： 1. HTML文件：这些文件包含了使用<div>标签构建的页面结构，以及内联样式或链接到外部CSS文件的引用。 2. CSS文件：这些文件定义了页面的样式规则，包括颜色、字体、布局、动画等，可能还包括媒体查询以适应不同设备的显示。 3. 图像和其他媒体文件：网页设计中常使用的图片、图标、音频或视频文件，它们是页面视觉效果的重要组成部分。 4. JavaScript文件：可能包含了一些交互脚本，用于实现页面的动态效果和用户交互。通过分析和学习这些源文件，你可以： 1. 学习如何使用<div>来组织页面结构，理解块级元素和行内元素的概念。 2. 掌握CSS选择器的用法，如ID选择器、类选择器、属性选择器等，以及如何创建高效的CSS选择器。 3. 学习盒模型（Box Model），理解边距、填充、边框和内容区域对元素尺寸的影响。 4. 了解并实践响应式设计，利用媒体查询实现不同屏幕尺寸下的布局调整。 5. 探索CSS3的新特性，如过渡（Transition）、动画（Animation）、阴影（Box Shadow）和渐变（Gradient）等，提升网页的视觉吸引力。《DIV+CSS网页布局商业案例精粹光盘源文件》是一个绝佳的学习资源，它将理论与实践相结合，帮助你深入理解和应用网页设计的核心技术，对于想要在网页设计领域深化技能的个人或专业团队而言，无疑是一份宝贵的参考资料。

资源推荐

资源详情

资源评论

收起资源包目录

DIV+CSS网页布局商业案例精粹光盘源文件（642个子文件）

div.css 13KB

style.css 8KB

style.css 4KB

div.css 4KB

css.css 4KB

div.css 3KB

div1.css 3KB

div.css 3KB

div1.css 3KB

css.css 3KB

style.css 2KB

div1.css 2KB

css.css 2KB

div1.css 2KB

css1.css 2KB

css.css 2KB

div.css 1KB

css.css 694B

css.css 636B

css1.css 612B

css.css 548B

css1.css 474B

css1.css 336B

css.css 310B

css1.css 297B

css.css 261B

css.css 198B

css1.css 156B

css.css 154B

css1.css 151B

bg.css 133B

893.gif 149KB

322.gif 89KB

955.gif 85KB

1253.gif 71KB

901.gif 63KB

895.gif 47KB

1162.gif 37KB

239.gif 34KB

1202.gif 32KB

247.gif 30KB

811.gif 29KB

1265.gif 28KB

1054.gif 25KB

1254.gif 23KB

974.gif 22KB

958.gif 21KB

922.gif 21KB

12102.gif 20KB

347.gif 20KB

1102.gif 17KB

834.gif 17KB

342.gif 17KB

1239.gif 17KB

1101.gif 17KB

1073.gif 16KB

1259.gif 15KB

425.gif 15KB

927.gif 14KB

1235.gif 14KB

6-2.gif 13KB

341.gif 13KB

1068.gif 13KB

802.gif 13KB

6-3.gif 13KB

1257.gif 13KB

960.gif 13KB

6-16.gif 13KB

806.gif 13KB

1238.gif 13KB

1256.gif 13KB

344.gif 12KB

961.gif 12KB

983.gif 11KB

962.gif 11KB

1205.gif 11KB

816.gif 11KB

959.gif 11KB

1260.gif 11KB

894.gif 11KB

911.gif 11KB

963.gif 11KB

1210.gif 10KB

913.gif 10KB

965.gif 10KB

903.gif 10KB

966.gif 10KB

910.gif 10KB

225.gif 10KB

224.gif 10KB

1266.gif 10KB

1064.gif 10KB

1236.gif 10KB

914.gif 9KB

共 642 条

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>音乐娱乐网站</title> <link href="style/div.css" rel="stylesheet" type="text/css" /> <link href="style/css.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="box"> <div id="top"> <div id="menu"> <ul> <li>首页</li> <li>Flash动画</li> <li>图片频道</li> <li>笑话频道</li> <li>会员专区</li> <li>网络电台</li> <li>桌面壁纸</li> <li>交流论坛</li> </ul> </div> <div id="login"> <form id="form1" name="form1" method="post" action=""> <input type="image" name="login_ok" id="login_ok" src="images/803.gif" tabindex="3" /> <label for="login_user" class="font01">用户名：</label> <input type="text" name="login_user" id="login_user" tabindex="1" /> <br /> <label for="login_pass" class="font01">密　码：</label> <input type="password" name="login_pass" id="login_pass" tabindex="2" /> </form> <img src="images/804.gif" width="96" height="18" /><img src="images/805.gif" width="85" height="18" /></div> <div id="top_pic"> <div id="top_pic1"><img src="images/807.gif" width="126" height="103" /><br /> <br /> 刘嘉亮你到底爱谁</div> <div id="top_pic2"><img src="images/808.gif" width="126" height="103" /><br /> <br /> 阳一回来我的爱</div> <div id="top_pic3"><img src="images/809.gif" width="126" height="103" /><br /> <br /> 梁静茹宁夏</div> <div id="top_pic4"><img src="images/810.gif" width="126" height="103" /><br /> <br /> 光良童话</div> </div> <div id="pop"></div> </div> <div id="main"> <div id="hot"> <dl> <dt>爆笑说唱大大学校</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>童话女生翻唱版</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>火风老婆老婆我爱你</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>搞笑我赚钱了</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>林俊杰编号89757</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>搞笑谁家的猫儿不发春</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>狐狸爱上熊胡力</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>SHE 候鸟</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>亮亮爱你实大太累</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>林俊杰被风吹过的夏天</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>王蓉哎呀</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>下辈子如果我还记得你</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>胡歌逍遥叹</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>光良记得我爱你</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>胡彦斌红颜</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>林俊杰编号89757MV版</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>周杰伦一路向北</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>羽泉这一身只为你</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>刘德华我的心只可容纳你</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>希亚心醉</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>陈浩民爱海滔滔</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> <dt>阿桑寂寞在唱歌</dt> <dd><img src="images/814.gif" width="15" height="14" /></dd> <dd><img src="images/815.gif" width="15" height="14" /></dd> </dl> </div> <div id="new"> <div id="search"> <form id="form2" name="form2" method="post" action=""> <label for="search_name"></label> <input name="search_name" type="text" id="search_name" tabindex="1" value=":::搜索关键字:::" /> <label for="search_list"></label> <select name="search_list" id="search_list" tabindex="2"> <option>Flash</option> <option>Mp3</option> <option>MP4</option> </select> <label for="search_ok"></label> <input type="image" name="search_ok" id="search_ok" src="images/818.gif" tabindex="3" /> 别说我的眼泪你无所谓<span>|</span>断点<span>|</span>痴心决对 </form> </div> <div id="left_list"> <div id="list_title1"><img src="images/820.gif" width="39" height="13" /></div> <div id="list1"> <dl> <dt><img src="images/821.gif" width="13" height="16" />[原创音乐] 心底最深处的话-男人真苦</dt> <dd><img src="images/829.gif" width="28" height="16" /><img src="images/830.gif" width="28" height="16" /><img src="images/831.gif" width="28" height="16" /></dd> <dt><img src="images/822.gif" width="13" height="16" />[幽默搞笑] 赚钱了搞笑</dt> <dd><img src="images/829.gif" width="28" height="16" /><img src="images/830.gif" width="28" height="16" /><img src="images/831.gif" width="28" height="16" /></dd> <dt><img src="images/823.gif" width="13" height="16" />[情感小品] 女孩你的一分钟有多长十一</dt> <dd><img src="images/829.gif" width="28" height="16" /><img src="images/830.gif" width="28" height="16" /><img src="images/831.gif" width="28" height="16" /></dd> <dt><img src="images/824.gif" width="13" height="16" />[幽默搞笑] 三贼也抗日</dt>

评论收藏

内容反馈