<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        p{
            background: yellowgreen;
　　　　　　　/*文字竖直书写*/
　　　　　　　/*writing-mode: tb-rl;*/
　　　　　　　writing-mode: vertical-rl;
            font-weight: bold;
            font-size: 20px;
            /*字符之间的距离*/
            letter-spacing: 10px;
            /*单词之间的距离*/
            word-spacing: 10px;
        }
    </style>
</head>
<body>
<p>这是一段竖直写的文字 hello world</p>
</body>
</html>

vertical-rl表示文本是垂直方向(vertical)展示，然后阅读的顺序是从右往左(rl:right-left)，跟我们古诗的阅读顺序一致。

vertical-lr表示文本是垂直方向(vertical)展示，然后阅读的顺序还是默认的从左往右(lr:left-right)，也就是仅仅是水平变垂直。

writing-mode，文字竖直书写，字符之间距离，单词之间距离的更多相关文章

  1. html的a标签display:block之后文字竖直居中

    设置行高和a标签的高度一样就能居中,使用line-height

  2. CSS -- 文字竖直居中

    元素的height 和 lineheight 设置为一样即可.

  3. HTML文本/文字竖直方向/纵向显示

    HTML vertical text (Safari, Firefox, Chrome, and Opera) .vText { -moz-transform: rotate(-90deg) tran ...

  4. 三个css属性 设置文字竖直居中

    display: flex; justify-content:center; align-items:Center;

  5. android中自定义view---实现竖直方向的文字功能，文字方向朝上，同时提供接口，判断当前touch的是哪个字符，并改变颜色

    android自定义view,实现竖直方向的文字功能,文字方向朝上,同时提供接口,判断当前touch的是哪个字符,并改变颜色. 由于时间比较仓促,因此没有对代码进行过多的优化,功能远远不如androi ...

  6. css控制竖直文字显示

    假如有一天,你把水平文字看腻味了...... 我建议你不妨试试垂直文字显示,就像这样: 我 是 竖 直 显 示 的 : 哈哈! 言归正传,怎么把一段话,垂直显示呢? 方法1: //把下面代码另存为ht ...

  7. input竖直的输入框，文字从上到下排列

    有的时候可能会有这样的需求,一个竖直的输入框,输入信息,文字也是从上到下排列: (但是在移动端或用轮播swiper时不起作用,可以用textarea代替input) <!DOCTYPE html ...

  8. CollectionView水平和竖直瀑布流的实现

    最近在项目中需要实现一个水平的瀑布流(即每个Cell的高度是固定的,但是长度是不固定的),因为需要重写系统 UICollectionViewLayout中的一些方法通过计算去实现手动布局,所以本着代码 ...

  9. [LeetCode] Binary Tree Vertical Order Traversal 二叉树的竖直遍历

    Given a binary tree, return the vertical order traversal of its nodes' values. (ie, from top to bott ...

随机推荐

  1. MATLAB 中自定义函数的使用

    MATLAB在文件内部(在函数内部)定义函数,但文件名以开头函数来命名,与Java中每个文件只能有一个公开类,但在文件内部还是可以定义其他非公开类一个道理. 无参函数 do.m function do ...

  2. fiddler抓包工具遇到的问题-------502报错

    遇到的问题: 打开浏览器,输入本机的虚拟机地址的bugfree,出现无法连接的提示,具体是: [Fiddler] The connection to '192.168.211.128' failed. ...

  3. 拓扑排序+并查集——cf1131D

    以前做过了忘记掉了..拓扑排序如果要处理等于关系,就要用并查集把相等关系进行缩点 /* 1.相等关系用并查集合并 2.不等关系用有向边链接 3.拓扑排序求顺序 */ #include<bits/ ...

  4. B/S架构及其运行原理

    一. B/S的概念 B/S(Brower/Server,浏览器/服务器)模式又称B/S结构,是Web兴起后的一种网络结构模式.Web浏览器是客户端最主要的应用软件. 这种模式统一了客户端,将系统功能实 ...

  5. EF实体模型的更新

    摘要 解决前期数据库优先添加的实体,然后数据库表结构发生变化后,导致代码操作EF插入更新数据失败问题 EF 数据库更新模型 相比大家在使用实体操作数据库的时候,都是采取数据库优先,手动添加实体模型.但 ...

  6. java分析工具arthas

    wget https://alibaba.github.io/arthas/arthas-boot.jar java -jar arthas-boot.jar --target-ip 0.0.0.0

  7. LOJ10157——皇宫看守（树形DP）

    传送门:QAQQAQ 题意:在一个树上放置守卫,使每一个节点都至少有相邻一节点放置守卫,使最终经费最少 思路:树形DP 首先会想到没有上司的舞会,0表示不放守卫,1表示放守卫,但考虑到对于当前点不放守 ...

  8. 分布式事务的2PC、3PC和TCC

    1.2PC协议 2PC 是二阶段提交(Two-phase Commit)的缩写,顾名思义,这个协议分两阶段完成.第一个阶段是准备阶段,第二个阶段是提交阶段,准备阶段和提交阶段都是由事务管理器(协调者) ...

  9. [Ynoi2012]D1T1

    题目 套路的根号分治啊 我们设置一个值\(S\) 对于\(S\leq x\)的操作,我们直接暴力修改,显然这样只会修改\(\frac{n}{S}\)次,所以我们需要一个能够\(O(1)\)修改的数据结 ...

  10. 详解position定位与定位应用

    定位一直是WEB标准应用中的难点,如果理不清楚定位那么可能应实现的效果实现不了,实现了的效果可能会走样.如果理清了定位的原理,那定位会让网页实现的更加完美.     定位的定义:    在CSS中关于 ...