CSS据我所知好像没有能制作投影效果的属性。但是CSS 3有制作投影的属性：text-shadow是给文本添加阴影效果，box-shadow是给元素块添加周边阴影效果；

由于浏览器兼容性问题。它们使用的方式不同；如下所示：

           //Firefox4.0-  

           -moz-box-shadow:投影方式 X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色  

           //Safariand Google chrome10.0-  

           -webkit-box-shadow:投影方式 X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色  

           //Firefox4.0+、 Google chrome 10.0+ 、 Oprea10.5+ and IE9  

           box-shadow:  投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色    

}

参数介绍：

投影方式：此参数可选。如不设值，默认投影方式是外阴影；如取其唯一值“inset”，其投影为内阴影；

X轴偏移量：阴影水平偏移量，其值可以是正负值。如果值为正值，则阴影在对象的右边，其值为负值时，阴影在对象的左边；

Y轴偏移量：阴影垂直偏移量，其值也可以是正负值。如果为正值，阴影在对象的底部，其值为负值时，阴影在对象的顶部；

阴影模糊半径：此参数可选，，但其值只能是为正值，如果其值为0时，表示阴影不具有模糊效果，其值越大阴影的边缘就越模糊；

阴影扩展半径：此参数可选，其值可以是正负值，如果值为正，则整个阴影都延展扩大，反之值为负值时，则缩小；

阴影颜色：此参数可选。如不设定颜色，浏览器会取默认色，但各浏览器默认取色不一致，特别是在webkit内核下的safari和chrome浏览器下表现为透明色，在Firefox/Opera下表现为黑色（已验证），建议不要省略此参数。

同时为了兼容各主流浏览器并支持这些主流浏览器的较低版本，在基于Webkit的Chrome和Safari等浏览器上使用box-shadow属性时，我们需要将属性的名称写成-webkit-box-shadow的形式。Firefox浏览器则需要写成-moz-box-shadow的形式。

text-shadow为css文字阴影、css字体投影与字体阴影含胡效用效果的CSS属性单词。通长时间置4个值，每个值空格离隔，值离别，一个暗影色调、暗影字体左上角起靠左隔绝距离、暗影字体左上角起靠上间隔、暗影高度宽度大小。属于字体投影模式。

text-shadow是CSS格局属性单词。也是配置对象中文本的翰墨字体能否有阴影及含糊成果的CSS名堂。

最常见的字体调整

当我们需要对我们的字体类型修改时，需要指定字库。

按照给定的字库顺序依次寻找，直到找到存在的某一个字库，并且应用。如果给定的字库都在计算机的字体库中查询不到，则会使用默认字库，通常是Time New Roman，中文是宋体。

字库名称有空格时需要用引号引用，以示完整。

当我们需要的字体很大几率在客户机中不存在，则可以使用提供的网络字库，使得网页可以按照期望的样式展示。

例如

字体的兼容写法

但是常规只需要 eot 和 woff 这两种就可以了

字体颜色是最常见的修饰方式，不同的字体颜色产生不同的视觉效果

色值可以从 颜色名对照表 中查找浏览器设定好的默认值，也可以用任意的色值方案 -- 十六进制 ， rgb ， hsl 提供色值或者带有 alpha 通道的 rgba ， hsla 设置半透明字体色彩。

可以使用像素单位( px )的字体字号，也可以使用磅值（pt），但是不会使用相对尺寸，em rem，因为在换算成像素时，小数部分将会使字体模糊

通常浏览器都有最小字体，在chrome中最小字号为 12px 以保证文本内容清晰显示

区间为 100 - 900 （100的整数倍）九档，常用的，默认值 normal =400 ，bold =800

我不知道为什么style叫斜体，但是它就是这么定义的，可能是风格吧倾斜风格。

在这个属性中有两种倾斜方式

该属性是一个复合属性，包括：

虽然我们可以同时设定上划线，下划线，贯穿线，但是却没办法 单独设置他们的样式颜色 ，尽管css3标准组织已经提出了 相关解决方案，遗憾的是大多数浏览器都是不支持的。

当我们想为文字外侧再套一层颜色时，就需要使用到文字描边。

该属性也是复合属性分为 text-stroke-color 描边颜色 和 text-stroke-width 描边厚度 两部分。

目前IE 和FF (40 以下) 版本不支持，其余浏览器需要添加内核前缀。

决定文字内容(主要是西方字体) 大写（ uppercase ）还是小写（ lowercase ）还是首字母大写（ capitalize ）的方式呈现

