Div+css

一，什么是CSS

CSS全称为Cascading Style Sheets，中文翻译为“层叠样式表”，简称CSS样式表又被我们称为CSS样式，CSS样式又被作为一种能制作出各种样式网页的技术统称。

二．DIV+CSS

简单地说DIV+CSS(DIV CSS)被称为“WEB标准”中常用术语之一。首先认识DIV是用于搭建html网页结构（框架）标签，像、

、等html标签一样，再认识CSS是用于创建网页表现（样式/美化）样式表统称，通过css来设置div标签样式，这一切常常我们称之为div+css。 表格

以前html直接设置高度 width=\这种方式嵌入表格标签内，而且无需带单位，默认以px（像素）为单位。 例子：

分别设置了高度为100px和50px的两行表格

DIV的布局方法

CSS 代码

.yangshi{ height:50px; width:50px; overflow:hidden; border:1px solid #666;}

Html body内代码：

完整CSS html最小高度实例代码：

html

PUBLIC

\

XHTML

1.0

Transitional//EN\

\

CSS 高度实例

测试内容高度超出演示实例测试内容测试内容高度超出演示实例高度超出演示实例，实例

CSS 宽度

传统Html 宽度属性单词：width 如width=\ CSS 宽度属性单词：width 如width:300px;

HTML宽度与DIV+CSS对比

1、传统html中宽度width=\，即设置对应元素宽度为300px（像素）。而宽度值后无需跟单位，默认情况下以像素（px）为单位。

如： 即：设置了对应表格td的宽度为300px.

2、div css中宽度设置width:300px;，即设置对应CSS样式为300px，这里需要跟单位。 如：#header{ width:300px;}

即：定义header CSS选择器样式为300px宽度。

而在标签运用：

CSS 宽度自适应

常常我们看见一个网页宽度随浏览器宽度改变而自动改变，宽度是自适应宽度。这里运用了百分比即可实现自适应宽度。

如果网页总宽度为80%即width:80%;，将使此宽度知道自适应宽度为浏览器80%。当然前提是设置最外层没有宽度限制条件下。 DIV CSS 自适应宽度例子： CSS样式代码：

Html中body div代码：

CSS边框

CSS 边框即CSS border是控制对象的边框边线宽度、颜色、虚线、实线等样式CSS属性

Html表格控制边框：

border=\

说明：控制表格边框宽度为1px，颜色为黑色，默认为实线样式边框

DIV CSS边框：

border-color:#000; border-style:solid; border-width:1px;

说明：以上代码为设置对象边框颜色为黑色、边框为实线、宽度为1px边框。 边框样式包括

设置上边框：border-top： 设置下边框：border-bottom : 设置左边框：border-left: 设置右边框：border-right ：

边框显示样式：

border-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset 参数值解释：

none : 无边框。与任何指定的border-width值无关 hidden : 隐藏边框。IE不支持

dotted : 在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线 dashed : 在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线 solid : 实线边框

double : 双线边框。两条单线与其间隔的和等于指定的border-width值 groove : 根据border-color的值画3D凹槽 ridge : 根据border-color的值画菱形边框 inset : 根据border-color的值画3D凹边 outset : 根据border-color的值画3D凸边

例子：

设置上边框为1px实线黑色边框。

border-top-color:#000; border-top-style:solid; border-top-width:1px;

或简写 border-top:#000 solid 1px;

完整DIV CSS实例：

实例内容设置CSS 命名为yangshi的css 选择器，设置该属性选择器样式为边框为1px宽度实线黑色边框、宽度为200px,高度为50px的矩形。 CSS 代码：

div,body{ border:0; margin:5px; padding:0;}/* 初始化网页样式 */

.yangshi{ border:1px solid #000; width:200px; height:50px;}/* 设置对象样式 */

HTML中对应DIV代码：

这是一个 CSS 实例

CSS 背景

background CSS手册查询-background手册 background-color 设置颜色作为对象背景颜色 background-image 设置图片作为背景图片 background-repeat设置背景平铺重复方向

background-attachment 设置或检索背景图像是随对象内容滚动还是固定的。 background-position 设置或检索对象的背景图像位置。

图片背景样式（固定、滚动）

• 1
• 2
• 3

搜索更多关于： Div+CSS基础代码网页布局+实例教程 的文档

• 收藏
• 分享
• 违规举报
• 版权认领

下载文档10.00 元 加入VIP免费下载

推荐下载

• Div+CSS基础代码网页布局+实例教程
• 蓄电池监测系统技术规范书（2016版） - 图文
• 人员招聘与选拔解读
• 浩顺考勤系统 - 图文
• 2012年全国中考数学压轴题分类解析汇编 专题3 面积问题
• 七年级英语培优补差计划
• 沈志华中苏同盟破裂的深层原因和内在逻辑
• 大学生职业生涯规划（广告设计类） - 图文
• 个人向单位承诺书范文
• [师说]高一人教版英语必修二练习：Unit 4 Wildlife protect
• 课堂观察分析培训材料 - 图文
• 变质岩复习
• 科学实验学生分组名单3~6(2014第一学期)(DOC)
• 小数乘整数竖式计算题（一线教师 倾情奉献）(104)
• 2017年个股期权知识考试试题及答案
• 最新部编版小学二年级语文下册全册教案（附全册教学反思）
• 2019年初级会计职称《初级会计实务》试题 (附答案)
• 上海市2020届高三数学一轮复习典型题专项训练：统计与概率 - 最新修正版
• 计算机二级办公软件高级应用技术考试大纲
• 微信朋友圈中的自我呈现
• 北师大版数学一年级下册《数花生》名师教案
• 2017-2018学年陕西省西安市第一中学2018届高三上学期第一次考试数学(文
• 多级离心水泵检修作业指导书
• 陕西省人民政府关于公布榆林市第一批关闭煤矿名单的通知
• 13.10.12竹柳产业可行性报告 - 图文
• 家装咨询常见问题三十六计
• 数据库原理及应用（第2版）习题参考答案
• 校园文化墙励志标语
• 中外会计职业道德比较研究1
• 《茅屋为秋风所破歌》理解性默写
• 专业技术人员诚信建设专题试题及答案
• 财经类试卷会计专业技术资格初级会计实务模拟试卷110及答案与解析
• 苏教版七年级生物下册复习提纲 - （讲透教材）111
• 苏教版七年级生物下册复习提纲 - （讲透教材）111
• IC行业国外客户邮箱资料
• 教育管理论文：教育管理新认识（定稿）
• 基于单片机的家居空气质量监控系统
• 【解析】河北省承德市第一中学2020届高三上学期12月月考数学(理)试题
• 注册会计师考试《审计》word讲义第二十章 对集团财务报表审计的特(完整版)
• 江苏省连云港市2019-2020学年中考数学三模考试卷含解析

本文作者：...

共分享92篇相关文档

文档简介：

Div+css 一，什么是CSS CSS全称为Cascading Style Sheets，中文翻译为“层叠样式表”，简称CSS样式表又被我们称为CSS样式，CSS样式又被作为一种能制作出各种样式网页的技术统称。 二．DIV+CSS 简单地说DIV+CSS(DIV CSS)被称为“WEB标准”中常用术语之一。首先认识DIV是用于搭建html网页结构（框架）标签，像、、等html标签一样，再认识CSS是用于创建网页表现（样式/美化）样式表统称，通过css来设置div标签样式，这一切常常我们称之为div+css。 表格 以前html直接设置高度 width=\这种方式嵌入表格标签内，而且无需带单位，默认以px（像素）为单位。 例子：

相关文档

• Div+CSS基础代码网页布局+实例教程
• 蓄电池监测系统技术规范书（2016版） - 图文
• 人员招聘与选拔解读
• 浩顺考勤系统 - 图文
• 2012年全国中考数学压轴题分类解析汇编 专题3 面积问题
• 七年级英语培优补差计划
• 沈志华中苏同盟破裂的深层原因和内在逻辑
• 大学生职业生涯规划（广告设计类） - 图文
• 个人向单位承诺书范文
• [师说]高一人教版英语必修二练习：Unit 4 Wildlife protect

相关推荐

• 知识聚宝盆．(1)小明要去汽车站.向 方
• 拔河比赛.(1)17个同学.1人当裁判.剩下
• 如果x×=y×5.那么x:y= : ．
• 口算. 12×40= 240÷30= 540÷6= 800÷
• 计算下面各题.能简算的必须简算．÷9+
• 用直线上的点表示下面各数．
• 325这个数的千分位上的数字是2． ．
• 快车和慢车同时从相距600千米的两城相
• 一个长方形的长和宽的和是80厘米.它的
• 在0.285中.有( )个十分之一.( )个百分
• 把三个饼平均分成5份.每份是个．
• 一个三角形底是18厘米.高是9厘米.它的
• 老师布置会场.按红.黄.蓝.绿的顺序挂了
• 一种商品现在售价80元.比原价提高了16
• 某种皮衣价格为1650元.打8折出售仍可盈