HTML文本/文字豎直方向/縱向顯示


HTML vertical text (Safari, Firefox, Chrome, and Opera)



.vText { -moz-transform: rotate(-90deg) translate(0, 100%); -moz-transform-origin: 0% 100%; -o-transform: rotate(-90deg) translate(0, 100%); -o-transform-origin: 0% 100%; -webkit-transform: rotate(-90deg) translate(0, 100%); -webkit-transform-origin: 0% 100%; transform: rotate(-90deg) translate(0, 100%); transform-origin: 0% 100%; }


IE:
.zx {writing-mode:bt-lr; }


在IE和firefox等不同瀏覽器中的效果不一樣,用法也不一樣。


Ref
http://brickybox.com/2010/09/15/html-vertical-text-safari-firefox-chrome-and-opera
http://generatedcontent.org/post/45384206019/writing-modes
http://stackoverflow.com/questions/5524799/how-do-you-do-vertical-text-in-firefox


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM