Html中各种空格的显示
一、使用全角空格
全角空格被解释为汉字,所以不会被被解释为HTML分隔符,可以按照实际的空格数显示。
二、使用空格的替代符号
替代符号就是在需要显示空格的地方加入替代符号,这些符号会被浏览器解释为空格显示。
空格的替代符号有以下几种:
名称编号描述 不断行的空白(1个字符宽度)  半个空白(1个字符宽度)  一个空白(2个字符宽度)  窄空白(小于1个字符宽度)
可以用名称或编号作为空格的替代符号,名称必须小写,末尾的“;”不能省略。
如:
显示效果为:欢 迎 光 临!
三、使用CSS的 white-space 属性
CSS的white-space属性用于设置文本中空格的处理方式,当white-space属性取值为pre时,浏览器会保留文本中的空格和换行,这样你就可以直接在文本中使用空格和回车了。
这种方法特别适合于在网页中显示程序代码。比如:显示一段C程序代码。
显示效果为:
使用HTML的<pre>标签也可以达到类似的效果,但<pre>标签有一些不太好的特性,不如使用CSS的white-space属性更方便。
四、使用CSS的 letter-spacing 属性
CSS的letter-spacing属性用于设置文本中字符之间的间隔,它的取值可以是一个带单位的长度值,浏览器会在字和字之间设置指定长度的空白。比如:
显示效果为:
注意,如果文本中有英文单词,则空白会加在字母之间,而不是单词之间。
五、使用CSS的 word-spacing 属性
CSS的word-spacing属性用于设置文本中单词之间的间隔,它的取值可以是一个带单位的长度值,浏览器会在单词和单词之间设置指定长度的空白。比如:
显示效果为:
注意,HTML是以空格来区分单词的,它会把单词间的空白按指定长度显示。
六、使用CSS的 text-indent 属性
CSS的text-indent属性用于设置首行缩进,它的取值可以是一个带单位的长度值,浏览器会在段落的首行开始处设置指定长度的空白。比如:
显示效果为:
说明:em 是一个相对长度单位,2em 表示要缩进两个字的距离。
Html中各种空格的显示的更多相关文章
- eclipse中show whitespace characters显示代码空格,TAB,回车 导致代码乱恶心
Eclipse中show whitespace characters显示回车.空格符. 取消此功能的第二种方式:
- 使用innerHTML获取HTML代码时,HTML标记属性的双引号好多都消失不见了,原来是属性值中包含空格才会保留双引号
最近搞的一个项目中所使用的方式比较奇怪,用Label显示HTML内容,然后不断地使用JS把Label的innerHTML复制到TextBox中. 但是,昨天发现了一个问题,获取元素值的时候,有时候正常 ...
- URL中的空格
如果URL中带空格,在浏览器中可以显示,但是如果访问比如 UIImage 获取图片的时候就会出现BAD URL. 解决: NSString* urlText = @"70.84.58.40/ ...
- [HTML]在页面中输出空格的几种方式
JS中如何输出空格 在写JS代码的时候,大家可以会发现这样现象: document.write(" 1 2 3 "); 结果: 1 2 ...
- HTML代码中的空格和空行
HTML 代码中的所有连续的空格或空行(换行)都会被显示为一个空格. 例子1:(文本内容中的连续空格) 代码 <p>这段文本中,输入连续的空格 大概输入了十个.</p> 显示效 ...
- Linux - Shell - 替换文件名中的空格
概述 使用 shell 替换 文件名中的空格 背景 尝试用 find 配合 xargs, 在多个文件里找关键字 出现了问题 有空格的文件名, 并不是很好处理 准备 os centos7 1. 问题: ...
- String 中去掉空格
JAVA中去掉空格 1. String.trim() trim()是去掉首尾空格 2.str.replace(" ", ""); 去掉所有空格,包括首尾.中间 ...
- win7系统中如何使文件显示出扩展名
win7系统中如何使文件显示出扩展名-------------------- 1.点击计算机-->>点击组织,然后选择"文件夹及搜索选项"-->> ---- ...
- JAVA中去掉空格经典整理
JAVA中去掉空格经典整理 JAVA中去掉空格 1. String.trim() --------------trim()是去掉首尾空格 2.str.replac ...
随机推荐
- 分析setting源代码获取sd卡大小
分析setting源代码获取sd卡大小 android系统有一个特点,即开源,我们可以得到任何一个应用的源代码,比如我们不知道这样的android代码怎么写,我们可以打开模拟器里面的设置(settin ...
- Oracle数据库的备份方法
1.引言 Oracle数据库的备份方法很多,无论使用那种备份方法,备份的目的都是为了在出现故障后能够以尽可能小的时间和代价恢复系统.比如使用export实用程序导出数据库对象.使用Oracle备份数据 ...
- JavaWeb学习笔记——第一个JSP文件
必须加上第一句以用来指定编码,否则会出现乱码 <%@ page language="java" import="java.util.*" contentT ...
- 跟我一起玩转Sencha Touch 移动 WebApp 开发(一)
1.目录 移动框架简介,为什么选择Sencha Touch? 环境搭建 创建项目框架,框架文件简介 创建简单Tabpanel案例 自定义图标的方式 WebApp产品测试和发布 HTML5离线缓存 发布 ...
- web前端工程师校园招聘要求
小燕子对紫薇说:“这辈子也别想着进皇宫了”.可后来她们不但进了宫,还都当上了格格.你在想什么?走呗! 1.去哪了网 前端开发工程师 工作地点:北京 工作职责: 负责去哪儿网各产品线Web前端研发: 负 ...
- ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2)--MySQL错误
MySQL错误整理: 错误一: ERROR (HY000): Can't connect to local MySQL server through socket '/var/lib/mysql/my ...
- PHP file_get_contents设置超时处理方法
从PHP5开始,file_get_content已经支持context了(手册上写着:5.0.0 Added the context support. ),也就是说,从5.0开始,file_get_c ...
- mysql Table 'performance_schema.session_variables' doesn't exist
CMD 进入MYSQL的安装目录..Bin 下 执行 mysql_upgrade -u root -p --force 输入密码..然后等待一会儿..会跑一些东西..然后重启服务
- dubbo 教程
阿里巴巴dubbo主页:http://code.alibabatech.com/wiki/display/dubbo/Home-zh 1. Dubbo是什么? Dubbo是一个分布式服务框架,致力于提 ...
- jQuery 学习之路(4):事件
一.文档载入事件 二.事件绑定 三.事件对象 四.浏览器事件 五.表单事件 六.键盘事件 七.鼠标事件