前言
持续学习总结输出中,今天分享的是Web前端,CSS背景图片大小、文字阴影、盒子阴影、过渡
背景图片大小
background-size:宽度 高度;
设置背景图片的大小
background连写拓展
background:color image repeat position/size;
注意点:
• background-size和background连写同时设置时,需要注意覆盖问题
解决:
要么单独的样式写连写的下面要么单独的样式写在连写的里面
文字阴影
text-shadow
给文字添加阴影效果,吸引用户注意
注意:
• 阴影可以叠加设置,每组阴影取值之间以逗号隔开
盒子阴影
box-shadow
给盒子添加阴影效果,吸引用户注意
过渡
transition
让元素的样式慢慢的变化,常配合hover使用,增强网页交互体验
注意点:
过渡需要:默认状态 和 hover状态样式不同,才能有过渡效果transition属性给需要过渡的元素本身加transition属性设置在不同状态中,效果不同的.给默认状态设置,鼠标移入移出都有过渡效果
.给hover状态设置,鼠标移入有过渡效果,移出没有过渡效果
总结
最后分享一句话:
抱怨是在讲述你不要的东西,而不是你要的东西。
《不抱怨的世界》
本次的分享就到这里了!!!
欢迎在评论区留言讨论!!!