-webkit-text-stroke-width
Baseline
Widely available
This feature is well established and works across many devices and browser versions. Itâs been available across browsers since 2017å¹´4æ.
-webkit-text-stroke-width 㯠CSS ã®ããããã£ã§ãããã¹ãã®ç·ã®å¤ªããæå®ãã¾ãã
æ§æ
css
/* ãã¼ã¯ã¼ãå¤ */
-webkit-text-stroke-width: thin;
-webkit-text-stroke-width: medium;
-webkit-text-stroke-width: thick;
/* <length> å¤ */
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-width: 0.1em;
-webkit-text-stroke-width: 1mm;
-webkit-text-stroke-width: 5pt;
/* ã°ãã¼ãã«å¤ */
-webkit-text-stroke-width: inherit;
-webkit-text-stroke-width: initial;
-webkit-text-stroke-width: unset;
å¤
<line-width>-
ç·ã®å¤ªãã
å ¬å¼å®ç¾©
| åæå¤ | 0 |
|---|---|
| é©ç¨å¯¾è±¡ | ãã¹ã¦ã®è¦ç´ |
| ç¶æ¿ | ãã |
| è¨ç®å¤ | 絶対çãªé·ã |
| ã¢ãã¡ã¼ã·ã§ã³ã®ç¨®é¡ | é¢æ£å¤ |
å½¢å¼ææ³
-webkit-text-stroke-width =
<line-width>
<line-width> =
<length [0,â]> |
hairline |
thin |
medium |
thick
ä¾
ç·ã®å¹ ãå¤æ´
CSS
css
p {
margin: 0;
font-size: 4em;
-webkit-text-stroke-color: red;
}
#thin {
-webkit-text-stroke-width: thin;
}
#medium {
-webkit-text-stroke-width: 3px;
}
#thick {
-webkit-text-stroke-width: 1.5mm;
}
HTML
html
<p id="thin">Thin stroke</p>
<p id="medium">Medium stroke</p>
<p id="thick">Thick stroke</p>
çµæ
ä»æ§æ¸
| Specification |
|---|
| Compatibility # the-webkit-text-stroke-width |