鼠标消失/文字模糊/相对位置

最新推荐文章于 2023-03-24 21:47:46 发布

王不留行的寒光粉

最新推荐文章于 2023-03-24 21:47:46 发布

阅读量523

点赞数

CC 4.0 BY-SA版权

分类专栏：小的知识点文章标签： css

本文链接：https://blog.youkuaiyun.com/sinat_37527191/article/details/62932760

小的知识点专栏收录该内容

3 篇文章

订阅专栏

本文介绍了三种实用的CSS技巧：如何让鼠标光标消失、如何利用阴影效果使文字呈现模糊感以及如何精确调整元素位置。通过这些技巧，可以增强网页的设计感和用户体验。

1、鼠标消失

*{	
    cursor: none!important;	
}

    大括号前的"*"使所有元素都使用括号内内容；
   cursor：光标；
   !important：提高优先级，增加样式权重

2、文字模糊

*{ 
    color: transparent;
    text-shadow: #111 0 0 5px;
}

    transparent：透明
   text-shadow:apx bpx cpx #color；
       其中a指X轴上的位移，b指Y轴上的位移，c指阴影的宽度，color指阴影的颜色值；a、b可为负，c不能为负。

给文字加阴影，刚好上面的数值可以让文字模糊

3、position: relative;

以该块本来该处的位置的左上角为基准，按照自定标准移动

#eye2{
        width: 11px;
        height: 13px;
	background: #282828;
	border-radius: 50%;
	position: relative;
	top: 30px;/*设置定位元素的上外边距边界与其包含块上边界之间的偏移*/
	left: 27px;

	/*旋转该元素*/    
	transform: rotate(8deg);
     }