background-postion 规定背景图片的位置 px 第一值是x轴,第二个是y轴,默认是从左上角开始的,如果只设置第一个,第二个默认是auto 百分比,根据相对于父元素 top | center | bottom | left | center | right cover 把图像扩展至足够大,以使背景完全覆盖背景区域。背景图像的某些部分会无法显示(保持等比比例) contain 吧图片扩...

今天在调试一个前端项目时碰到一个贼尴尬的问题: 今天老师让做一个送花的前端项目,就是一个男孩跑到女孩面前送花的纯css项目   本来这项目就要完成的,可是就在这时,,我发现了一个严重的问题 花的z-index无论我怎么设置它都只能只能贴在手上,不能设置到右手的下面!!感觉就是绑着的一样       按我一贯的作风!!!! 额,,可惜我找了好久。。。大部分都说...

web前端--grid布局

css3  css  

  

2020-05-19 00:58:59

grid 布局 grid概述 Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局; Grid 布局则是将容器划分成"行"和"列",产生单元格,然后指定"项目所在"的单元格,可以看作是二维布局 gird很强大,采用网格布局的区域,称为"容器"(container)。容器内部子...

彻底弄懂CSS优先级规则

css3  css  

  

2020-05-31 20:44:42

彻底弄懂CSS优先级规则 文章目录 彻底弄懂CSS优先级规则 1. css继承 & 距离 1.1 css继承距离优先 1.2 非继承的平级css距离无关,取决于加载顺序 2. 单个选择器 & 优先级关系链 2.1 demo1 — 优先级关系链应用 2.2 demo2 — 基于形式的优先级 3. 选择器组合 & 优先级计算 4. !important ...

[CSS3] CSS3学习摘录(1)

CSS/CSS3  css3

  

2020-10-28 03:09:37

一、CSS3的主要新特性 1)选择器 2)阴影 3)形状转换(2d,3d) 4)变形 5)动画(过度动画,帧动画) 6)边框 7)多重背景 8)反射 9)文字 10)颜色(rgba/hsl/hsla) 11)滤镜 12)弹性布局 13)多列布局 14)盒模型 15)web字体 16)媒体查询 二、CSS3属性前缀 兼容不同浏览器,添加厂商前缀 Trident内核:主要代表为IE浏览器 Gecko内...

[CSS3] CSS3 Note(2)

CSS/CSS3  css3

  

2020-11-04 01:50:18

六、CSS3平铺背景 多重背景 background:背景色 背景图片 平铺方式 位置,背景色 背景图片 平铺方式 位置,… background-size:设定背景图像的尺寸 length:设置背景图像的高度和宽度。第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二个值会被设置为 “auto”。 percentage:以父元素的百分比来设置背景图像...

[CSS3] CSS3 Note(3)

CSS/CSS3  css3

  

2020-11-09 18:39:55

上一篇👈:CSS3 Note(2) Created: 2020/11/07 Created by: ShianGee Hwang Tags: 动画过渡, 盒子变形 十、盒子的变形 1/CSS 2D变形 2/CSS3 3D变形 perspective 让子元素获得透视效果 主流浏览器都不支持,谷歌要加-webkit-,或者直接在长度后加单位 transform-style 规定如何在 3D 空间中...

[CSS3] CSS3 Note(4)

CSS/CSS3  css3

  

2020-11-10 06:07:51

上一篇👈:CSS3 Note(3) Created: 2020/11/09 Created by: ShianGee Hwang Tags: flex布局, 响应式布局, 布局 十三、多列布局 兼容写法: column-count 规定元素应该被划分的列数 column-gap 规定列之间的间隔 length:把列间的间隔设置为指定的长度。 normal:规定列间间隔为一个常规的间隔。 colu...