css文本样式
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文本样式的更多相关文章
- 第 15 章 CSS 文本样式[下]
学习要点: 1.文本总汇 2.文本样式 3.文本控制 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一.文本总汇 本节课, ...
- 第 15 章 CSS 文本样式[上]
学习要点: 1.字体总汇 2.字体设置 3.Web 字体 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一.字体总汇 本节 ...
- css基础-css选择器和css文本样式相关
css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...
- 6.css文本样式
文本样式,只要针对的是文本的效果和文本的方位,即文本样式和文本控制总结起来有一表中的属性可用: 属性名 说明 CSS 版本 text-decoration 装饰文本出现各种划线 1 text-tran ...
- (3)css文本样式
本篇学习资料主要讲解: 如何用css 的样式定义方法来介绍文字的使用. 第(1)节:用css设置文本样式. 一.弄懂文本文字的制作.利用css的样式定义版面 ...
- css文本样式及控制文本的大小写
常用文本样式如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- css文本样式text、字体样式font
文本样式text 1.文本颜色color 例如h1 {color:red;} 2.文本方向direction,不常用 默认ltr从左到右,rtl表示从右到左 3.文本水平对齐方式text-align ...
- CSS 文本样式
1. 文本样式 text <!--文本颜色color --> .text {color:red;} 2. 文本对齐方式 text-align <style> .text ...
- css文本样式-css学习之旅(4)
color:颜色derction:方向:line-height:行高:letter-spaceing:字符间距:text-align:对齐方向:text-decoration:装饰:text-inde ...
随机推荐
- JNI 详细使用步骤 上手示例
1.定义本地native方法 定义本地方法,通常情况下,应单独定义一个类来封装所有native方法 /** 存放native方法的类 */ public class MyNativeMethods { ...
- java04 Sacnner的使用
import java.util.Scanner; /** * 所有在java.lang包下面的所有类 不需要显示的引入包! * java.util.Scanner : 想获取用户的输入 必须引入相关 ...
- (转)asp.net中Literal与label的区别
asp.net中Literal与label的区别 一.Literal Web 服务器控件概述(摘于MSDN) 可以使用 Literal Web 服务器控件作为页面上其他内容的容器.Literal 最常 ...
- linux性能分析命令top
发布时间: 2013-12-14浏览次数:154分类: 服务器 top是linux最常用的性能分析工具了,它是个交互式工具,提供系统的整体性能,如正在执行的进程信息包括进程ID,内存占用率,CPU占用 ...
- Objective-C学习篇07—NSArray与NSMutableArray
大纲 NSArray NSMutableArray 快速枚举 NSArray NSArray是一个静态数组,也就是一个不可变数组,一旦创建以后,就不能进行添加,删除或者修改其中的元素.NSArray继 ...
- zepto源码研究 - zepto.js (zepto.init)
简要:当我们用$()时,便会直接调用zepto.init 生成zepto对象,那zepto.init是如何根据不同类型的参数来生产指定对象呢? zepto.init = function(select ...
- 测试RegExp对象的属性
//测试RegExp对象的属性function testRegExpProperty(){ var regexp = /abc/; //regexp.ignoreCase = true; //无效 c ...
- Centos 6.5 搭建php环境(nginx+mariadb+php7)
1.mariaDb vim /etc/yum.repos.d/MariaDB.repo [mariadb] name = MariaDB baseurl = http://yum.mariadb.or ...
- JSP网页防止sql注入攻击
SQL注入攻击指的是通过构建特殊的输入作为参数传入Web应用程序,而这些输入大都是SQL语法里的一些组合,通过执行SQL语句进而执行攻击者所要的操作,其主要原因是程序没有细致地过滤用户输入的数据,致使 ...
- HAPROXY 配置项/配置实例
HAPROXY 配置项/实例 常用配置选项: OPTION 选项: option httpclose :HAProxy会针对客户端的第一条请求的返回添加cookie并返回给客户端,客户端发送后续请求时 ...