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. [Effective JavaScript 笔记] 第5条：避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  2. linux rsync +inotify 实现 实时同步

    前言:     rsync可以实现触发式的文件同步,但是通过crontab守护进程方式进行触发,同步的数据和实际数据会有差异,而inotify可以监控文件系统的各种变化,当文件有任何变动时,就触发rs ...

  3. doTjs源码研究笔记

    首先是入口方法 /*tmpl:模板文本 c:用户自定义配置 def:定义编译时执行的数据*/doT.template = function(tmpl, c, def) { } 然后进入第一句代码 c ...

  4. Java和Python运行速度对比

    Java和Python运行速度对比:同一个函数运行一百万次,Java耗时0.577秒,Python耗时78秒--135倍的差距. 版本:Java 8,Python 2.7.10 Java测试代码: i ...

  5. fsck检查和修复文件系统

    重视:fsck不能乱用.先要把文件系统umount掉,然后检查.最好启动到单用户模式下fsck. 常见的5种损坏类型 1 未被引用的inode 2 难以置信的超大链接数 3 没有记录在磁盘块映射表中的 ...

  6. codeforces B. Petya and Staircases 解题报告

    题目链接:http://codeforces.com/problemset/problem/362/B 题目意思:给出整数n和m,表示有n级楼梯和m级dirty的楼梯,接下来m个数表示对应是哪一个数字 ...

  7. Linux/Ubuntu下解压命令

    .tar 解包:tar xvf FileName.tar 打包:tar cvf FileName.tar DirName (注:tar是打包,不是压缩!) ——————————————— .gz 解压 ...

  8. express再学习

    对比spring,django,再学习express就有很多共通的地方啦... 看的书是一本小书,<express in action>,排版比较好. 昨天开始看,看了快四分之一啦... ...

  9. 烟大 Contest1024 - 《挑战编程》第一章：入门 Problem B: Minesweeper（模拟扫雷）

    Problem B: Minesweeper Time Limit: 1 Sec  Memory Limit: 64 MBSubmit: 29  Solved: 7[Submit][Status][W ...

  10. Xamarin.Android开发实践（十六）

    Xamarin.Android之Fragment Walkthrough 利用Fragment设计能够兼容不同屏幕的应用 这里我们先围观下最后的成果图,给读者打打气: 普通手机上显示的结果: 在平板上 ...