html5中的空格符
html5中的空格符
1,Html中空格
| | 不断行的空白(1个字符宽度) | |
|   | 半个空白(1个字符宽度) | |
|   | 一个空白(2个字符宽度) | |
|   | 窄空白(小于1个字符宽度) |
2,Css 的方式空格
CSS中当 white-space 属性取值为pre时,浏览器会保留文本中的空格和换行,例如:
<div style="white-space:pre">AA BB<div>
显示效果为: AA BB
CSS的 letter-spacing 属性用于设置文本中字符之间的间隔,例如:
<div style="letter-spacing:5px;">欢迎光临!</div>
显示效果为: 欢 迎 光 临 !
CSS的 word-spacing 属性用于设置文本中单词之间的间隔,例如:
<div style="word-spacing:5px">Happy new year!</div>
显示效果为: Happy new year!
3 , Html 中常用的字符
| & | < | > | " | &qpos; | © | ® | ™ |
| & | < | > | " | ' | © | ® | ™ |
| & | < | > | " | ' | © | ® | ™ |
4、几种空格符比较
HTML提供了5种空格实体(space entity),它们拥有不同的宽度,非断行空格( )是常规空格的宽度,可运行于所有主流浏览器。其他几种空格( )在不同浏览器中宽度各异。
它叫不换行空格,全称No-Break Space,它是最常见和我们使用最多的空格,大多数的人可能只接触了 ,它是按下space键产生的空格。在HTML中,如果你用空格键产生此空格,空格是不会累加的(只算1个)。要使用html实体表示才可累加,
该空格占据宽度受字体影响明显而强烈。
 
它叫“半角空格”,全称是En Space,en是字体排印学的计量单位,为em宽度的一半。根据定义,它等同于字体度的一半(如16px字体中就是8px)。名义上是小写字母n的宽度。此空格传承空格家族一贯的特性:透明的,此空格有个相当稳健的特性,
就是其占据的宽度正好是1/2个中文宽度,而且基本上不受字体影响。
 
它叫“全角空格”,全称是Em Space,em是字体排印学的计量单位,相当于当前指定的点数。例如,1 em在16px的字体中就是16px。此空格也传承空格家族一贯的特性:透明的,此空格也有个相当稳健的特性,
就是其占据的宽度正好是1个中文宽度,而且基本上不受字体影响。
 
它叫窄空格,全称是Thin Space。我们不妨称之为“瘦弱空格”,就是该空格长得比较瘦弱,身体单薄,占据的宽度比较小。它是em之六分之一宽。
html5中的空格符的更多相关文章
- html5中canvas的使用 获取鼠标点击页面上某点的RGB
1.html5中的canvas在IE9中可以跑起来.在IE8则跑不起来,这时候就需要一些东西了. 我推荐这种方法,这样显得代码不乱. <!--[if lt IE9]> <script ...
- html5中新增的form表单属性
html5中新增两个表单属性,分别autocomplete和novalidate属性 1.autocomplete属性 该属性用于控制自动完成功能的开启和关闭.可以设置表单或者input元素,有两个属 ...
- HTML5 中的 canvas 画布(一)
---恢复内容开始--- 在HTML5中新添加的元素,canvas 现在支持 IE9+的版本 注意:HTML5 <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript ...
- HTML5中引入的关键特性
新特性 描述 accesskey 定义通过键盘访问元素的快捷键 contenteditable 该特性设置为true时,浏览器应该允许用户编辑元素的内容.不指定变化后的内容如何保存 contextme ...
- HTML5中与页面显示相关的API
1.HTML5中与页面显示相关的API 在HTML5中,增加了几个与页面显示相关的API,其中一个是Page Visibility API Page Visibility API 是指当页面变为最小 ...
- HTML5 中的新属性autocomplete="off"失效的解决方法(兼容firefox,IE,360)
因为业务需求,在写一个注册页面的时候,发现浏览器会自动填充此域名下已经保存的账号密码,给用户带来不便.加了HTML5 中的新属性autocomplete="off" ,但是并没有产 ...
- HTML5中新添加事件
HTML5中新添加了很多事件,但是由于他们的兼容问题不是很理想,应用实战性不是太强,所以在这里基本省略,咱们只分享应用广泛兼容不错的事件,日后随着兼容情况提升以后再陆续添加分享.今天为大家介绍的事件主 ...
- HTML5中id可以用数字开头,但在css中不能正常使用
昨晚在看<响应式Web设计:html5和css3实战>时,书中提到“HTML5中的ID指可以用数字开头”.这个还真不知道,于是测试了一下,发现了问题. 在H5描述中是这样说的: 在css样 ...
- HTML5中的sessionStorage和localStorage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只 ...
随机推荐
- Android--ViewPager-Fragment
package com.cnn.viewpager02; import java.util.ArrayList; import java.util.List; import android.os.Bu ...
- 洛谷P3332 [ZJOI2013]K大数查询 权值线段树套区间线段树_标记永久化
Code: #include <cstdio> #include <algorithm> #include <string> #include <cstrin ...
- js001 ---- async
Node.js异步流,详细见https://caolan.github.io/async/docs.html#parallel 1, async 用的比较多的是 waterfall, 瀑布流, 就是每 ...
- 洛谷2863 [Usaco06JAN]牛的舞会
题目描述 约翰的N (2 <= N <= 10,000)只奶牛非常兴奋,因为这是舞会之夜!她们穿上礼服和新鞋子,别 上鲜花,她们要表演圆舞. 只有奶牛才能表演这种圆舞.圆舞需要一些绳索和一 ...
- malloc()和free()的原理及实现
在C语言中只能通过malloc()和其派生的函数进行动态的申请内存,而实现的根本是通过系统调用实现的(在linux下是通过sbrk()系统调用实现). malloc()到底从哪里得到了内存空间?答案是 ...
- POJ1158 城市交通Traffic lights IOI 1999 (最短路)
POJ1158 城市交通Traffic lights IOI 1999 (最短路) (1) 问题描述(probolem) 在d城里交通的安排不同寻常,城中有路口和路口之间的道路,再任意两个不同的路口之 ...
- 简单记录一次REDO文件损坏报错 ORA-00333重做日志读取块出错
一.故障描写叙述 首先是实例恢复须要用到的REDO文件损坏 二.解决方法 1.对于非当前REDO或者当前REDO可是无活动事务使用下面CLEAR命令: 用CLEAR命令重建该日志文件SQL>al ...
- Vue进阶之表单控件绑定
1.单行input <html> <head> <meta charset="UTF-8"> <meta name="viewp ...
- 正则表达式 Tricks
*:0 或 多个 ?:任意一个 [list]:a[xyz]b,a 与 b 之间必须也只能有一个字符,但只能是 x/y/z,也即:axb, ayb, azb [!list]:匹配除 list 中的任意单 ...
- Magento--判断checkout中是否使用了coupon code
在checkout页面中,如果想判断顾客是否有使用coupon code,可以通过checkout session来进行判断.以下代码会返回checkout中使用的coupon code或者返回空(当 ...