css常用属性总结:关于word-spacing和letter-spacing的使用
前端时间项目版本迭代,修改代码时发现使用了关于word-spacing和letter-spacing。先说下使用场景,以前的项目中,经常遇到某些字符间有一些间距,我看了一些同事的代码是这么实现的:
<p>操 作</p>
如果之间比一个空格距离要宽的话,就多加几个 ,这个方法虽然可行,总觉得是太暴力了,于是自己使用了css来实现该效果,但是中间也遇到一些以前没注意问题,那就是word-spacing和letter-spacing的差别。
开始自己也想很简单,于是直接使用p{word-spacing:10px;},然后直接尴尬了,没有任何效果,主要原因还是没有细究两个之间的差别,先看看它的语法吧。
letter-spacing
语法:
letter-spacing : normal | length
参数:
normal : 默认间隔
length : 由浮点数字和单位标识符组成的长度值,允许为负值。请参阅长度单位
说明:
检索或设置对象中的文字之间的间隔。
该属性将指定的间隔添加到每个文字之后,但最后一个字将被排除在外。
对应的脚本特性为letterSpacing。
word-spacing
语法:
word-spacing : normal | length
参数:
normal : 默认间距
length : 由浮点数字和单位标识符组成的长度值,允许为负值。请参阅长度单位
说明:
检索或设置对象中的单词之间插入的空格数。对于IE4+而言仅在MAC平台上可用。
对应的脚本特性为wordSpacing。
总结起来:letter-spacing为每个字符之间的空白距离,word-spacing为单词之间的空白距离,
其他没有效果,所以上面就好解释了,中文文字下用word-spacing是没有效果的,所以只能用letter-spacing。
css常用属性总结:关于word-spacing和letter-spacing的使用的更多相关文章
- 好程序员web前端分享css常用属性缩写
好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #0000 ...
- 1+x证书学习日志——css常用属性
## css常用属性: 1:文本属性: 文本大小: font-size:18px; 文本颜色 colo ...
- 02: css常用属性
目录: 1.1 设置样式的七个选择器 1.2 css常见属性浅析 1.3 css布局中常用方法 1.1 设置样式的七个选择器返回顶部 1.其中选择器介绍 1. 直接在标签里的style标签写样式 2. ...
- CSS常用属性-xy
一.文本Text CSS text-align 属性 文本对齐方式 CSS text-decoration 属性 text-decoration 属性规定添加到文本的修饰 CSS line-heigh ...
- css常用属性汇总
一.常用css属性 (1) *block(区块) 行高 line-height:数值 | inherit | normal; 字间距 letter-spacing: 数值 | inherit | no ...
- 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍
01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline ...
- css常用属性1
1 背景相关 背景颜色 background-color = 颜色名称/rgb值/十六进制值 背景图片 background-image = url('') 背景图片平铺方式 backgro ...
- css常用属性总结:颜色和单位
在css代码编写中,估计颜色和单位是必不可少的,然而在css中关于颜色和单位值的写法有很多种写法,所以有必要把它弄清楚. 颜色 当初我在初学前端的时候,就会冒出一个疑问“我该如何设置网页颜色?”,一般 ...
- javascript之css常用属性
1. position : 属性值有absolute .fixed.relative absolute:生成绝对定位的元素,相对第一父元素进行定位: fixed : 生成绝对定位的元素,相对于浏览 ...
- css常用属性2
1 浮动和清除浮动 在上篇的第十一节--定位中说道: CSS 有三种基本的定位机制:普通流.浮动和绝对定位. 普通流和绝对定位已经说完,接下来就是浮动了. 什么是浮动? CSS 的 Float(浮动 ...
随机推荐
- Linux jdk环境配置模板
export JAVA_HOME=/opt/JAVA/jdk1.8.0_191export JRE_HOME=${JAVA_HOME}/jreexport CLASSPATH=.:${JAVA_HOM ...
- Jenkins用户权限管理
一.插件安装 插件:Role-based Authorization Strategy版本:2.3.2 二.全局安全配置 进入Jenkins后点击系统管理进入全局安全配置 当插件安装好的时候,授权策略 ...
- Linux 环境下 javac 编译错误: 编码UTF8的不可映射字符 (编码UTF8/GBK的不可映射字符)
Linux 系统下一般默认使用UTF-8编码, 使用javac 编辑使用其他编码格式编写的源吗时,会出现 “ 错误: 编码UTF8的不可映射字符 ”. 最近在使用 javac 编译 一个在wind ...
- 小数第n位
问题描述 我们知道,整数做除法时,有时得到有限小数,有时得到无限循环小数. 如果我们把有限小数的末尾加上无限多个0,它们就有了统一的形式. 本题的任务是:在上面的约定下,求整数除法小数点后的第n位开始 ...
- 《DSP using MATLAB》 Problem 2.3
本题主要是显示周期序列的. 1.代码: %% ------------------------------------------------------------------------ %% O ...
- p/Invoke工具
开源的工具 下面这个链接来下载这个工具: http://download.microsoft.com/download/f/2/7/f279e71e-efb0-4155-873d-5554a06085 ...
- macOS -- 如何通过终端开启/关闭SSH
在macOS中(较新版),基本都会配置了SSH,能完成我们开发中绝大部分功能,所以不需要再去使用第三方的软件去操作. 不过SSH守护进程是默认禁用的,我们需要手动开启 1. 查看是否开始SSH功能 s ...
- Django 中间件使用
前戏 我们在前面的课程中已经学会了给视图函数加装饰器来判断是用户是否登录,把没有登录的用户请求跳转到登录页面.我们通过给几个特定视图函数加装饰器实现了这个需求.但是以后添加的视图函数可能也需要加上装 ...
- MAC OX 配置 Tomcat 说明
1: 首先在官网下载 Tomcat(我选择的是最新的9.0) , http://tomcat.apache.org/ 2:下载完成之后将压缩包解压在/Library/下 可使用快捷键 control+ ...
- const T & 的适用范围
我们往往在类中的函数体,重载操作中看到 const T & 的影子,以前还是比较纳闷. 对于非内部数据类型的参数而言,象void Func(A a) 这样声明的函数注定效率比较底.因为函数体内 ...