CSS样式属性——背景
背景——包括背景颜色、背景图片,以及背景图片的控制
background-color:设置背景色(transparent表示透明的背景色)
background-image:设置元素的背景图片 background-repeat:确定背景图片是否以及如何重复
no-repeat:只出现一次 repeat:在水平和垂直方向上重复 repeat-x和repeat-y分别在水平和垂直方向上重复
background-attachment:确定背景图像是否跟随内容滚动(fixed表示固定,scroll表示图像跟随内容的移动而移动)
background-position:指定背景图像的水平位置和垂直位置(水平:left,center,right,数值 垂直:top,center,bottom,数值)
3个Div在同一区域分层:
<head>
<title></title>
<style type="text/css">
div{
height:300px;
width:300px;
}
div.div1{
background-color:red;
top:100px;
left:100px;
position:absolute; //absolute表示绝对定位
z-index:3; //z-index值越高的显示在外面
}
div.div2{
background-color:yellow;
top:130px;
left:130px;
position:absolute;
z-index:2;
}
div.div3{
background-color:green;
top:160px;
left:160px;
position:absolute;
z-index:1;
}
</style>
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</body>
右下角固定弹窗:
<style type="text/css">
.div1{
right:0px;
bottom:0px;
background-color:yellow;
position:fixed;
height:250px;
width:350px;
}
</style>
……
<div class="div1"></div>
CSS样式属性——背景的更多相关文章
- js中获取css样式属性值
关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...
- IE6支持兼容min-width、max-width CSS样式属性
IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...
- CSS之样式属性(背景固定、圆形头像、模态框)
CSS属性 一.宽和高 width属性可以为元素设置宽度. height属性可以为元素设置高度. 块级标签才能设置宽度,内联标签的宽度由内容来决定. div {width: 1000px;backgr ...
- HTML布局相关的CSS样式属性
# 转载请留言联系 注意,样式属性是写进CSS里面的. 布局常用样式属性: width 设置元素(标签)的宽度,如:width:100px; height 设置元素(标签)的高度,如:height:2 ...
- 常用CSS样式属性
01.常用样式 1.1.background背景 设置元素背景的样式 background,更好的衬托内容. 属性 描述 值 background 背景属性简写.支持多组背景设置,逗号,隔开 back ...
- css样式之背景图片
1.css样式背景之使用图片来做为背景 example: <!DOCTYPE html> <html> <head> <meta http-equiv=&qu ...
- 11-18网页基础--第二部分CSS样式属性(1)
第一课:样式属性 style 样式:style样式不仅可以直接在<body>中设置成整个网页的样式.格式:为了将样式.格式多样化,也可以将style单独抽出来,作为一个独立的个体,放在&l ...
- CSS样式属性单词之Left
通常left单独在CSS中设置无效,需要在使用position属性下使用才能生效起作用.left左靠多少距离(距离左边多少)的作用. left 一.left认识与语法 left翻译:左边,左 在CSS ...
- IE6支持min-width、max-width CSS样式属性
1.IE6支持max-width解决方法 IE6支持最大宽度,解决CSS代码: .yangshi{ max-width:1000px; _width:expression((document.docu ...
随机推荐
- Windows下MongoDB安装
1.解压mongodb-win32-i386-1.8.1.zip ,创建路径d:\mongodb ,将解压后的Bin文件Copy to 此文件夹下 2.d:\mongodb 下建立Data文件夹 d: ...
- python构造栈结构
栈:是一种先进后出的数据结构:本片文章,我们用python的面向对象来构造这样的数据结构. 栈中的每一个数据除了存储当前的数值外,还存储着当前数值下一个数据的类型(注意不是下一个数据的数值). cla ...
- Ubuntu下使用face_recognition进行人脸识别
Face Recognition是一个基于Python的人脸识别库,在github上地址如下:https://github.com/ageitgey/face_recognition. 看着挺好玩,本 ...
- 算法之路 level 01 problem set
2992.357000 1000 A+B Problem1214.840000 1002 487-32791070.603000 1004 Financial Management880.192000 ...
- linux内核分析 第四周
一.系统调用的三层皮 内核态.用户态 Intel x86 CPU有四个权限分级,0-3.Linux只取两种,0是内核态,3是用户态. 0xc0000000以上的空间只能在内核态下访问 0x000000 ...
- [c/c++]指针(4)
现在讲一下指针的主要用途和常见错误. [用途] 1.用作形参 首先,常见新手写交换函数: void swap(int a,int b){ int t = a; a = b; b = t; } 主函数里 ...
- Python3基础 os.path.splitext 处理文件名,得到文件名+扩展名
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- 51nod 1086 背包问题 V2
http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1086 思路 裸的多重背包 巩固一下刚学的骚操作 #include< ...
- [BZOJ3613][Heoi2014]南园满地堆轻絮 二分答案
Description 小 Z 是 ZRP(Zombies’ Republic of Poetry,僵尸诗歌共和国)的一名诗歌爱好者,最近 他研究起了诗词音律的问题. 在过去,诗词是需要编成曲子唱 ...
- HBase底层存储原理——我靠,和cassandra本质上没有区别啊!都是kv 列存储,只是一个是p2p另一个是集中式而已!
理解HBase(一个开源的Google的BigTable实际应用)最大的困难是HBase的数据结构概念究竟是什么?首先HBase不同于一般的关系数据库,它是一个适合于非结构化数据存储的数据库.另一个不 ...