HTML css——更多样式

更多样式

透明度

1. opacity 设置整个元素的透明度，0~1

2. 在颜色位置设置alpha通道 rgba()

鼠标

cursor: pointer;

cursor:ulr(“链接 .ico”),auto

盒子隐藏

1. display:none 不生成盒子

2. visibility:hidden 生成盒子，只是视觉上移除 盒子仍然占据空间

背景图

和img元素区别

img元素是属于HTML概念

背景图是属于css概念

1. 当图片属于网页内容，必须使用img元素

2. 当图片仅属于网页的美化时，必须使用背景图

涉及css属性

1. background-image

2. background-repeat

默认情况下，背景图会在横坐标纵坐标重复

3. background-size

预设值：contain cover ，类似objec-fit
数值或百分比

4. background-position

设置背景图位置

预设值：left bottom right top center
数值或百分比

雪碧图（精灵图） spirit

5. background-attachment

背景图是否固定

6. 背景图 背景颜色 混用

7. 速写（简写）background

background：url() no-repeat 位置/尺寸 fixed 颜色

先写位置：50% 50% 再写尺寸/100%