整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
篇CSS3文章复习：CSS3 新特性 ——border 边框属性
有童靴们反应CSS3基础比较容易学习，但难在运用。那小编就把课程稍微调整一下，在运用中教大家轻松学习CSS3。
text-shadow 可以给文本设置阴影。它的语法如下：
text-shadow：h-shadow v-shadow blur color;
它的四个参数分别代表水平阴影（必填）、垂直阴影（必填）、模糊距离（选填）、阴影颜色（选填）。
我们来看个例子：
<p>小白前端</p>
给上面的文字加一些阴影效果：
浏览器中查看：
额...这种粗糙的阴影肯定是不好看的啦~
如果我们想要看起来带点模糊效果的文字，可以去掉它的阴影颜色，并且把水平阴影和垂直阴影设置为0。如下：
text-shadow: 0px 0px 10px;
浏览器中查看：
不过这个模糊是给阴影的，文字本身不会受影响。那怎么才能做出来模糊的文字呢？试想，如果我们把文字变透明，只留下有模糊效果的阴影文字不就完美了！text-fill-color属性是给文字设置填充色的，我们给它的属性设置为透明：
浏览器中查看：
这次你的眼前一片模糊了......
如果你想要制作镂空的文字，需要配合使用文字描边属性——text-stroke（目前只有webkit内核支持。童靴们谨慎使用~）,然后把你的文字颜色设置成透明。
浏览器中查看：
当然了，我们可以制作文字渐变效果。但是文字没有渐变的属性，那我们怎么才能实现文字渐变呢？
因为背景色是可以做渐变的，我们把文字本身的颜色设置为透明，然后在使用背景渐变不就阔以了哈哈
在浏览器中查看：
如果你是一个爱学习的孩子，那就关注小白前端，好文章随时推荐给您。你必须非常努力，才能看起来毫不费力！
可以看作一种特殊字体，其展示的是图标，而不再是文字，其拥有字体的特性，比如大小、颜色、透明效果、阴影等，字体图标加载快、不变形。也可以看作是矢量格式的图标。
（1）iconmoon字体图标库：https://icomoon.io/app
（2）阿里iconfont字体图标库：https://www.iconfont.cn/
（3）font-awesome字体图标库：
以iconmoon为例
（1）选择需要的图标并下载
1）在fonts文件夹下有四种类型的字体文件，每种字体文件兼容浏览器的种类不同
a）.tff格式（TrueTypeFont），美国苹果公司和微软公司共同开发的，在Windows和Mac操作系统中为默认字体；IE9+、FireFox3.5+、Chrome4+、Safari3+、Opera10+、IOS Mobile中的Safari4.2+等浏览器支持该字体。
b）.woff格式（Web Open Font Format-Web开放字体格式），是一种网页所采用的字体格式标准，使用zlib压缩，文件大小一般比TTF小40%；IE9+、FireFox3.6+、Chrome6+、Safari5.1+、Opera11.1+等浏览器支持该字体。
c）.eot格式（Embedded Open Type-嵌入式OpenType ）,微软设计用来在网页使用的字体格式，是OpenType字体的压缩格式，IE专用，IE4+支持该字体。
d）.svg格式（Scalable Vector Graphics-可缩放的矢量图形），它是一种用XML定义的语言，用来描述二维矢量及矢量/栅格图形；Chrome4+、Safari3.1+、Opera10+、IOS Mobile中Safari3.2+等浏览器支持该字体。
其他字体
e）.otf格式（Open Type Font），Microsoft和Adobe公司开发的，.otf格式比.ttf更为强大，可以把PostScript字体嵌入到TrueType中。
2）字体转换
https://www.fontke.com/tool/convfont/
（2）字体图标的引入
1）把字体放到项目的相应位置
将下载解压后的fonts文件夹放到项目路径下
2）在html页面中引入字体
利用CSS的@font-face属性，引入外部字体；
在style.css文件中有如下代码，为固定用法，注意url中字体路径，其它可以不变。
在html的style标签中引入如下代码：
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?8l3wc0');
src: url('fonts/icomoon.eot?8l3wc0#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?8l3wc0') format('truetype'),
url('fonts/icomoon.woff?8l3wc0') format('woff'),
url('fonts/icomoon.svg?8l3wc0#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}3）为元素用该字体
span {
font-family: "icomoon";
}4）为元素添加内容
复制demo.html中需要的图标，如下，将其作为元素的内容。
<span></span> （3）新增字体图标的引入
当利用iconmoon选用字体图标时，如果有新增的字体图标需要加入，则需要用到.json文件，如下，在原先选择的基础上，再选择新选择的字体图标，然后再下载使用。
ont 属性可以用来作为 font-style, font-variant, font-weight, font-size, line-height 和 font-family 属性的简写，或将元素的字体设置为系统字体。
font-family写法示例：
<style>
p{
font-family: "幼圆";
}
</style>
</head>
<body>
<p>19级启嘉班</p>
</body>效果：
*请认真填写需求信息，我们会在24小时内与您取得联系。
