CSS-文字效果

1.1、自定义字体:

 
  
  
  
  
  
  
  
 
 
  

  这段文字使用的是徐静蕾字体。
  
  

这段文字使用的是默认字体。
 

1.2、段落首字符下沉、缩进及特殊显示

  
  


  

    段落首字符下沉和15像素的缩进
  
  

    if -首字符不下沉、首字符英文小写和悬挂缩进（-6像素）
  
  

    if 段落的首字符不下沉、首字母英文大写
  

1.3、自定义文本选中样式

  
  
 
 
  自定义文本选中样式演示网页
 

1.4、文本对齐

  
  
 
 
  
这是标题 1
  
这是标题 2
  
这是标题 3
 

1.5、间隔与间距实例

   
   
 
 
   
控 制 空 格 的 长 度
   
控制相邻两个字的间距
   
使用百分比控制行间距
   
使用像素值控制行间距
   
使用数值（如1.2）控制行间距
   
空白符的默认处理，浏览器会忽略连续的多个空白符									为1个
   
空白符的pre处理，浏览器会保留      多个空白符，与pre标签相似
   
空白符的nowarp处理，浏览器会忽略
     回车符直到遇到br
br之后的内容
   
保留多个    空白符，保留
       回车符
   
忽略多个    空白符，保留
         回车符
 

1.6、文本装饰

   
   
 
 
   
文本装饰
   
文本装饰
   
文本装饰
   
文本装饰blink浏览器不支持
   
粗体字
   
italic斜体
   
oblique倾斜
   斜体（italic）是一种简单的字体风格，对每个字母的结构有一些小改动，来反映变化的外观。
   倾斜（oblique）文本则是正常竖直文本的一个倾斜版本。
   通常情况下，两种效果在浏览器中看上去完全一样。
 

1.7、文字阴影

  
  
 
 
  
文字的阴影效果
  
试着把鼠标移动到文字上！
 

1.8、文字毛玻璃效果

   
   
 
 
   

     本实例演示毛玻璃效果。
   
 

1.9、文字溢出隐藏与超长标题自动省略号

   
   
 
 
   
如果此处的文字较多，将自动裁切裁切裁切裁切
   

   
如果此处的文字较多，将自动用省略号代替！
   

  
如果此处的文字较多，将自动隐藏！如果此处的文字较多，将自动隐藏！如果此处的文字较多，将自动隐藏！如果此处的文字 较多，将自动隐藏！如果此处的文字较多，将自动隐藏！
   

   
如果此处的文字较多，将出现滚动条！如果此处的文字较多，将出现滚动条！如果此处的文字较多，将出现滚动条！
 

1.10、金属质感文字

   
   
 
 
   

    
   金属质感文字
   
 

1.11、隐藏文本

   
   
 
 
   
百度
   
     
    百度一下，你就知道
   
 

1.12、旋转文字

   
   
 
 
   
这是一段旋转过的文字