スポンサーリンク

html css テキストの右寄せ、中央寄せ、左寄せ

テキストの右寄せ、中央寄せ、左寄せ

テキストの位置を指定するには、align属性に値を入れることで位置を指定できます。

値はright、center、leftがあります。

<div align="right">右寄せ</div>
<div align="center">中央寄せ</div>
<div align="left">左寄せ</div>

[css] テキストの右寄せ、中央寄せ、左寄せ

cssでテキストの位置を指定する場合は、下記のようにtext-alignプロパティをcssファイルのクラスに書き込むことで可能になります。

htmlサンプルコード

<html>
<head>
    <link rel="stylesheet" type="text/css" href="../css/sample.css">
</head>
<body>
    <div class="text-right">右寄せ</div>
    <div class="text-center">中央寄せ</div>
    <div class="left-light">左寄せ</div>    
</body>

</html>

cssサンプルコード

.text-left{
    text-align: left
}

.text-center{
    text-align: center;
}

.text-right{
    text-align: right
}

実行結果

実行結果は下記のようになります。