Geek Answers Handbook

Color around text in HTML

I needed to show the color around the text on my HTML page, I tried the border property, but it gives a square border around the text. How to reach below requirement

enter image description here

Thanks.

+4
source share
6 answers

I would write the code here ... But this link http://line25.com/articles/using-css-text-shadow-to-create-cool-text-effects explains it so well.

Demo example : http://codepen.io/anon/pen/CDsFb

This is actually much better ...

text-shadow: 3px 3px 0 #000, /* Simulated effect for Firefox and Opera and nice enhancement for WebKit */ -3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;

This ensures that it looks like a matching frame , and not just a shine around your text.

+4
source

You are looking for text-shadow CSS property

 text-shadow: 0px 0px 3px orange;

http://jsfiddle.net/NGPhL/

http://www.quirksmode.org/css/textshadow.html

+3
source

you can use

 text-shadow: 0px 0px 4px #1d1dab; filter: dropshadow(color=#1d1dab, offx=0, offy=0);

http://css3generator.com/

+1
source

You can use the CSS3 text-shadow property. Since the browser supports webkit, this should be taken.

0
source

If the browser does not support CSS3:

Usage can use two text nodes with a font size of 17px and 18px (for example) and positioning with CSS first under the second (position: absolute, z-index: 100, left, top, etc.) with different colors.

0
source

Thanks. For your suggestions, I found an example to get this requirement here

http://gazpo.com/2011/02/text-shadow/ 7. Border around the text

 text-shadow: 0 -4px #00468C,4px 0 #00468C,0 4px #00468C,-4px 0 #00468C,4px -4px #00468C,-4px 4px #00468C,4px 4px #00468C,-4px -4px #00468C;
0
source

More articles:


All Articles