html div边框添加文字,CSS字体边框？

更新

这是生成笔画的SCSS mixin：http : //codepen.io/pixelass/pen/gbGZYL

/// Stroke font-character

/// @param  {Integer} $stroke - Stroke width

/// @param  {Color}   $color  - Stroke color

/// @return {List}            - text-shadow list

@function stroke($stroke, $color) {

$shadow: ();

$from: $stroke*-1;

@for $i from $from through $stroke {

@for $j from $from through $stroke {

$shadow: append($shadow, $i*1px $j*1px 0 $color, comma);

}

}

@return $shadow;

}

/// Stroke font-character

/// @param  {Integer} $stroke - Stroke width

/// @param  {Color}   $color  - Stroke color

/// @return {Style}           - text-shadow

@mixin stroke($stroke, $color) {

text-shadow: stroke($stroke, $color);

}

是的旧问题..已接受(并且很好)的答案..

但是...如果有人需要它并且讨厌键入代码...

这是一个2px黑色边框，具有CrossBrowser支持(不是IE)，我需要@fontface字体使用它，因此它需要比以前看到的答案更干净...我在像素方面进行了每一方面的研究，以确保“(模糊”(handrawn或类似字体)字体。可以添加亚像素(0.5px)，但我不需要它。

只是边界的长代码？？？...是！！！

text-shadow: 1px 1px 0 #000,

-1px 1px 0 #000,

1px -1px 0 #000,

-1px -1px 0 #000,

0px 1px 0 #000,

0px -1px 0 #000,

-1px 0px 0 #000,

1px 0px 0 #000,

2px 2px 0 #000,

-2px 2px 0 #000,

2px -2px 0 #000,

-2px -2px 0 #000,

0px 2px 0 #000,

0px -2px 0 #000,

-2px 0px 0 #000,

2px 0px 0 #000,

1px 2px 0 #000,

-1px 2px 0 #000,

1px -2px 0 #000,

-1px -2px 0 #000,

2px 1px 0 #000,

-2px 1px 0 #000,

2px -1px 0 #000,

-2px -1px 0 #000;