CSS3
文章平均质量分 72
关于CSS3
Continue丶
努力变得更好一点
展开
-
CSS3 3D转换
目录3D 特点3D 空间坐标图3D 位移3D 旋转透视呈现我们生活的环境就是3D的,而照片就是3D物体在2D平面呈现的例子。3D的特点首先我们来了解3D的特点。远大近小物体被遮挡不可见当我们在网页上构建3D效果时参照这些特点就可以产出3D效果3D 空间坐标图其次,在CSS中,我们还需要了解对应空间坐标轴,明确了三条坐标的正负方向有利于接下来的学习。如上图,可知向右为x正方向,向左为负向下为y正方向,向上为负直视于屏幕,由屏幕向眼睛为z正方向。3D 位移原创 2021-03-17 21:14:29 · 134 阅读 · 0 评论 -
CSS3 动画
CSS3 动画动画(animation)是CSS3中具有颠覆性的特征之一,可以通过设置多个节点来精确控制一个或一组动画,常来实现复杂的动画效果。相比较过渡,动画可以实现更多变化,更多控制,连续自动播放等效果。动画的基本使用制作动画分为两步:先定义动画再使用(调用)动画1.用 keyframes 定义动画(类似定义类选择器)语法:@keyframes 动画名称{ 0%{ //定义初始状态,如 width:100px; }原创 2021-03-17 11:41:04 · 226 阅读 · 0 评论 -
CSS3 2D转换
CSS3 2D转换转换(transform)是CSS3中具有颠覆性的特征之一,可以实现元素的位移、旋转、缩放等效果,可以理解为简单的变形。1. 位移(translate)可以改变元素在页面中的位置,类似定位优点:不会影响其他元素的位置。语法:transform:translate(x,y);或者可以分开写transform:translateX(x);transform:translateY(y);注意:对行内元素没有效果其中的x,y分别表示在x方向与y方向上的位移量x原创 2021-03-16 22:45:42 · 111 阅读 · 0 评论 -
CSS3的新特性
CSS3的新特性CSS3的现状新增的CSS特性有兼容性问题。IE9+才支持移动端支持优于PC端不断改进中应用相对广泛本篇主要讲:新增选择器和盒子模型以及其他特性。1.CSS3 新增选择器2.CSS3 盒子模型3.CSS3 其他特性1.CSS3 新增选择器CSS3 给我们新增了选择器,可以更加便捷,自由地选择目标元素属性选择器结构伪类选择器伪元素选择器注意:类选择器、属性选择器、伪类选择器,权重为101.属性选择器属性选择器可以根据元素特定属性来选择元素,这样可原创 2021-03-11 13:51:17 · 110 阅读 · 0 评论