"CSS-DIV十天搞定：层叠样式表规划网站教程"

css-div
需积分: 0 4 下载量 139 浏览量 更新于2024-03-22 收藏 318KB DOC 举报
CSS-DIV 十天搞定，CSS，即层叠样式表，是一种用来设置网页排版、设计和网页字体颜色、大小等样式的技术。在网页设计与开发中，CSS扮演着重要的角色。本教程将带领读者通过十天的学习，掌握CSS的基本知识和技巧，让您能够轻松应用于网页设计中。 首先，在网站规划阶段，我们以图示为例构建一个网站。主要布局包括导航条、头部图标、网站主要内容、边框和底栏。导航条宽度为760px，高度为50px；头部图标宽度为760px，高度为150px；主要内容宽度为480px，高度根据内容而变；边框宽度为280px，高度根据内容而变；底栏宽度为760px，高度为66px。 在第二步中，我们将创建html模板及文件目录等。首先创建html模板，代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xh;" <html> <head> <title>网站标题</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div class="main-navigation"> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> <button>按钮4</button> <button>按钮5</button> </div> <div class="header"> <img src="logo.png" alt="网站logo"> <h1>网站名</h1> </div> <div class="content"> <p>网站主要内容区域</p> <p>内容1</p> <p>内容2</p> <p>内容3</p> </div> <div class="sidebar"> <p>边栏信息</p> <p>信息1</p> <p>信息2</p> </div> <div class="footer"> <p>版权信息</p> </div> </body> </html> 在html中，我们使用了class来定义不同的部分，如导航条、头部、内容、边框、底栏。接下来，我们将创建一个名为style.css的样式表文件，用于设置网站的样式。 在style.css中，我们可以设置不同部分的样式，如导航条的按钮特效，头部的图标样式，内容区域的排版，边栏的附加信息，底栏的版权信息等。通过CSS的样式设置，我们可以实现网站的美化和排版，并让网站内容更加清晰易读。 通过这十天的学习和实践，读者将掌握CSS的基本原理和技巧，能够轻松应用于网站设计和开发中，实现网站的美化和排版。CSS不仅仅是一种技术，更是一种艺术，让我们一起来探索和创造美丽的网页设计吧！

十天学会DIV+CSS

2018-04-09 上传
《十天学会DIV+CSS（web标准）》是标准之路出品的系列教程，用十节教程讲解完成。 学习本系列教程需有一定html和css基础，也就是指您之前做过网页，会用表格布局。如果您刚开始学习网页制作，不知道什么是表格布局及html和css，建议您先去充电，否则学习本教程会非常吃力或者根本就听不懂。

十天学会DIV CSS(WEB标准)

2018-07-22 上传
十天学会DIV CSS(WEB标准).非常适合初学者入门，或者有经验的程序员提高，欢迎下载学习。

2天掌握DIV CSS网页制作技术

2013-03-24 上传
基础 【基础一】DIV+CSS的叫法是不准确的 【基础二】使用Table布局是不明智的 【基础三】xHTML+CSS与SEO 【基础四】CSS如何控制页面 【基础五】CSS选择器 【基础六】CSS选择器命名及常用命名 【基础七】盒子模型 【基础八】块状元素和内联元素 ================================= 课程 【第一课】盒模型、块状元素与内联元素、CSS选择器 【第二课】浮动 【第三课】清除浮动 【第四课】导航条 【第五课】浮动(float)页面布局 【第六节】定位 【第七节】定位应用 【第八课】CSS Hack ================================= 小技巧 【单张图片按钮实例】 【首行文字两文字缩进】

韩顺平html+css+javascript-----div+css笔记

2012-12-07 上传
本笔记主要介绍了DIV+CSS的基本概念和应用，涵盖了DIV的介绍、CSS的基本语法、CSS的分类、使用CSS统一网站风格、使用滤镜等内容。 DIV+CSS是什么？ ---------------- DIV是HTML中的一个元素，用于存放HTML元素、...

《十天学会DIV+CSS-WEB标准》

2013-05-30 上传
《十天学会DIV+CSS-WEB标准》是一本旨在帮助初学者快速掌握网页布局与设计核心技术的教程。这本书的核心目标是教会读者如何使用HTML的DIV元素配合CSS（层叠样式表）来创建符合Web标准的网页。在Web开发中，DIV+CSS...

DIVCSS布局大全---12天学会DIV+CSS教程

2009-06-03 上传
12天学会DIV+CSS从理论到实践的教程，强烈推介。 第一天：选择什么样的DOCTYPE 第二天：什么是名字空间 第三天：定义语言编码 ...第十天：自适应高度 十一天：不用表格的菜单 十二天：校验及常见的错误

HTML - DIV+CSS

2017-10-17 上传
HTML - DIV+CSS 课件，DIV标签介绍 CSS基础 MARGIN,PADDING介绍 BORDER介绍 FLOAT介绍 综合练习

韩顺平PHP-div-css.doc

2016-08-04 上传
韩顺平php-div-css资料记录

网页导航条-div+css+js

224 浏览量
网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js网页导航条-div+css+js

[变幻之美-DivCSS网页布局揭秘-案例实战篇]..扫描版

2013-11-05 上传
[变幻之美-DivCSS网页布局揭秘-案例实战篇].(金峰).扫描版
zl19870131
  • 粉丝: 0
  • 资源: 12
上传资源 快速赚钱

最新资源