透明度
- opacity 它设置的是整个元素的透明,取值 0-1, 0 完全透明, 1 完全不透明
- 在颜色位置设置alpha通道(rgba) 可以设置颜色的透明度, 取值 0-1, 0 完全透明, 1 完全不透明
鼠标
cursor: pointer; 鼠标指针变成手型
cursor: move; 鼠标指针变成移动的图标
cursor: crosshair; 鼠标指针变成十字形
cursor: text; 鼠标指针变成文本输入框
cursor: default; 鼠标指针变成默认的箭头
cursor: not-allowed; 鼠标指针变成禁止的图标
cursor: none; 鼠标指针变成隐藏的图标
cursor: inherit; 鼠标指针继承父元素的样式
cursor: url(图片路径), auto; 鼠标指针变成自定义的图标,并且鼠标指针变成默认的箭头
盒子隐藏
- display:none, 不生成盒子
- visibility:hidden, 生成盒子,但是隐藏。
背景图
img 元素是属于html的概念
背景图属于css的概念
1.当图片属于网页内容时,必须使用img元素
2.当图片仅用于美化网页时,必须使用背景图
涉及到的css属性
- background-image:url(图片路径), 背景图
- background-repeat:no-repeat, 背景图不重复
- background-repeat:repeat-x, 背景图只在x轴重复
- background-repeat:repeat-y, 背景图只在y轴重复
- background-repeat:repeat, 背景图在x轴和y轴都重复
- background-size:cover, 背景图覆盖整个盒子
- background-size:contain, 背景图覆盖整个盒子,并且保持图片的长宽比
- background-size:100px 100px, 背景图覆盖整个盒子,并且保持图片的长宽比
- background-position:center, 背景图居中
- background-position:center center, 背景图居中
- background-position:right bottom, 背景图居右下方
- background-attachment:fixed, 背景图固定在页面上
- background-attachment:scroll, 背景图跟随页面滚动
- background-color:red, 背景颜色
Comment here is closed