css3 の
text-align:center:justify;
この属性は、単語の両端を揃えることを意味します。
justify の値はテキストの両端を揃えることができます。両端揃えテキストでは、テキスト行の左端と右端が親要素の内側の境界線に配置されます。次に、行の長さが正確に同じになるように、単語と文字の間の間隔を調整します。
例:
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>css中display:justify</title> <style> .box1{ width:500px; line-height:20px; margin:10px auto; background-color:#cdd; text-align:justify;} .box2{ width:500px; line-height:20px; margin:10px auto; background-color:#cdd; text-align:left;} </style> </head> <body> <div>There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really</div> <div>There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really</div> </body></html>
レンダリング: