CSS设计模式:使用空白

css中的空白(whitespace)只包括以下几种:空格(\20)、制表位(\09)、换行(\oA)、回车(\oD)和换页(\oc)。浏览器不会识别其他Unicode空白字符,
例如非间断空格(\Ao)。

你可以在以下几项前后任意添加空白:选择符、大括号、属性、冒号、值和分号。比如,以下这些语句虽各不相同,却都是正确的,并会产生相同的结果:

body { font-size: 20px; line-height: 150% }

body { font-size: 20px; line-height: 150%;}

body { font-size: 20px; line-height: 150%;}

body

{

&">nbsp;   font-size:    20px;

    line-height:  150%;

}

我使用了一个紧凑的代码书写方式,在规则内没有空白,但
是在规则和选择符之间,我插了一个空格,
如下所示:

body{font-size: 20px;line-heighL:150%;}

属性名字或常量属性值中不能出现空白。当css的属性名或者常量属性值由多个词构成的时候,应使用连字符把每个词分隔开,例如font- family和sans-serif。极为特殊的情况下.css使用CameICase(每个单词的首字母大写)的方式将多个词组合为一个常量值,例如ThreeD-LightShadow.

时间: 2024-09-13 19:58:52

CSS设计模式:使用空白的相关文章

CSS属性 - white-space 空白属性使用说明_经验交流

CSS属性 - white-space 空白属性说明 该CSS属性用来处理空白. 值:normal | pre | nowrap | inherit  可用值 值的说明  normal 缺省值.文本自然换行.如果超过元素宽度,内容自然换到下一行.  nowrap 不允许换行.  pre 保留换行和空白.这个值只有当你声明了!DOCTYPE,且 IE 6 以上版本才支持. 在 HTML 文件里,空白,比如换行符 (line breaks). 空格 (spaces). 制表符 (tabs),都被自动

CSS设计模式:语法

css的语法非常简单.一个样式表中含有很多样式(style),一种样式又包括了选择符(selector)和规则(rule),一条规则包括一个属性(property)和值(http://www.aliyun.com/zixun/aggregation/9541.html">value).下面是样式的 设计模式: SELECTORS' RULES) 规则的设计模式如下所示: PROPERTY:VALUE: 举个例子,p{margin:o:}是一种样式.p是选择符,它选择了HTML文档中的所有&

CSS设计模式

我把这些结果浓缩成了350余种简单的设计模式--这些css和HTML设计模式将会帮助你创建出令人震惊的.高性能并且可访问的网站.在了解这些设计模式后,你将会诧异为什么以前开发网站的时候没有用到它们! 我将阐述一下设计模式的用途以及它们的运作机理.我会举一些例子来说明如何通过组合某些设计模式来创建新的模式.我还将告诉你如何有效地利用样式表. css语法和层叠排序.接下来要展示一组图表,其中列出了全部可用的css属性和度量单位.然后t我将列出12种快速解决css难题的方案.最后,我想讲一下如何将不同

CSS设计模式,使用属性值

属性值有以下几种格式:常量文本.常量数字.长度.百分比.函数和逗号分隔的一组值.每个属性可按受其中的一种或多种值. 1.color:blacki把常量值black赋给了color属性.大多数属性拥有唯一的常量值.举个例子,可以给color属性赋上170多种表示颜色的常量,从http://www.aliyun.com/zixun/aggregation/6144.html">papayawhip到ThreeDDark -Shadow. 2.background-color:white,把常量

CSS设计模式:应用样式表

可以把样式放在3个地方:样式表.<style>和style.样式裹( stylesbeet)是一个独立的文件,可以通过<link>元素或者css的@import语句把它附加到某个HTML文档中.<style>是一个HTML元素,可以把它嵌在HTML文档中.style是一个属性,它可以嵌在任何HTML元素中.我建议把样式放在样式表里.这会减少HTML文档中的非内容成分,并且把所 有的样式放在独立的文件中也便于管理.我建议使用一个单词为样式表命名,并全部小写.这会令样式表的

《JavaScript设计模式》——2.3 传宗接代——继承

2.3 传宗接代--继承 "小白,看继承呢?"小铭忙完自己的事情走过来. "是呀,刚才学习类,发现每个类都有3个部分,第一部分是构造函数内的,这是供实例化对象复制用的,第二部分是构造函数外的,直接通过点语法添加的,这是供类使用的,实例化对象是访问不到的,第三部分是类的原型中的,实例化对象可以通过其原型链间接地访问到,也是为供所有实例化对象所共用的.然而在继承中所涉及的不仅仅是一个对象." "对呀,不过继承这种思想却很简单,如千年文明能够流传至今靠的就是传承

IT软件人员的技术学习内容(写给技术迷茫中的你) - 项目管理系列文章

前面笔者曾经写过一篇关于IT从业者的职业道路文章(见笔者文:IT从业者的职业道路(从程序员到部门经理) - 项目管理系列文章).然后有读者提建议说写写技术方面的路线,所以就有了本文.本文从初学者到思想者的四步方面对IT从业者的技术路线做了阐述(见笔者文:IT从业者的学习规划 - 学习者系列文章开篇),从浅到深的对技术路线需要学习的内容做了叙述,后续会对学习者系列文章进行书写,本文就当做该系列文章的一个版图吧. 对于技术路线,笔者认为,在工作之余,就该自我主动的去学习技术和业务方面的知识.一方面是

CSS关于解决图片元素下多余空白的BUG

在进行页面的DIV+CSS排版时,遇到浏览器中的图片元素img下出现多余空白的问题绝对是常见的.对于该问题的解决方法也是"见机行事",根据原因的不同要用不同的解决方法,这里把解决直接把解决image图片布局下边的多余空隙的BUG的常用方法归纳,供大家参考. 1.将图片转换为块级对象 即,设置img为"display:block;".在本例中添加一组CSS代码:"#sub img {display:block;}". 2.设置图片的垂直对齐方式 即

css特性:空白外边距互相叠加

白双边距是一个极容易误解的CSS特性.它不是CSS的bug,但如果我们一旦误解,将会给你带来很多麻烦. 先看如下demo代码: <!doctype html><html><head><meta charset="utf-8"><title>空白边距叠加demo@Mr.Think</title><style> body{width:300px; font-family:'微软雅黑'; font-size: