1、

body{

    color:aqua;  /*可继承的颜色*/

    text-align: center; /*文本对齐方式*/

}

2、缩进：

index.html

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

     <link href="style2.css" type="text/css" rel="stylesheet">

</head>

<body>

      <div>

        <h1>静夜思</h1>

        <p>床前明月光，</p>

        <p>床前明月光。</p>

        <p>床前明月光，</p>

        <p>床前明月光。</p>

      </div>

</body>

</html>

没有缩进的效果：

加上css样式：

h6{

    text-indent: 2em;/*首行缩进2个像素*/

}

效果：

 h6{

     text-indent: -2em;/*首行退2个像素*/

     padding-left: 2em

 }

 p{

     padding-left: 2em

 }

效果：

3、大小写：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

     <link href="style2.css" type="text/css" rel="stylesheet">

</head>

<body>

      <p id="p1">this Is my web page</p>

      <p id="p2">this Is my Web page</p>

      <p id="p3">this Is my web page</p>

</body>

</html>

css：

 #p1{

     text-transform: capitalize;/*每个单词的第一个字母变为大写*/

 }

 #p2{

     text-transform: lowercase;/*所有变为小写*/

 }

 #p3{

     text-transform: uppercase;/*所有变为大写*/

 }

效果：

4、设置阴影效果：

p{

    text-shadow: 5px 5px 1px #FF0000;/*设置背景,参数分别为：距左 距上 清晰度 背景颜色*/

}

效果：

5、测试自动换行：

原来效果：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

     <link href="style2.css" type="text/css" rel="stylesheet">

</head>

<body>

      <p>测试阴影效果测试阴影效果测试阴影效果测试阴影效果测试阴影效果测试阴影效果测试阴影效果测试阴影效果</p>

</body>

</html>

加入css：

p{

    width:100px;

    text-wrap:normal;/*换行：正常,100px*/

}

效果：

css文本样式的更多相关文章

  1. 第 15 章 CSS 文本样式[下]

    学习要点: 1.文本总汇 2.文本样式 3.文本控制 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．文本总汇 本节课, ...

  2. 第 15 章 CSS 文本样式[上]

    学习要点: 1.字体总汇 2.字体设置 3.Web 字体 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．字体总汇 本节 ...

  3. css基础-css选择器和css文本样式相关

    css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...

  4. 6.css文本样式

    文本样式,只要针对的是文本的效果和文本的方位,即文本样式和文本控制总结起来有一表中的属性可用: 属性名 说明 CSS 版本 text-decoration 装饰文本出现各种划线 1 text-tran ...

  5. （3）css文本样式

    本篇学习资料主要讲解: 如何用css 的样式定义方法来介绍文字的使用. 第(1)节:用css设置文本样式.                       一.弄懂文本文字的制作.利用css的样式定义版面 ...

  6. css文本样式及控制文本的大小写

    常用文本样式如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. css文本样式text、字体样式font

    文本样式text 1.文本颜色color 例如h1 {color:red;} 2.文本方向direction,不常用 默认ltr从左到右,rtl表示从右到左 3.文本水平对齐方式text-align ...

  8. CSS 文本样式

    1. 文本样式 text <!--文本颜色color --> .text {color:red;} 2. 文本对齐方式    text-align <style> .text ...

  9. css文本样式-css学习之旅（4）

    color:颜色derction:方向:line-height:行高:letter-spaceing:字符间距:text-align:对齐方向:text-decoration:装饰:text-inde ...

随机推荐

  1. 一位学长的ACM总结（感触颇深）

    发信人: fennec (fennec), 信区: Algorithm 标 题: acm 总结 by fennec 发信站: 吉林大学牡丹园站 (Wed Dec 8 16:27:55 2004) AC ...

  2. JDBC连接Oracle数据库时出现的ORA-12505错误及解决办法

    转载至http://www.blogjava.net/itspy/archive/2007/12/20/169072.html Oracle 问题描述:今天使用jdbc连接oracle 10.2.0. ...

  3. start with connect by prior学习

    这是oracle中的树查询,查询出来的数据会根据上下级组成树的结构.select * from mw_sys.mwt_pd_deps start with obj_id = '63EBEC8E-E76 ...

  4. Intellij idea 12和设置快捷键修改（加快项目的开发速度与养成良好习惯）

    1.为了养成良好的代码习惯idead中的javascript jSLint能显示不良的代码设置如下    2.Intellij idea 12每一次修改,保存生成都要按ctrl+shift+F9非常影 ...

  5. django 学习 --- 环境搭建

    1 安装django a: pip安装 pip install Django==版本号 b:源码安装 https://www.djangoproject.com/download/ tar -xvzf ...

  6. JavaScript实现回车键切换输入框焦点

    用JavaScript实现回车键切换输入框焦点的功能,不是回车换行哦,在Textarea中,回车换行是默认功能,不过若要在textarea中使用 回车切换输入框焦点功能的话,回车换行就要失效了,不过i ...

  7. js识别终端类型

    <script type="text/javascript"> function browserRedirect() { var sUserAgent= navigat ...

  8. Nginx源码研究二：NGINX的事件处理概论

    NGINX作为服务端的应用程序,在客户端发出数据后,服务端在做着这样一些处理,数据先会经过网卡,网卡会和操作系统做交互,经过操作系统的协议栈处理,再和不同的应用程序交互. 在这里面涉及两个概念,一个是 ...

  9. Android Init语言

    Android Init语言是一种特别简单的语言,专门用来写Android的Init进程使用的配置文件的. 相当于Linux系统中的rc文件(这句话对于Linux者多半是句废话). Android I ...

  10. 关于Cococs中的CCActionEase（下）

    我们前面介绍的动作主要是用来改变内部动作的执行速度,接下来要介绍的这几个动作主要是用来增加表现效果的,可以看作是简单的特效. 10)CCEaseBackIn 1 void CCEaseBackIn:: ...