CSS3文本与文字

CSS3文本与文字

  • text-shadow属性
  • word-shadow属性
  • font-face规则

text-shadow属性

  1. 参数:水平偏移,垂直偏移,阴影大小,颜色;
    文字描边的时候偏移量设置为0,浮雕效果设置文字颜色和背景颜色。

Web design

h1
{ text-shadow:2px 2px 8px blue; }

在这里插入图片描述

word-wrap属性

  1. 允许长单词,URL强制进行换行,避免超出边框。
  2. 具体代码:
    CSS3文本与文字_第1张图片

font-face规则

  1. CSS3之前,特殊字体需要客户端安装这种字体,或者以图片形式打开这种字体。
  2. CSS3,Web字体,把特殊的字体放在服务器上,需要时下载使用。
  3. 利用font-face规则,在浏览器中打开。CSS3文本与文字_第2张图片
  4. 先下载字体,只有.ttf格式,然后再生成其他格式,生成的网站,字体转换工具.
@font-face{
    	font-family: kastlerFont;/*定义字体名字*/
    	src:url('fonts/kastler.ttf'),
    	    url('fonts/kastler.eot'),
    	    url('fonts/kastler.woff'),
    	    url('fonts/kastler.svg');/*定义字体来源*/
    }
    h1{
    	font-family: kastlerFont;/*字体引用*/
    }

你可能感兴趣的:(CSS3,css3)