普通的css普通的描边字

当我们在切图的时候,经常会碰见这样的 普通 的描边字,如果我们都切成图片将造成大量的图片素材,工作量大,加载速度慢,难维护

经过反复实验,发现使用 text-shadow 的多重属性即可实现,多重属性主要用 ,(逗号) 来分隔,给元素可以设置多个不同参数的属性。

.text-shadow {
    color: #FFE339;
    text-shadow: 1px 0 0 #622E00, -1px 0 0 #622E00, 0 1px 0 #622E00, 0 -1px 0 #622E00;
    }

以上代码主要设置4个多重属性,然后分别让他们位于元素的上下左右,从而实现描边的效果。

注意:text-shadow的最后一个 ;(分号) 一定不能省略,CssGaga压缩时会删除最后一个属性的分号,导致页面出错,所以text-shadow不能放在最后!

就这样,普通的css就做出了普通的描边字!超简单的!

时间: 2024-08-28 14:32:36

普通的css普通的描边字的相关文章

css文本截字,超出文本省略号显示

一.单行文本截字 p { text-overflow: ellipsis;/*显示省略号代替裁剪的文本*/ white-space: nowrap;/*空白处理方式 不换行*/ overflow: hidden;/*溢出隐藏*/ } 效果: 二.多行文本截字 p{ display:-webkit-box;/*设置盒子为弹性盒容器*/ -webkit-box-orient:vertical;/*设置盒子内部排列方式为垂直排列*/ -webkit-line-clamp:2;/*显示两行*/ text

CSS 字体描边

-webkit-text-stroke: 2px #000; text-stroke: 2px #000; -o-text-stroke: 2px #000;

css 字间距离_css 字体字符间距设置

css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div css字符间距样式实例 1.text-indent设置抬头距离css缩进 即对,对应div设置css样式text-indent : 20px; 缩进了20px 2.letter-spacing来设置字与字间距_字符间距离,字体间距css样式 即对对应div设置css属性样式为letter-spacing:

CSS缩进,CSS字间距

CSS缩进: ? 1 text-indent:2em; 代码意思就是缩进2个字.可以可换成px单位来使用.text-indent:10px;完整一点的写法如下,也可用在<a><p>标签里面,熟能生巧: ? 1 2 <divstyle="width:300px; text-indent:2em;">CSS学习网,Javasrcipt学习及经验分享,圆点网. </div> CSS字间距: letter-spacing字与字间距,例子: <

css 字间距

接下来我们来介绍下css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div css字符间距样式实例1.text-indent设置抬头距离css缩进即对,对应div设置css样式text-indent : 20px; 缩进了20px 2.letter-spacing来设置字与字间距_字符间距离,字体间距css样式即对对应div设置css属性样式为letter-sp

CSS中字距,词距,首行缩进,字体大小,排版相关问题的探讨

先说明下,这是在谷歌浏览器下字体显示等问题做个研究,火狐下有点差异,不过火狐占有率低,而且显示的没有谷歌那么合理,不管它先.IE卡的要死,半死不活,也懒得深入研究这些细节,字体排版上不是强迫症,差别也不大. div{ border: 1px solid black; color: red; font-size: 14px; } <div>文字,咋,排-hello Spacing</div> 就是这么简单的页面.显示结果如下 汉字占的地方是绿色部分是宽14px,高14px 英文字符占

[转]用CSS给SVG &lt;use&gt;的内容添加样式

来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=referral --------------------------------------------------------------------------------------------------------------------- 一篇深入探究如何给SVG<use>元素的内容添加样

学习提高你CSS技术的法则

分享一些我这几个月来理解的东西,这并不是一些代码片段或者是css小技巧,而更像是一些通用的规则或者是最佳实践之类的东西,如下: 不要让你的代码脱离你的掌控,尽量简洁 掌握基础,学习CSS技巧 保持代码的可复用性 面向对象的css Css3 了解他能做的以及你可以使用的部分 渐进增强与优雅降级 Css预处理工具 与时俱进 取长补短 熟能生巧 你想说什么呢?你准备好了?那我们继续往下吧. 1.不要让你的代码脱离你的掌控,尽量简洁 别让你的代码脱离你的掌控 这是编程的一种通用建议,不仅仅适合css.当

css框架之 ---- SASS

SASS是最早的CSS预处理语言,有比LESS更为强大的功能,不过其一开始的缩进式语法并不能为大众接受,不过由于强大的功能,还是有很多开发者选择了SASS. SASS是采用了Ruby语言编写的一款CSS预处理语言,(不用担心,我们并不用学习Ruby也可以使用全部功能)诞生于2007年,最初是为了配合HAML(缩进式HTML预编译器)而设计. 缩进式风格可以缩减代码量,强制代码风格,但不为大多数程序员接受,而且无法兼容已有的CSS代码,这也是SASS出现早,但是没有LESS普及广的原因之一. 但是