![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css3
少油少盐不要辣
趁着年轻,去折腾,去改变吧
展开
-
font-face和font-family不生效
transfonter原创 2024-01-01 22:19:30 · 1139 阅读 · 0 评论 -
transition动画浅析
1.transition是啥transition为一个元素在不同状态之间切换的时候,定义不同的过渡效果。2.如何触发通过添加伪类触发,像是 :hover,:active。需要定义前后两个不同的状态。通过添加普通类名触发,定义前后两个不同的状态。前后不同的状态中,必须有transition属性,下面的例子中,div.addTransition 之所以没有transition属性,是因为...原创 2019-11-29 15:23:06 · 306 阅读 · 0 评论 -
弹性盒模型浅读
1.什么是弹性盒模型flexbox是一种一维的布局模型,它给弹性盒子的直系子元素提供了强大的空间分布和对齐能力。2.主要特性(1)弹性盒子有两根轴线----主轴和交叉轴。主轴由flex-direction定义,交叉轴垂直于它。主轴主轴由flex-direction定义。默认值为row。交叉轴与主轴垂直。起始线。影响着flex子元素的排列方向。主轴取默认值时,水平方向,...原创 2019-11-24 17:39:11 · 316 阅读 · 0 评论 -
css3媒体查询
注意点:将媒体查询写在样式的最后面,防止不小心被覆盖@media screen and (max-width: 300px) { body { background-color:lightblue; } }@media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@media 是非常有用的。浏览器支持情况:...原创 2019-01-22 23:02:48 · 243 阅读 · 0 评论 -
css3写animation相关属性,顺序要求
看如下代码: div { width:100px; height:100px; background:red; position:relative; animation:mymove 3s; animation-iteration-count:2; animation-fill-mode...原创 2019-01-16 12:34:08 · 4199 阅读 · 0 评论 -
设置display:flex弹性盒子后,涉及到的相关的限制问题
1.处于弹性布局中的伸缩子项,设置float、vertical和clear属性无效。原创 2019-03-13 22:58:03 · 585 阅读 · 0 评论 -
opacity和rgba()区别
1.opacity,无继承特性。但仍会导致应用该属性的元素内的所有内容具有透明度,包括文字。因此,会通过该元素看到底下的文字。2.rgba(),应用该属性的元素,该元素内的文字不会有透明度,不能透过文字看到在该元素底下的文字。仅仅是该元素的背景有透明度了。...原创 2019-04-10 23:23:08 · 563 阅读 · 0 评论 -
rgba和opacity区别
1.opacity属性的值,可以被其子元素继承,给父级div设置opacity属性,那么所有子元素都会继承这个属性,并且,该元素及其继承该属性的所有子元素的所有内容透明度都会改变。而RGBA设置的元素,只对该元素的背景色有改变,并且,该元素的后代不会继承该属性。...原创 2019-06-05 16:15:31 · 1577 阅读 · 0 评论