文本流向 layout-flow

作用与语法

文本流向layout-flow用来定义网页中的文本流向方式。

即排列方式,主要有两个属性,分别是horizonta (水平的) 和vertical-ideographic (垂直的)

文本流向 layout-flow语法如下

layout-flow : horizontal | vertical-ideographic


属性值说明

horizontal:默认值。定义文本按照从左到右,从上到下的方式显示vertical-ideographic:定义文本按照从上到下,从右到左的方式显示

注意事项

中文一个字为单位,英文一个单词为一个单位。这是一个不建议使用的属性

文本流向实例代码

<html>
<head>
<title>文本流向 layout-flow_Css实例</title>
<style type="text/css">
<!--
p {
height: 65px;
width: 150px;
border: 1px solid #CCCCCC;
margin-bottom: 5px;
vertical-align: top;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.f1{
layout-flow: vertical-ideographic;
}
.f2{
layout-flow: horizontal;
}
-->
</style>
</head>
<body>
  <p class="f1">你好,china</p>
  <p class="f2">你好,china</p>
</body>
</html> 

实例说明

本实例定义了不同的文本流向方式。f1中是从左到右从上到下的显示方式,f2是从上到下,从右到左的显示方式。

posted @ 2014-07-13 19:19  madwoman  阅读(826)  评论(0编辑  收藏  举报