<!doctype html>

<html lang="en">

 <head>

  <meta charset="UTF-8">

  <meta name="Generator" content="EditPlus®">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

  <title>间隔与间距实例</title>

  <style type="text/css">

  p.wordspacing{word-spacing:20px;}

/*  设置空格的长度*/

  p.letterspacing{letter-spacing:20px;}

/*  设置字间距*/

  p.lineheight{line-height:0.3;}

/*  设置行间距*/

  p.whitespace_normal{white-space:normal;}

/*  默认，忽略多个空格为1个，忽略回车符*/

  p.whitespace_pre{white-space:pre;}

/*  保留多个空格*/

  p.whitespace_nowrap{white-space:nowrap;}

/*  忽略回车符，禁止换行，直到遇到br*/

  p.whitespace_prewrap{white-space:pre-wrap;}

/*  保留所有空格符与回车符*/

  p.whitespace_preline{white-space:pre-line;}

/*  忽略多个空格为1个，保留回车*/

  </style>

 </head>

 <body>

  <p class="wordspacing">控 制 空 格 的 长 度</p>

  <p class="letterspacing">控制相邻两个字的间距</p>

  <p class="lineheight">使用百分比控制行间距</p>

  <p class="lineheight">使用像素值控制行间距</p>

  <p class="lineheight">使用数值（如1.2）控制行间距</p>

  <p class="whitespace_normal">空白符的默认处理，浏览器会忽略连续的多个空白符									为1个</p>

  <p class="whitespace_pre">空白符的pre处理，浏览器会保留      多个空白符，与pre标签相似</p>

  <p class="whitespace_nowrap">空白符的nowarp处理，浏览器会忽略

回车符直到遇到br<br />br之后的内容</p>

  <p class="whitespace_prewrap">保留多个    空白符，保留

回车符</p>

 <p class="whitespace_preline">忽略多个    空白符，保留

回车符</p>

 </body>

</html>

　　

css系列-间隔与间距实例的更多相关文章

  1. 深入理解脚本化CSS系列第六篇——脚本化伪元素的6种方法

    × 目录 [1]动态样式 [2]CSS类[3]setAttribute()[4]CSSRule对象添加[5]空样式覆盖[6]CSSRule对象删除 前面的话 我们可以通过计算样式来读取伪元素的样式信息 ...

  2. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理

    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    ( ...

  3. css系列教程1-选择器全解

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css系列教程1-选择器全解 css系列教程2-样式操作全解 css选择器全解: css选择器包括:基本选择器.属性选择器.伪类选择器.伪元 ...

  4. css 伪类选择器:checked实例讲解

    css :checked伪类选择器介绍 css :checked伪类选择器用于选择匹配所有被选中的单选按钮(radio)或复选框(checkbox),你可以结合:checked伪类选择器和:not选择 ...

  5. Java JUC之Atomic系列12大类实例讲解和原理分解

    Java JUC之Atomic系列12大类实例讲解和原理分解 2013-02-21      0个评论       作者:xieyuooo 收藏    我要投稿 在java6以后我们不但接触到了Loc ...

  6. mycat数据库集群系列之数据库多实例安装

    mycat数据库集群系列之数据库多实例安装 最近在梳理数据库集群的相关操作,现在花点时间整理一下关于mysql数据库集群的操作总结,恰好你又在看这一块,供一份参考.本次系列终结大概包括以下内容:多数据 ...

  7. CSS系列 (05)：浮动详解

    浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止.由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样. -- W3C 文字环绕 float可以 ...

  8. CSS系列——浏览器默认样式

    了解HTML标签在各浏览器当中的默认样式,可以让我们了解,为什么会要写Reset.css,Reset.css当中要怎么写样式最合理.试着思考下面的问题: 为什么会有默认样式? 每个浏览器的默认样式有什 ...

  9. css sprite讲解与使用实例

    转自:http://www.manongjc.com/article/886.html 一.什么是css sprites css sprites直译过来就是CSS精灵.通常被解释为“CSS图像拼合”或 ...

随机推荐

  1. Nunit单元测试的使用

    先建立一个需要测试的项目 安装nunit 通过nuget安装Install-Package Nunit  类前加[TestFixture] 要测试的方法前加[Test] using System; u ...

  2. ThinkPHP目录结构

    ThinkPHP框架目录结构 文件路径 文件描述 \index.php 入口文件 \Application 应用目录 \Public 资源文件目录 \ThinkPHP 框架核心目录   \Applic ...

  3. [转]UDP/TCP穿越NAT的P2P通信方法研究(UDP/TCP打洞 Hole Punching)

     [转]UDP/TCP穿越NAT的P2P通信方法研究(UDP/TCP打洞 Hole Punching) http://www.360doc.com/content/12/0428/17/6187784 ...

  4. Entity Framework学习笔记(三)----CRUD(2)

    请注明转载地址:http://www.cnblogs.com/arhat 昨天晚上老魏配的机器终于到了,可是拿回来之后什么都组装好了,唯独差一个非常重要的组件"电源线",老魏那个汗 ...

  5. copy-mutableCopy

    copy和mutableCopy语法的目的:改变副本的时候,不会影响到源对象:调用Copy产生的对象是不可变的,调用mutableCopy产生的对象是可变的,与调用对象是否可变无关. Copy 需要先 ...

  6. RHEL6.4找回root密码的方法

    1.先在系统启动的时候提示:press any key to enter menu 时按下e键(其实其他键也可以,只不过我习惯e键而已) 2.进入如下界面: 3.按上下箭头方向键选中第二项,按e键,进 ...

  7. liferay MVCActionCommand的用法及例子

    在liferay7中把portlet中的控制层拆成了3个部分: 1.MVCActionCommand 2.MVCRenderCommand 3.MVCRecourceCommand 至于为什么要拆出来 ...

  8. php中curl的详细解说（转载）

    本文转自:http://blog.csdn.net/yanhui_wei/article/details/21530811 这几天在帮一些同学处理问题的时候,突然发现这些同学是使用file_get_c ...

  9. Careercup - Google面试题 - 5692127791022080

    2014-05-08 22:09 题目链接 原题: Implement a class to create timer object in OOP 题目:用OOP思想设计一个计时器类. 解法:我根据自 ...

  10. web项目自动化测试方案预研

    一.  网上方案整理 Watir.Watir-Webdriver.Selenium2.QTP区别 Waitr与Watir-WebDriver有什么区别? Watir是非常优秀的一款自动化测试工具.其使 ...