最折磨人的或许不是一场惨烈战争,而是烦琐的日常生活。
无言博客
一个菜鸟程序员,在复制粘贴的道路上越走越远!!!
CSS让文字竖向排版
无言博客 107 2020-8-3

第一种:

床前明月光,疑似地上霜,举头望明月,低头思故乡
.a{
	width:16px;
	height:auto;
	margin:auto;
	font-size:16px;
	line-height:24px;
	word-wrap: break-word;
}

第二种:

床前明月光,疑似地上霜,举头望明月,低头思故乡
.b{
	width:auto;
	height:100px;
	margin:auto;
	font-size:16px;
	line-height:24px;
	writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/  
	writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl;*/  
}

第三种:

床前明月光,疑似地上霜,举头望明月,低头思故乡
.c{
	width:200px;
	margin: 150px auto;
	font-size: 16px; 
	line-height: 24px;
	transform:rotate(90deg);
	-ms-transform:rotate(90deg); 	/* IE 9 */
	-moz-transform:rotate(90deg); 	/* Firefox */
	-webkit-transform:rotate(90deg); /* Safari 和 Chrome */
	-o-transform:rotate(90deg); 	/* Opera */
}
END

发表评论: