CSS让文字竖向排版

无言博客 382 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
文章标题:CSS让文字竖向排版
原文链接:http://wuyubk.cn/post/40
若无特殊说明,本博客文章皆为原创,转载请注明出处

上篇文章:Emlog单独音乐页面插件(QQ音乐源)
下篇文章:Emlog添加【日历】侧边栏
标签:css
发表留言