1、给文字加阴影
语法： text-shadow: h-shadow v-shadow blur color;h-shadow ：必需。水平阴影的位置。允许负值。
v-shadow ：必需。垂直阴影的位置。允许负值。
blur ： 可选。模糊的距离。
color ：可选。阴影的颜色。
2、文本溢出处理
固定用法：文字阴影文本溢出示例：
overflow: hidden;溢出隐藏
text-overflow: ellipsis;文本溢出添加省略号来替代修建文本clip: 修建文本
white-space: nowrap;文字不换行
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style type="text/css">/*给文字添加多层阴影的方法,用逗号隔开*/h1 {text-shadow: 2px 2px 3px rgba(255, 0, 0, 0.8),4px 4px 5px rgba(0, 255, 0, 0.9),6px 6px 7px yellow;}ul {width: 300px;/* background-color: yellow; */list-style: none;padding: 0;}ul li {/* height: 25px; *//* line-height: 25px; */overflow: hidden; /* 溢出隐藏 */text-overflow: ellipsis; /* 文本溢出添加省略号 */white-space: nowrap; /* 不换行 */color: #333;}ul li a {color: #333;text-decoration: none;}ul li:hover {color: orange;}ul li:hover a {color: orange;}</style></head><body><h1>这是一个标题标签</h1><ul><li><a href="" title="中国高校近期密集换帅 39所“985”仅7所非副部">中国高校近期密集换帅 39所“985”仅7所非副部</a></li><li><a href="">北大教授质疑韩春雨实验 向河北科大致公开信</a></li><li><a href="">新疆出台新规：禁止家长引诱强迫孩子参加宗教</a></li><li><a href="">成本5毛假药卖12元 三地警方查出10万粒</a></li></ul></body></html>
3、使用服务器端字体
语句：@font-face
使用方式示例：
/*定义1号字体 */@font-face{font-family: 定义字体名称1;/*本地没有字体,就引用src下面的服务器字体*/local('本地文件'),/*服务器字体引用*/src: url('font/Capture_it.ttf'),url('font/Capture_it.woff'),url('font/Capture_it.svg'),url('font/Capture_it.otf');}/*定义2号字体 */@font-face{font-family: 定义字体名称2;/*本地没有字体,就引用src下面的服务器字体*/local('本地文件'),/*服务器字体引用*/src: url('font/Capture_it.ttf'),url('font/Capture_it.woff'),url('font/Capture_it.svg'),url('font/Capture_it.otf');}/*使用字体*/h1 {font-family: 定义字体名称1; /* 调用上边自定义的字体名称 */}h2 {font-family: 定义字体名称2;/* 调用上边自定义的字体名称 */}
实际使用示例：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><link href='//cdn./webfonts/nomal/22447/46010/57ff2261f629db0e0ce4a8de.css' rel='stylesheet'type='text/css'/><style type="text/css">@font-face {font-family: mywebfont;src: url('font/Capture_it.ttf'),url('font/Capture_it.otf');}@font-face {font-family: mywebfont2;src: url('font/Capture_it_2.ttf');}h1 {font-family: mywebfont; /* 调用上边自定义的字体名称 */}h2 {font-family: mywebfont2;}h1.text {font-family: 'winmantun23001661c7965b57af';}</style></head><body><h1>HELLO WORLD!</h1><h2>HELLO WORLD!</h2><h1 class="text">叽叽叽叽叽叽叽叽叽叽</h1></div></body></html>
以上方式仅适用英文,如何实现中文字体呢?
以下是JS情况设置
进入这个网址注册账号生成你的 AccessKey第一步：JS调用 (本JS支持https,只需要将src属性中的http改为https即可)
将以下代码添加到您网页的：标签之中
<script type="text/javascript" src="http://cdn./wwwroot/js/wf/youziku.api.min.js"></script><script type="text/javascript">$youziku.load("body", "c2453ac6544541bd9d4cf6cd45d28a47", "jdlibianjian");/*$youziku.load("#id1,.class1,h1", "c2453ac6544541bd9d4cf6cd45d28a47", "jdlibianjian");*///第一个参数"seletor1"请设置选择器代码（如:#id1、.class1、h1等），多个选择器，请用英文逗号隔开（如:#id1,.class1,h1）。//第二个参数"xxx"请您设置要使用的字体的Accesskey。//第三个参数"fontfamily"请设置字体的英文名,在字体库中获得，该参数主要是为了标记当前所用字体，方便检查、核对。//第三个参数可支持英文内容使用不同的英文字体（其实是字体优先级）；如：$youziku.load("seletor1", "xxx", "你自定义的英文字体fontfamily,有字库fontfamily");/*．．．*/$youziku.draw();</script>
设置白名单(必须)
在项目发布到远程时，需要将远程域名，添加在有字库 白名单 中。白名单是为了保障用户的字体不被盗用，设置白名单后，远程网站就可以流畅应用有字库字体了，本地测试可不设置（已默认添加到白名单了）。
多套字体的应用
同一页面上要引用多套字体，只需要将那套字体页面中的应用语句
[$youziku.load("xxxxx","xxxxxxxxxxxxxxxxxx","xxxxxxxxxx");]设置在当前应用语句列表之后(．．．的位置)即可。不需要重复引用第一步中的JS文件和[$youziku.draw();]语句
PC端和手机端使用不同字体效果（同一个页面下）
<script type="text/javascript" src="http://cdn./wwwroot/js/wf/youziku.api.min.js"></script><script type="text/javascript">$youziku.load("selector1", "xxx", "fontfamily").mobile("xxx","fontfamily");//第一个参数"selector1"请设置选择器代码（如:#id1、.class1、h1等），多个选择器，请用英文逗号隔开（如:#id1,.class1,h1）。//第二个参数"xxx"请您设置PC端要使用的字体的Accesskey。//第三个参数"fontfamily"请设置字体的英文名，该参数主要是为了标记当前所用字体，方便检查、核对。//第三个参数可支持英文内容使用不同的英文字体（其实是字体优先级）；如：$youziku.load("seletor1", "xxx", "你自定义的英文字体fontfamily,有字库fontfamily");//调用mobile()函数即手机端应用不同的字体，第一个参数"xxx"请您设置手机端要使用的字体的Accesskey，第二个参数"fontfamily"请设置字体的英文名，该参数主要是为了标记当前所用字体，方便检查、核对。手机端也支持英文内容使用不同的英文字体。$youziku.draw();</script>
css方式 按照官方文档进行
