zoukankan      html  css  js  c++  java
  • 文本格式化

    文本格式化

       1、控制字体

          1、指定字体

             font-family:"microsoft yahei",arial,"宋体";

          2、字体大小

             font-size: px , pt 作为单位  30pt  16pt

       常用字体大小:12px - 14px

          3、字体加粗

             相当于 <b></b>

       font-weight : normal / bold ;

       建议:通过 该属性取代 b 标签

          4、字体样式

             斜体

       font-style:normal / italic;

       相当于<i></i>

     5、小型大写字母

             font-variant : normal / small-caps;

          6、字体属性 font

             将所有的属性设置在一个声明当中

       font:font-style font-varaint font-weight font-size font-family;

       eg:font:italic small-caps bold 12px "microsoft yahei",arial;

       常用写法:

      font :font-size  font-family;

      font:bold 12px "microsoft yahei";

       其他写法:

              font : font-size/line-height font-family;

      font:12px/24px "microsoft yahei";

          line-height : 行高

     2、文本属性

           1、颜色

              color : 颜色值 ;

                rgba(255,0,0,0.5);

           2、文本排列

              text-align:left/right/center; 元素中的内容水平对齐方式,大部分主流浏览器,只对行内元素起作用,对块不起作用

        vertical-align:top / bottom / middle / baseline; 文本内容垂直对齐方式

            baseline : 基线对齐

           3、文字修饰(线条)

              text-decoration:none / underline

           none : 去除文本上的线条

           underline : 下划线

           overline : 上划线

           linethrough : 删除线  <s></s>

    4、行高

              每行文本所占据的高度。如果行高的值高于文本的高度,那么这段文本会在行高范围内垂直居中显示。

        使用方式:

            1、将行高与容器高度设置为一致,从而使容器内的文本垂直居中显示。(只针对一行数据)

            2、如果想给文本增加上下的边距,也可以使用line-height

           5、首行文本缩进

              让元素内的首行文本,空出指定的像素值

        text-indent:value;

           6、文本阴影

              text-shadow:h-shadow v-shadow blur color;

              常用例子:text-shadow: 5px 5px 5px #FF0000;

  • 相关阅读:
    如何用Vault下载.Text 096的源代码
    新增QQ表情
    TortoiseCVS比WinCVS好用多了
    上周热点回顾(5.276.2)
    Couchbase的bug引起的缓存服务器CPU占用高
    云计算之路阿里云上:Linux内核bug引起的“黑色10秒钟”
    上周热点回顾(5.205.26)
    云计算之路阿里云上:拔云见日的那一刻,热泪盈眶
    云计算之路试用Azure:遭遇第一次故障
    上周热点回顾(5.135.19)
  • 原文地址:https://www.cnblogs.com/cheerping/p/7499933.html
Copyright © 2011-2022 走看看