1.

1. 文本缩进
text-indent：值；
值为数字，最常用的数值单位是px(像素)，也可以直接是百分比！
text-indent:100px;
text-indent:10%;
2. 文本对齐
text-align:对其方式;
可以的值为：left、center、right
3. 文本行高
line-height:值;
line-height:23px;
line-height:120%;
默认：normal
4. 字间隔(单词)
word-spacing:10px;
默认值：normal
5. 字母间隔
letter-spacing:5px;
默认值：normal
6. 文字下划线
text-decoration:none;
值：underline 或者none 等，常用值就这两个
7. 字体
font-family:微软雅黑;
多个字体用逗号隔开
font-family:"Times New Roman",Georgia,Serif;
font-family:字体1,字体2;
8. 字体风格
font-style:值;
normal
italic
oblique
9. 字体大小
font-size:数值;
数值单位为px
10. 文本颜色
color:颜色值;
颜色值可以为一些简单的英语单词
color:red;
实际工作中用的比较多的是颜色代码
color:#111111;

11. 文本加粗
font-weight:值;
常用值：
normal
bold
12. 关于样式继承
样式的继承问题！

<html>

  <head>

    <meta name="generator"

    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />

    <meta charset="utf-8" />

    <title>css构造文本</title>

    <style type="text/css">

p{

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

line-height:50px;/*文本行高*/

word-spacing:40px;/*英文单词的间隔*/

letter-spacing:10px;/*英文字母或汉字的间隔*/

text-decoration:underline;/*文字下划线*/

}

</style>

  </head>

  <body>

    <h1>行高</h1>

    <p>hello world

    english我是一个我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段段落</p>

  </body>

</html>

<html>

  <head>

    <meta name="generator"

    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />

    <meta charset="utf-8" />

    <title>css构造文本</title>

    <style type="text/css">

p{

text-indent：50px;/*文本缩进*/

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

line-height:50px;/*文本行高*/

word-spacing:40px;/*英文单词的间隔*/

letter-spacing:10px;/*英文字母或汉字的间隔*/

text-decoration:underline;/*文字下划线*/

font-family:微软雅黑;/*字体*/

font-style:italic;/*斜体*/

font-size:30px/*字体大小*/;

color:red;/*字体颜色*/

font-weight:bold;/*字体加粗*/

}

a{text-decoration:none;

}

a:hover

{text-decoration:underline;

}/*鼠标放上去有下划线*/

body{

color:green;}/*继承*/

div p{

color:yellow;}

#div1 p {

font-style:italic;}

</style>

  </head>

  <body>

    <h1>行高</h1>

    <p>hello world

    english我是一个我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段我是一个段段落</p>

    <a href="http://www.baidu.com">百度</a>

    <div>

      <p>还上课大会上的聚会的军事登记九点上课</p>

    </div>

    <div id="div1">

      <p>还上ewehJjjjjjjjjjjjjjjj急急急急急急急急急课大会上的聚会的军事登记九点上课</p>

    </div>

  </body>

</html>

css构造文本的更多相关文章

  1. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  2. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  3. css构造块级元素

    css 1. 宽高width:数值;height:数值;也可用百分比!长高的设置不会被后代继承2. 背景(1)背景颜色background-color:颜色值;元素的背景颜色默认为transparen ...

  4. CSS控制文本超出指定宽度后用省略号代替，CSS控制文本不换行

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  5. 关于用css实现文本和图片垂直水平居中

    关于用css实现文本和图片垂直水平居中   一直相信好记性不如烂笔头,最近遇到很多用到垂直居中的,整理一下以便日后查阅. 一.文本垂直水平居中 1.水平居中: 文字水平居中没什么好说的,用text-a ...

  6. css常用文本属性

    [CSS常用文本属性] 1. 字体.字号类: ① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal, ...

  7. 24, CSS 构造超链接

    1. 超链接边框 2. 派生超链接 3. 属性选择器超链接 4. 动态超链接 5. 图像翻转超链接 6. CSS 工具提示 1.给链接加上边框 A:link { Color: #f00; Text-d ...

  8. jq选择器（jq 与 js 互相转换），jq操作css样式 / 文本内容， jq操作类名，jq操作全局属性,jq获取盒子信息,jq获取位置信息

    jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...

  9. 23 , CSS 构造列表与导航

    1. 列表图片 2. 背景列表 3. 翻转列表 4. 水平导航 1. 内边距与外边距 Ul { Margin: 0; Padding: 0; } 2. 使用图片作为列表图标 Ul { Margin: ...

随机推荐

  1. Linux/Ubuntu tree 命令以树形结构显示文件夹目录结构

    1.安装命令工具 sudo apt-get -y install tree 2.可以查看关于tree命令的帮助信息 $ tree --help usage: tree [-adfghilnpqrstu ...

  2. 安装UnityVS 2012步骤

    英文原文是: Cracked by Twisted89//////////////////////////////////////////////////// INSTALL INSTRUCTIONS ...

  3. i3D的一篇Unity教程中的笔记

    原地址:http://blog.sina.com.cn/s/blog_72b936d80100wwej.html 以下是i3D的一篇Unity教程中的笔记. i3D的这篇教程是[i3D.Next-Ge ...

  4. 用sed删除空行

    用sed删除空行 我的代码如下:class Song def initialize(name)        @name = name    end def tell        puts @nam ...

  5. Java基础算法集50题

    最近因为要准备实习,还有一个蓝桥杯的编程比赛,所以准备加强一下算法这块,然后百度了一下java基础算法,看到的都是那50套题,那就花了差不多三个晚自习的时间吧,大体看了一遍,做了其中的27道题,有一些 ...

  6. codeforces B. Making Sequences is Fun 解题报告

    题目链接:http://codeforces.com/problemset/problem/373/B 题目意思:给出w,m和k,需要找出从m开始,可以有多少个连续的数(m+1,m+2,...)(在添 ...

  7. codeforces A. Strange Addition 解题报告

    题目链接:http://codeforces.com/problemset/problem/305/A 题目意思:给出一个序列,需要从中选择一些数,这些数需要满足:任意的两个数中每一位至少有一个数满足 ...

  8. HDU1267 递推

    下沙的沙子有几粒? Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  9. vmware安装linux.iso

    安装方法 : .进入Fedora后,在虚拟机选项栏中选VM->install vmware tools 拷贝VMware Tools.tar.gz到指定文件夹,解压缩 进入超级终端:在-> ...

  10. subversion 版本库数据迁移 从一台服务器迁移到另一台新有服务器

    [root@NGINX-APACHE-SVN pro]# pwd /var/www/html/svn/pro [root@NGINX-APACHE-SVN pro]# svnadmin dump /v ...