• 文本属性


    本文地址:http://www.cnblogs.com/veinyin/p/7606689.html 

    文本属性也是必须存在的不是吗? 否则我们如何让页面满足我们一天天增长的审美呢~

    1 缩进(text-indent)

    text-indent: 3em;       //首行缩进3em

    可以应用于所有块级元素,不能用于行内元素(内联元素),上面的值可以根据自己需要调整

    还可以为负值,实现悬挂缩进。但可能会导致超出浏览器边界,可以设置内边距或外边距防止此现象发生。 

    2 水平对齐(text-align)

    text-align: center;

    可以取值 center , left , right , justify , inherit

    其他都是十分易懂的,要提一下的是其中的 justify 可以使文本两端对齐。 

    3 垂直对齐(vertical-align)

    vertical-align: middle;

    可以取值 baseline , sub , su , top , text-top , middle , bottom , text-bottom , inherit

    应用与行内元素与表格单元。

    在说明具体作用之前,先要介绍另外一个属性 line-height ;

    line-height 在我一直以来的用法都是设置行间距,当然,这是绝对没问题的,但是并不清楚是如何实现的。

    首先,要清楚的一件事就是 行间距 = line-height - font-size;

    得到的行间距一分为二,分别放在文字上方和下方,正式成为行间距。

    接下来继续讲这些可取的值都能达到什么效果:

    • baseline : 把基线与父元素基线对齐
    • sub 、 super : 基线下移、 上移,形成上下标的样式,但大小不改变
    • bottom : 将行内框底端与行框底端对齐
    • top : 将行内框顶部与行框顶部对齐
    • middle : 中部对齐,不是十分严格的对齐
    • text-top : 将行内框顶部与父元素内容区顶部对齐
    • text-bottom : 将行内框底部与父元素内容区底部对齐

    4 字间隔 ( word-spacing ) 和字母间隔 ( letter-spacing )

    两者使用方法相同

    word-spacing: 2px;      
    letter-spacing: 2em;

    这些都是可以的,用法十分简单 

    5 文本转换 ( text-transform )

    text-transform: uppercase;      //转换为大写

    还可以取值:

    • lowercase : 转换为小写
    • capitalize : 每个单词的首字母转换为大写 

    6 文本装饰 ( text-decoration )

    • underline : 下划线;
    • overline : 上划线;
    • line-through : 贯穿线;
    • blink : 闪烁,不推荐使用,不友好
    • none : 去掉所有装饰 

    7 文本阴影 ( text-shadow )

    text-shadow: color 右偏移 下偏移 模糊半径 ( , color 右偏移 下偏移 模糊半径 ) ;

    上面括号是可选的,如果去掉括号就有两个阴影,如果想要更多阴影,重复更多次即可,逗号一定要有,吧各个阴影隔开。

    哦 还有, 模糊半径是可以不设置的,可以省去不写 

    8 空白符 (white-space)

    用于处理文本中空格、换行符和 tab 字符

    • normal : 把空白符合并成一个空格,这是默认的
    • nowrap : 不允许换行 可以用于控制表单元格内容不换行
    • pre : 不合并空白符 ,所有的都显示出来 不允许自动换行
    • pre-wrap : 不合并空白符,正常换行
    • pre-line : 合并空白符,正常换行 

    9 文本方向 ( direction )

    • ltr : 默认, left to right 从左到右
    • rtl : right to left 从右到左
    • inherit : 继承

    失望.... 看到文本方向的时候还以为是要由横向和纵向的选择呢~

    END~~~≥ω≤

  • 相关阅读:
    ASPNET下的路径辅助类
    分析函数计算起始,结束日期.
    Debugging SQL Server 2005 Stored Procedures in Visual Studio
    Storing Binary Files Directly in the Database Using ASP.NET 2.0
    Fw:Managing View State in ASP.NET 4 Using the New ViewStateMode Property
    Using ASP.NET 3.5's ListView and DataPager Controls: Displaying Data with the ListView
    Passing Information Between Content and Master Pages .
    转:Querying a Hierarchical ParentChild Structure in LINQ
    续上篇:比较彻底的清除"代理木马下载器"的方法
    面向过程和面向对象--从C到C#
  • 原文地址:https://www.cnblogs.com/veinyin/p/7606689.html
Copyright © 2020-2023  润新知