Vertically flowing text with css

后端 未结 4 2078
你的背包
你的背包 2021-01-15 14:57

I would like to have a div with some text in it. But I\'d like the text to flow vertically instead of horizontally. Like this;

M

y

t

e

<
相关标签:
4条回答
  • 2021-01-15 15:16

    Please find the answer here you can use text-orientation and

    Please check https://jsfiddle.net/yu7qr809/

    div{
      text-orientation: upright;
      writing-mode: vertical-lr;
     }
    
    0 讨论(0)
  • 2021-01-15 15:18
    .yourtext { -moz-transform: rotate(-90deg);
                -webkit-transform: rotate(-90deg);
                -moz-transform-origin: top right;
                -webkit-transform-origin: top right;
                filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    
    0 讨论(0)
  • 2021-01-15 15:20

    CSS3 has a proposed 'writing-mode' attribute that can be set to 'tb-lr' (write text from top to bottom, write lines from left to right), but I don't know if any browsers support it yet, so its not something to rely on.

    0 讨论(0)
  • 2021-01-15 15:22

    If you have only one line of text you could try using width:1em;letter-spacing:1px (and a space between each letter)

    edit: if you want to use no space between each letter width:1em;letter-spacing:1em;word-wrap:break-word

    0 讨论(0)
提交回复
热议问题