![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS3
亿米酒酒
本人已经离开IT行业,文章不再更新
展开
-
html水平滚动条隐藏,但需要滚动
把下面的复制到css里面就可以了 ::-webkit-scrollbar { background-color: transparent; display: none; }原创 2021-12-02 13:30:27 · 94 阅读 · 0 评论 -
如何使用CSS3实现3D效果
一、 设置一个立方体非常简单 首先需要在最外层的div设置perspective:800px;的查看位置视图,这里建议在1000px左右,不然可能会出现拉伸变型。 使用transform-style:preserve-3d;进行3D转换,立方体需要设置6个面,通过相对定位层叠在一起,最好给每一个面都设置边框和背景颜色透明以方便查看。 定位立方体6个面的transform方法有trans...原创 2019-01-17 20:59:10 · 3403 阅读 · 1 评论 -
Hover伪类实用特效
一、文本伪类bug解决办法 在文字下面设置鼠标移入出现下划线的时候,通常会发现下划线出现了但文字却有向上移动的现象。这是因为文字与底部之间被有厚度的下划线填充所造成的,“文字与底部的距离+下划线的厚度”文字就会向上移动。 只需要设置同样厚度的上边框就可以抵消对文字的影响,同时上边框需要和背景颜色相同,这样就可以达到隐藏的效果。 .twotop4 span:nth-of-type(1)...原创 2019-01-18 20:56:22 · 1201 阅读 · 3 评论 -
用css做一个小风车
直接设置一个大的正方形盒子,然后在里面放四个盒子充当叶片 <div class="contenr"> <div class="bix1"></div><!--叶片1--> <div class="bix2"></div><!--叶片2--> &原创 2019-02-01 19:42:19 · 1658 阅读 · 0 评论 -
鼠标悬停图片360°旋转
鼠标悬停图片旋转,是可以用css3的hover伪类来实现鼠标移入元素发生变化的这么一个效果,利用这一特性巧妙地给伪类添加css3的旋转动画,这样就摒弃掉烦人且复杂的js简单的就实现 <!doctype html> <html> <head> <meta charset="utf-8"> <title>鼠标悬停图片360°旋转</..原创 2019-02-10 20:25:34 · 3223 阅读 · 0 评论