本文摘自PHP中文网,作者醉折花枝作酒筹,侵删。
css中可以使用transform属性使文字方向转90度,语法格式为“transform: rotate(90deg)”。transform属性表示元素应用2D或3D转换,当值为rotate时为旋转,正数为顺时针旋转,负数为逆时针旋转。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <!DOCTYPE html>
<html lang= "en" >
<head>
<meta charset= "UTF-8" >
<meta name= "viewport" content= "width=device-width, initial-scale=1.0" >
<meta http-equiv= "X-UA-Compatible" content= "ie=edge" >
<title>Document</title>
<style>
.box {
width: 20px;
height: 30px;
transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
}
</style>
</head>
<body>
<p class = "box" >123</p>
</body>
</html>
|
效果:
阅读剩余部分
相关阅读 >>
css如何设置背景
纯css实现图片左右翻转效果(附代码)
css怎么让图片不变形
css样式冲突怎么办
利用css如何实现图片轮播效果?(代码示例)
css 如何设置带有正方形项目的列表
css写法怎么优化
html中图片显示方式-----img与background的区别
css 什么是相对长度单位
css如何把背景旋转
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » css如何使文字方向转90度