css表格文字超数量就竖排_css实现文字竖排

css实现文字竖排

h1 span { display: block; }

N

E

T

T

U

T

S

第二种方法A：同样使用CSS，在需要竖向显示的地方，强制定义显示区域的宽度，这样字符会自动竖向排列：请看具体代码：

Vertical Text

h1 {

width: 50px;

font-size: 50px;

word-wrap: break-word;

}

NETTUTS

第二种方法B：同样是使用CSS，推荐使用这种方法，觉得这个方法兼容性也好，而且代码简洁，字符也容易控制。

竖向排列的文字

h1 {

width: 50px;

font-size: 50px;

word-wrap: break-word;

letter-spacing: 20px;

}

我爱北京天安门

第三种方法：使用JavaScript(不推荐，其实这么一个小小的功能，动用JS就太不划算了，毕竟我们有比这更有效、更简洁的办法)

Vertical Text

h1 span { display: block; }

NETTUTS

var h1 = document.getElementsByTagName(‘h1′)[0];

h1.innerHTML = ‘’ + h1.innerHTML.split(”).join(‘’) + ‘’;

四种方法介绍完了，究竟哪一种更适合您呢？自己比较下，根据你自己的实际情况选择吧，每种方法各有千秋。

标签:css

发表评论：

昵称

邮件地址 (选填)

个人主页 (选填)