CSS教程之CSS使用基本教程(4) 色彩背景

你的设计不仅仅用于web浏览器，也可以发布在其他设备上，比如PowerPoint。
<P>本　章　Ｃ　Ｓ　Ｓ　的　主　要　作　用
　　在后面的章节先容完了声明与使用的办法及一些特征之後，从这章入手下手，便要正式进进ＣＳＳ的指令先容了！本章有两个先容的主题，第一个部分先容的是色彩与背景性子的ＣＳＳ，其次要的感化在于设定元素的远景色彩、背景色彩与背景图形等款式设定的性子；而第二部分为您先容的是用于把持摆放元素地位的ＣＳＳ的指令。



颜　色　背　景　的　Ｃ　Ｓ　Ｓ　指　令
color　设定远景色彩
支　持：ＩＥ３、ＩＥ４、ＮＣ４
适　用：一切元素
大概值：<color>设定色彩，请参考第一章色彩利用的相干申明
预设值：视扫瞄器而定
承继性：有
一样平常典范：SPAN{color:BLUE}
同轴典范：<SPANstyle="color:BLUE">

background-color　设定背景色彩
支　持：ＩＥ４、ＮＣ４
适　用：一切元素
大概值：<color>设定色彩，请参考第一章色彩利用的相干申明
transparent将父元素（色彩或图案）的背景通明化
预设值：transparent
承继性：无
一样平常典范：BODY{background-color:BLUE}
同轴典范：<BODYstyle="background-color:BLUE">

background-image　设定背景图形
支　持：ＩＥ４、ＮＣ４
适　用：一切元素
大概值：<url>设定图档URL，请参考第一章URL暗示的相干申明
none不利用背景图案
预设值：transparent
承继性：无
一样平常典范：
BODY{background-image:URL("http://yourweb/path/file_name")}
同轴典范：
<BODYstyle="background-image:URL(http://yourweb/path/file_name)">

background-repeat　设定背景反复
支　持：ＩＥ４、ＮＣ４
适　用：一切元素
大概值：repeat反复背景图形填满页面
repeat-x程度偏向反复背景图形
repeat-y垂直偏向反复背景图形
no-repeat不反复显现背景图形
预设值：repeat
承继性：无
一样平常典范：BODY{background-repeat:repeat-x}
同轴典范：<BODYstyle="background-repeat:repeat-x">

background-attachment　设定背景附著
支　持：ＩＥ４、ＮＣ４
适　用：一切元素
大概值：scroll背景图形随著卷轴卷动
fixed背景图形随著卷轴卷动（浮水印）
预设值：scrool
承继性：无
一样平常典范：BODY{background-attachment:fixed}
同轴典范：<BODYstyle="background-attachment:fixed">

background-position　设定背景地位
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：<percent>X%Y%图形上X%Y%的点瞄准元素的X%Y%地位
<length>XY将图形左上角置于元素左上角程度X垂直Y的地方
center背景图形置于中心
left背景图形对　右边
right背景图形对　右侧
top背景图形对　顶部
bottom背景图形对　底部
预设值：0%0%
承继性：无
一样平常典范：BODY{background-position:100%50%}
同轴典范：<BODYstyle="background-position:100%50%">

background　综合设定背景性子
支　持：ＩＥ３、ＩＥ４、ＮＣ４
适　用：一切元素
大概值：background-color设定背景色彩
background-image设定背景图形
background-repeat设定背景反复
background-attachment设定背景附著
background-position设定背景地位
预设值：无
承继性：无
一样平常典范：
BODY{BLUEurl(image/gif)repeat-xfixedcenter}
同轴典范：
<BODYstyle="BLUEurl(image/gif)repeat-xfixedcenter">


位　置　摆　放　的　Ｃ　Ｓ　Ｓ　指　令
float　设定浮动性子（多用于文绕图的情况）
支　持：ＩＥ４、ＮＣ４
适　用：区块元素或图形
大概值：left元素*左，笔墨环绕其右
right元素*右，笔墨环绕其左
none以预设的办法显现
预设值：none
承继性：无
一样平常典范：DIV{float:right}
同轴典范：<DIVstyle="float:right">

clear　设定扫除性子（设定是不是同意浮动元素之存在）
支　持：ＩＥ４
适　用：区块元素或图形
大概值：both若双方有浮动元素，则该元素移至浮动元素下方
left若右边有浮动元素，则该元素移至浮动元素下方
right若右侧有浮动元素，则该元素移至浮动元素下方
none以预设的办法显现
预设值：none
承继性：无
一样平常典范：DIV{clear:right}
同轴典范：<DIVstyle="clear:right">

width　设定宽度
支　持：ＩＥ４、ＮＣ４
适　用：区块元素或图形
大概值：<length>长度单元，请参考第一章基础单元的相干申明
<percentage>百分比，以父元素宽度为基准
auto以流动比例主动变更巨细
预设值：auto
承继性：无
一样平常典范：DIV{width:300pt}
同轴典范：<DIVstyle="width:300pt">

height　设定高度
支　持：ＩＥ４、ＮＣ４
适　用：区块元素或图形
大概值：<length>长度单元，请参考第一章基础单元的相干申明
<percentage>百分比，以父元素宽度为基准
auto以流动比例主动变更巨细
预设值：auto
承继性：无
一样平常典范：DIV{height:300pt}
同轴典范：<DIVstyle="height:300pt">

position　设定地位
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：absolute以父元素为基准，安排在特定地位上
relative以相邻元素为基准，安排在特定地位上
static预设地位，以该元素于原始码中地位而定
预设值：absolute
承继性：无
一样平常典范：DIV{position:static}
同轴典范：<DIVstyle="position:static">

top　设定顶端地位
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：<length>长度单元，请参考第一章基础单元的相干申明
<percentage>百分比，以父元素宽度为基准
auto以一般体例显现
预设值：auto
承继性：无
一样平常典范：DIV{top:30pt}
同轴典范：<DIVstyle="top:30pt">

left　设定左端地位
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：<length>长度单元，请参考第一章基础单元的相干申明
<percentage>百分比，以父元素宽度为基准
auto以一般体例显现
预设值：auto
承继性：无
一样平常典范：DIV{left:30pt}
同轴典范：<DIVstyle="left:30pt">

clip　设定裁剪（设定某地区外形及巨细，地区外通透）
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：rect(top,right,bottom,left)设定矩形之上右下左长度，会主动比对对边长度
一样平常写法为rect(0,长度,长度,0)
不成以写为rect(0,0,长度,长度)
四个数值皆能够"auto"取代
auto以一般体例显现
预设值：auto
承继性：无
一样平常典范：DIV{clip:rect(0,100px,50px,0)}
同轴典范：<DIVstyle="clip:rect(0,100px,50px,0)">

overflow　设定溢位处置（把持当元素内容凌驾该元素巨细时的显现体例）
支　持：ＩＥ４
适　用：区块元素
大概值：visible元素将不会依所设订巨细显现，而能瞥见一切内容
hidden凌驾元素所设订巨细之部分将被埋没不予显现
scroll若有需要呈现卷轴可以让利用者看到全体的内容
auto以预设的体例显现
预设值：auto
承继性：无
一样平常典范：DIV{overflow:scroll}
同轴典范：<DIVstyle="overflow:scroll">

visibility　设定可视度
支　持：ＩＥ４、ＮＣ４
适　用：一切元素
大概值：visible设定该元素显现
hidden设定该元素不显现，但仍占有空间
inherit以父元素可视度决意
预设值：inherit
承继性：无
一样平常典范：DIV{visibility:hidden}
同轴典范：<DIVstyle="visibility:hidden">

z-index　设定Ｚ轴参数（三度空间）
支　持：ＩＥ４、ＮＣ４
适　用：区块元素
大概值：<number>十进位数值，数值年夜的元素会呈现在数值小的元素的上方
auto当元素地位反复时，原始码中写在後面元素会呈现在写在后面元素的上方
预设值：auto
承继性：无
一样平常典范：DIV{z-index:3}
同轴典范：<DIVstyle="z-index:3">



目前我们的站就是div+CSS做的，美工可以通过css直接控制我的程序输出的页面动态数据的样式DIV就只是布局元素.

经过两天的学习，总算对Dreamweaver有进一步的了解了，心中不免有些激动。今天和其他几位老师交流了一下，感觉受益匪浅.

每天上网看着那样多的网页，于是我才下定决心选择了网页制作这一门课程，目的就是希望以后能够做出一个完美的网页来。

这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时，就要多花时间对其产生初步的印象。此外，多操作也是非常重要的。

技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中，我总结了四大定律：兴趣、恒心、虚心、时间。

Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。

俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。

HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器）