css3
文章平均质量分 85
差不少
这个作者很懒,什么都没留下…
展开
-
css3伪元素与选择器
css3 伪元素: ::伪元素 例如: ::before 功能与伪类相同 可设宽高等一切属性 选择器: div[attr] 例:div[class] 找到所有具有class属性的div div[attr=“value”] 例:div[class=“test”] 找到所有具有class属性并且属性值为test的div(class叫test的div) div[attr^=“value”] 例:div[...原创 2019-04-29 17:06:46 · 278 阅读 · 0 评论 -
css3弹性盒子模型
弹性盒子模型 display:flex; 是一种为了应对针对不同屏幕宽度不同设备的一整套新的布局方案。主要是对一个容器中的子元素进行排列、对齐和分配空白空间的方案的调整。 轴: 主轴x轴 方向:从左到右 纵轴/侧轴y轴 方向:从上到下 弹性容器: 一个包含于子元素的容器设置了display:flex,那么这个容器也就变成了弹性容器 属性: flex-direction: 弹性容器中子元素的排列方式...原创 2019-04-29 17:30:19 · 1289 阅读 · 0 评论 -
css3动效一:transition 过渡的简单整理
transition 过渡 语法(简写):transition:porperty duration timing-function delay 例:transition: width 2s 1s,height 2s 2s,background-color 3s 1s;(连写示例 多个以逗号分隔) 注:在开发的时候,推荐尽可能的使用简写属性。 属性: transition-porperty 需要使用...原创 2019-04-29 17:51:14 · 1604 阅读 · 0 评论 -
css3动效二:transform 2D /3D 转换属性
transform 2D /3D 转换属性 transform-origin 更改元素旋转基点 注:默认基点是元素的正中心 2D: 效果主要针对的是页面当中的x轴和y轴进行的一系列的元素变化。 写法 属性:方法 (属性在前方法在后) 示例:transform:ratate(10deg) 属性: translate(x,y) 沿着x y 移动元素/ translateX(n) translat...原创 2019-04-29 19:13:08 · 403 阅读 · 0 评论 -
css3动效三:animation 动画
animation 动画 简写语法: animation: name duration timing-function delay iteration -count direction 属性: animation-name 被调用的关键帧名称 animation-timing-function 动画的速度曲线 属性值: linear 动画从头到尾的速度是相同 ease 默认。动画以低速开始,然后加...原创 2019-04-30 14:27:27 · 690 阅读 · 0 评论