Web前端CSS初探

  通过对css和html中div的简单设置就可以做一个非常漂亮的页面，只不过就是有点繁琐，不过只要有耐心，做一个简单的好看的页面还是可以的。

  css中最最基础的是对图片和文字的设置。页面大多都是有文字和图片组成的，对文字和图片的设置是最基本要学会的。

文字设置：

文字设置

       也许刚开始学习的时候不是特别明白为什么对文字进行设置的时候，有的时候用的是

标签，有的时候

,还有的时候是在

/div<>中设置的。

 如果是一些简单的页面，只有简单文字设置有

即可，p英文paragraph，也就是一段的意思，在阅读文字的时候经常是分段的所以用

标签更好一些。

又是也用

也就是head缩写，一般文章标题是用这个。

标记一般是在界面比较复杂又图有文字的时候，需要设置一些浮动定位的时候用div

css中常见的文字样式：

         text-decoration:underline;---------下划线

         Font-weight:bold-------粗体

        还有对font-size color的设置，值得注意的是现在的html5中对文字颜色的设置没有font-color，只有color是对应于文字颜色的设置的。

        文字居中设置：设置横向居中 text-align：center

        设置文字垂直防线居中 vertical-align:middle

         line-heignt:高度；==height必须设置高度

图片设置：

   设置背景图片：  “绝对路径”>

       图片居中： margin：0px auto；(margin:上右下左左右设为auto为居中)  

   背景图片：Background-image:url(路径)；

   如果是垂直方向（y轴方向平铺）背景图片Background-image:url(路径)；Background-repeat:repeat-y;

   水平：background-repeat:repeat-x;

   不重复：background-repeat:no-repeat;

   设置背景图片的位置：background-position:bottomright;可以设置具体数值：background-postion:300px 25px;

居中设置

一、

如果只有文字

那么设置line-height和height高度相同则是垂直方向的居中

二、

如果有图片和文字图文混排那么就要设置

Vertical-align

三：如果只有图片

Margin:10px auto 10px auto;设置上下不设置左右