CSS实现文字竖向排版的简单方法

知识技术 2020-11-12 00:49 1642
转载请务必注明: 来源:《建站管家》https://www.df81.com/news/120.html

CSS实现文字竖向排版的简单方法,bootstrap4文字竖向排版代码:

主要用到的CSS属性:writing-mode: vertical-lr;及writing-mode: tb-lr;/*IE浏览器*/,英文字符加上这句:word-wrap: break-word;/*英文的时候需要加上这句,自动换行*/

效果图:

代码如下:

<style>
.text-vertical {
    margin: 0 auto;
    height: 140px;
    writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/
    writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl;*/
    word-wrap: break-word;/*英文的时候需要加上这句,自动换行*/
}
</style>
<!-- 这首诗要转载,请注明来自:www.df81.com --> 
<div class="text-vertical">远看代码黑乎乎,上头密来下头疏。若把电脑倒过来,下头密来上头疏。</div>  
<div class="text-vertical">www.df81.com</div>

点赞 (0)

收藏 (0)

本站部分信息来源网络,如有侵权,请联系QQ:1062129401删除。

上一篇: 《建站管家》二次开发文档

下一篇: cuteFTP及FileZilla连接ftp服务器失败,提示"AUTH TLS"错误的解决方法

请先登录后,再发表评论 ~ ~
发表评论
发表评论
发表帖子
广告位招租( ¥5 / 天 )
点击咨询
相关帖子

如果要判断文件是否存在,用函数 is_file(),如果要判断目录是否存在,用函数 is_dir()
用宝塔安装TP程序后,网站前台可以访问,后台无法访问,不是程序问题,而是web服务器环境配置问题(PHP配置),出现这种问题,一般是windows主机安装宝塔造成的,linux安装宝塔不会出现此错误
广告位招租( ¥3 / 天 )
点击咨询
广告位招租( ¥2 / 天 )
点击咨询
广告位招租( ¥1 / 天 )
点击咨询
最新帖子

小朋友,你爸爸是谁啊?这很单纯的,就像我们碰到别人会问:你吃过饭了吗?类似;许多人初次相识,经常会问:你是做什么的啊?你做什么,好像决定你收入的高低,你,资产的范围
1、升级框架到ThinkPHP8.0.3【要求PHP8.1+环境,推荐PHP8.1】 2、启用/禁用调试模式等小细节改进
后台点击生成站点地图 一直转圈圈没有反应,
在线客服