欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

背景设置

程序员文章站 2022-06-03 12:27:07
...

HTML的背景设置

background 是一个复合属性
background-color 设置背景色
值三种
1.英文单词
2.16进制表示法
3.rgb设置颜色
background-image 设置背景图
url(背景图的路径)
background-repeat 设置背景图的方式
默认平铺
repeat 平铺
repeat-x x轴平铺
repeat-y y轴平铺
no-repeat 不平埔
background-position 背景图定位
x轴定位 y轴定位
还可以使用 left top right bottom center 等方位单词组合设置数字和字母也可以组合
background-attachment
scroll 默认值,滚动的时候背景图片跟着背景图片一起滚动
fixed 把背景图固定在某个位置
符合写法的顺序是 :
color image repeat position attachment

		<p style="background-color: #0f0;color: #ff0; height: 200px;width: 200px;">哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒哪吒</p>
		
		<div style="background-image: url(狼.jpg);height: 600px;border: 3px #f00 solid;font-size: 100px;color: #00C46A;background-repeat:no-repeat ;background-position: 150px 150px;background-attachment: fixed;">鲁班
			
		</div>
		
		<div style="background-image: url(鲁班.jpg);height: 600px;border: 3px #f00 solid;font-size: 100px;color: #00C46A;background-repeat:no-repeat ;background-position: center center;">鲁班
			
		</div>
		
		<div style="height: 600px;border: 3px #f00 solid;background: #0f0 url(../day02/鲁班.jpg) no-repeat center center fixed">