<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>這裏填寫標題</title> <meta name="keywords" content="這裏填寫關鍵詞" /> <meta name="description" content="這裏填寫說明內容" /> <script language="JavaScript" type="text/javascript"> <!--JS代碼位置--> </script> <style type="text/css"> <!--CSS樣式代碼位置--> .container { display: inline-block; width: 150px; /*根據需求調整寬度*/ height: 150px; overflow: hidden; } .container p { writing-mode: vertical-rl; /*從右向左豎排*/ float:right; } </style> </head> <body> 這裏填寫HTML代碼 <div class="container"> <p>這裏是豎排的文本內容</p><br> <p>這裏是豎排的文本內容1</p> <p>這裏是豎排的文本內容2</p> <p>這裏是豎排的文本內容3</p> <p>這裏是豎排的文本內容4</p> </div> </body> </html>
主要是writing-mode: vertical-rl; 這樣，至於從右到左是float:right;了