css教程
首页 html教程 css教程 关于
学习完css的id和class选择器后,我们来研究一下声明
首先,我们要先从背景设置开始学起

背景颜色

背景颜色的设置非常的简单:background-color:red;
颜色可以是什么格式的呢?
  • 十六进制:先写上一个#号,后面加上十六进制的RGB颜色,如:#FF0000
  • RGB:rgb(r,g,b,a),r、g、b、a分别代表红、绿、蓝、透明度
  • 颜色名字:css确定的颜色,如:red
不光网页可以设置背景颜色,div、段落、链接等都可以设置背景颜色

背景图片

这个与背景颜色十分相似:background-image:url('xxx');
在单引号中填上你的图片名称(包括文件类型!
但是如果图片非常小,图片就会不断的重复,看起来很难看,怎么办?
这时,就出现了水平和垂直平铺设置了! background-repeat:no-repeat/*repeat-x,repeat-y*/用于调节是什么类型的平铺
设置为no-repeat表示不平铺,也就是只有一个图片
设置为repeat-x表示水平平铺,也就是只有一行的图
设置为repeat-y表示水平平铺,也就是只有一列的图
这样就可以让我们的网页更好看一点了
但是,万一图像挡住字了咋办?
这是,我们又有了定位!
background-position这个属性代表背景图片的位置
它的值有很多种:left top,left center,left bottom,right top,right center,right bottom,center top,center center,center bottom
left,right,center,top,bottom分别表示左右中上下
当然,也可以使用x y的形式,其中,x和y的参数可以是任意css单位(比如像素、百分比等等,具体的后面再介绍)
如果不希望背景随屏幕一起滚动怎么办?
设置background-attachment: fixed就可以了,这一部分不做详细的讲解

背景设置的简写

如果你是一个懒人,你可以把上面的东西简写为:background:red url('xxx') right top fixed是不是很简单呢?