css3属性笔记
渠元东
生命不息,学习不止
展开
-
backface-visibility_背景图片不可见
backface-visibility_背景图片不可见 backface-visibility属性定义旋转时,该属性背面是否可见 如果在旋转的时候不希望看到其背面,可使用该属性 语法: backface-visibility:visible | hidden; 属性 描述 visible 当翻转时,背面是可见的 hidden 当翻转时,背面是不可见的 实例: <st...原创 2019-05-08 21:19:00 · 525 阅读 · 0 评论 -
CSS中的伪类和目标选择器使用
(一)结构伪类选择器 常见的结构伪类选择器: :first-child选取首个子元素 :last-child选取最后一个子元素 :nth-child(n)匹配属于父元素的地n个子元素 n的值,0.1.2.3… 匹配偶数位置的子元素 :nth-child(even)或:nth-child(2n) 匹配奇数位置的子元素:nth-child(odd) 或 :nth-child(2n-1) 或 :nt...原创 2019-05-08 23:19:47 · 1670 阅读 · 0 评论 -
清除浮动
清除浮动 语法 在CSS中,clear属性用于清除浮动,基本语法如下: 选择器 { clear : 属性值 } 属性值 描述 left 清除左侧浮动 right 清除右侧浮动 both 清除左右两侧的浮动 用法 额外标签法 示例: <div style="clear: both"></div> 优点:通俗易懂,书写方便 缺点:添加许多无...原创 2019-05-08 23:42:31 · 101 阅读 · 0 评论 -
CSS3中变形与过渡的使用
transform中常见的应用 平移:translate(x轴的平移距离,y轴的平移距离) 示例: transform:translate(20px,20px); 旋转: 缩放: 倾斜的效果:原创 2019-05-06 17:40:56 · 191 阅读 · 0 评论 -
3D效果_perspective属性
基础 css3中的transform可以做2D操作,当然也有3D操作。 3D效果的显示在于父元素必须有一个perspective属性。 例如: <div class="div1"> <!-- perspective --> <div class="div2"></div> <!-- transform --> </div>...原创 2019-05-06 23:22:18 · 795 阅读 · 0 评论 -
字体图标
字体图标 字体图标 图标和字体一样,可以设置各种样式,例如:可以设置宽,高,颜色,大小… 字体图标的使用流程 第一步:打开常用矢量标库(本例是以国外矢量图标库为例展开) 国外矢量图标库 Iconfont-阿里巴巴矢量图标库 第二步:下载字体图标并将解压后的font文件放置到目标文件目录中 注意: demo.html 中是字体图标的信息,该信息会在后续的代码中使用到 第三步:在样式里面...原创 2019-05-09 23:31:45 · 226 阅读 · 0 评论