CSS letter-spacingで文字の間隔を指定する
環境
Windows 10 Home 64bit
Google Chrome 110.0.5481.105(Official Build)
構文
letter-spacingは、文字の間隔を指定します。
letter-spacing : 値
値は、数値 + 単位を指定します。文字の間隔になります。継承します。
使用例
<!DOCTYPE html>
<html>
<head>
<style>
.pA {
letter-spacing: 10px; /* 10pxを指定 */
border: 1px solid #000;
width: 400px;
height: 30px;
background: LightBlue;
}
</style>
</head>
<body>
<p class="pA">テストデータ</p>
<p class="pA">Thisisatokyo.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
.pA {
letter-spacing: 10px; /* 10pxを指定 */
border: 1px solid #000;
width: 400px;
height: 30px;
background: LightBlue;
}
</style>
</head>
<body>
<p class="pA">テストデータ</p>
<p class="pA">Thisisatokyo.</p>
</body>
</html>
<!DOCTYPE html> <html> <head> <style> .pA { letter-spacing: 10px; /* 10pxを指定 */ border: 1px solid #000; width: 400px; height: 30px; background: LightBlue; } </style> </head> <body> <p class="pA">テストデータ</p> <p class="pA">Thisisatokyo.</p> </body> </html>
結果
文字の間隔が10pxになります。