项目开发常用css样式案例大全(例如字体渐变色)

1.字体渐变色 字体渐变色。

注:字体渐变色,要给字体当前标签添加渐变色样式才可生效
(ps:在父级写样式自己不会生效!且Google 火狐 Edge 可以正常运行，但是IE不行。)

span{
//背景颜色渐变色可以根据角度,左右,上下定义渐变色的开始和结束
background: linear-gradient(180deg, #F9BD9B 0%, #DF432E 100%);
font-family: YouSheBiaoTiHei-2;
//其实主要的就是 -webkit-background-clip: text; 这一句代码。值为text时，前缀 -webkit- 必须得加上。

-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
//-webkit-text-stroke:1px black;实现镂空文字（文字边框）
}

1.background-clip属性包括
	border-box，背景被裁剪到边框盒。
	padding-box，背景被裁剪到内边距框。
	content-box，背景被裁剪到内容。
	text，表示只显示文字区域。
2.text-fill-color：文字填充色，实现文字渐变色要展示的是背景的渐变颜色，
所以这里我们需要设置
为transparent(   寻常的- webki t-表示的是Chrome和Safari的私有属'性，但是它却声明了所有的，除了IE浏览器))

示例效果图

未完待续…