当你的大写字母比小写字母高出很多时，使用小型大写字母，将小写的内容转为大写字母来替代原有的大写字母内容。【仅针对小写字母】

这个元素将以内容文本为蓝本，从当前文本的下方产生文字投影。

这个属性一共有四个属性值，分别是

投影其实就是灯光照射到物体上产生的阴影，当不同角度的灯光照射进来时，产生了不同程度的投影。因此投影也是可以有多个的

这个属性其作用目的是修改内联块的排列方向，仅针对内联块（ inline-block ），默认是 ltr ( LEFT-TO-RIGHT )、 rtl (RIGHT-TO-LEFT)

看下面的效果

很神奇的发现，内联块1，2的显示顺序调换了，这是因为该属性修改的是内联块的展示方向，会依次从右向左排列，但是另一部分，三个内联元素排列顺序没有变化，是对的，但是没搞懂，为什么最后一个文本内容末尾的符号会被提升到前面去，不应该跟随在文字后面么 这不知道是一个 “BUG” 还是别出心裁的设计。

但是我们想象一下民国时期，从右向左书写方式，这时候需要用到文本的写作方向来调整了

这个属性需要配合上面的direction一起使用才可以生效

在现代计算机应用中，最常用来处理双向文字的算法是Unicode 双向算法（Unicode Bidirectional Algorithm），简称为 bidi 算法。而unicode字符本身分为强字符、中性字符、弱字符

Web中控制文字方向的方式有三种：

具体关于 字符方向的， 这里有解答

但是还是不理解上述所说的，末尾符号问题。

当设置为垂直书写方式时，块元素的宽度将会以content的宽度为准，如果需要设置宽度则需要显示的给出。该属性可被继承

很多时候，我们需要保留文内空白符，通常比较傻的情况就是用 这个html语义字符替代，其实css本身就提供了我们对空白符的处理，何必傻兮兮的去替换。

pre 预先使用等宽字体显示格式化文本，不合并空白，文字超出边界时不换行

pre-wrap 不合并空白，和边界发生碰撞时折行

pre-line 保持文本换行，但是不保留空白，边界碰撞时换行

nowrap 不换行，不保留空白，直到文本结束或者遇到 <br/>

当我们开启了空白符时，这是可以设定tab-size的尺寸，在一般的编辑器中，一个tab等于4个space，默认也是如此，因此当我们调整tab与space互转时，就可以用到了。

对于英文等拉丁文，有时长单词会超出边界。这是因为单词被视为整体，不允许折行。这时候就会产生比较大的问题--布局撑破。尽管很少情况下会遇到，这时，我们使用 break-all 强制换行，即使单词是整体，也会被折行显示，满足布局需要。

对于中文，如果不想换行可以使用 keep-all ，就表现的和英文单词一致，是不会折行的。

IE下定入标准是word-wrap，被W3C组织收编之后修改为overflow-wrap，本质还是不变的。

设定超过边界时换行，以获得更好的展示效果。中英文混排时，会从中英文边界换行。

比较常用的文本对齐是 left right center，css3中新增justify两端对齐。但是justify不会处理最后一行和第一行。（单独一行是第一行也是最后一行）

新增的start和end 对齐方式依赖于direction设定的方向，即文档的开始方向。start表示向文档开始方向对齐，因此direction:rtl时，表现与left right表现相反。

而match-parent 匹配父级，当匹配父级的start或者end时，基于父级的direction计算得到结果，而inherit则没有限定。

justify-all，同时处理行和行尾的两端对齐，但是并未得到支持。因此还是使用下面的方式最为稳妥。

当设定了文本的两端对齐后，需要对两端对齐方式进行设定，然而目前并没有浏览器支持。所以先放弃

说白话就是一个空格有多宽。

就是字母跟字母间的间隔，当然中文也可以

设定段首缩进像素，然而这个属性只针对块元素和行内块。毕竟内联元素的自己也做不了主。

*## 行高 line-height

行高，即字体最底端与字体内部顶端之间的距离

垂直对齐就是基于行高和基准线的对齐方式。有baseline 基准线 sub 上标 super 下标

top 元素顶端与行内元素 最高 的 顶端 对齐

bottom 元素的顶端与行中 最低 的元素的 顶端 对齐

middle 把此元素放置在父元素的中部

text-top 把元素的顶端与父元素字体的顶端对齐

text-bottom 把元素的底端与父元素字体的底端对齐