HTML和CSS的相同效果之处

文字样式

   1、字体样式

         HTML：

 

         CSS：

<style type="text/css">
      		#p{font-style:normal | italic | oblique }//字体样式
      		#p{font-size:20px;}//字体大小
      		#p{font-variant:normal | small-caps}//字体变体
      		#p{font-weight:normal | bold | lighter | 数值}//字体粗细
      		#p{font-family:字体1，字体2，...}//字体系列
</style>

2、首行缩进

         HTML：

               <p>&nbsp;&nbsp;&nbsp;&nbsp;</p>

          CSS:

<style type="text/css">
#p{text-indent:2em;}
</style>

3、字符装饰

        HTML:（第一点的图片中提到了...）

        CSS：

<style type="text/css">
#p{text-decoration:none | underline | blink | overline | line-through;}
</style>

         none：表示文字无装饰

         blink：表示文字闪烁

         underline：表示文字加下划线

         line-through：表示文字加贯穿线

         overline：表示文字加上划线

4、英文大小写转换

HTML:（第一点的图片中提到了...）

CSS：

<style type="text/css">
#p{text-transform:capitalize | uppercase | lowercase | none}
</style>

5、对齐方式

        HTML：（内容居中）

<center>内容</center>

        CSS：

<style type="text/css">
#p{text-align:left | right | center | justify}//水平对齐
#p{vertical-align:baseline | sub | super | top | middle | bottom | text-bottom | length}//垂直对齐
</style>

        baseline：默认，元素放置在父元素上的基线上
        sub：垂直对齐文本的下标
        super：垂直对齐文本的上标
        top：把元素的顶端与行中最高元素的顶端对齐
        middle：把此元素放置在父元素的中部
        bottom：把元素的顶端与行中最低元素的顶端对齐
        text-bottom：把元素的低端与父元素字体的底端对齐
        length：指定长度值