博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CSS基础
阅读量:4199 次
发布时间:2019-05-26

本文共 1226 字,大约阅读时间需要 4 分钟。

CSS 语法

  CSS语法由三部分构成:选择器、属性和值:

  selector {property: value}

  选择器(selector)通常是你希望定义的HTML元素或标签,属性(property)是你希望改变的属性,并且每个属性都有一个值。属性和值被冒号分开,并由花括号包围,这样就组成了一个完整的样式声明(declaration):  

  body {color: blue}

  上面这行代码的作用是将body元素内的文字颜色定义为蓝色。在上述例子中,body是选择器,而包括在花括号内的的部分是声明。声明依次由两部分构成:属性和值,color为属性,blue为值。

  值的不同写法和单位

  除了英文单词red,我们还可以使用十六进制的颜色值#ff0000:

  p { color: #ff0000; }

  为了节约字节,我们可以使用CSS的缩写形式:

  p { color: #f00; }

  我们还可以通过两种方法是用RGB值:

  p { color: rgb(255,0,0); }

  p { color: rgb(100%,0%,0%); }

  请注意,当使用RGB百分比时,即使当值为0时也要写百分比符号。但是在其他的情况下就不需要这么做了。比如说,当尺寸为0像素时,0之后不需要使用px单位。

  记得写引号

  提示:如果值为若干单词,则要给值加引号:

  p {font-family: "sans serif";}

  多重声明:

  提示:如果要定义不止一个声明,则需要用分号将每个声明分开。下面的例子展示出如何定义一个红色文字的居中段落。最后一条规则是不需要加分号的,因为分号在英语中是一个分隔符号,不是结束符号。然而,大多数有经验的设计师会在每条声明的末尾都加上分号,这么的好处是,当你从现有的规则中增减声明时,会尽可能的减少出错的可能性。就像这样:

  p { text-align: center; }  

你应该在每行描述只写一个属性,以使得样式定义的可读性更强,就像这样:

  p {

  text-align: center;
  color: black;
  font-family: arial;
  }

  空格和大小写敏感

  大多数样式表包含不止一条规则,而大多数规则包含不止一个声明。多重声明和空格的使用使得样式表更容易被编辑:

  body {

   color: #000;
   background: #fff;
   margin: 0;
   padding: 0;
   font-family: Georgia, Palatino, serif;
   }

  是否包含空格不会影响CSS在浏览器的工作效果,同样,与XHTML不同,CSS对大小写不敏感。不过存在一个例外:如果涉及到与HTML文档一起工作的话,class和id名称对大小写是敏感的。

转载地址:http://fibli.baihongyu.com/

你可能感兴趣的文章
图像调优1:清晰度相关参数MTF,SFR,MTF50,MTF50P 以及TVL的概念以及换算说明
查看>>
罗永浩欲直播带货,京东说可以帮忙联系
查看>>
B站,正在变成下一个“公众号”?
查看>>
小米启动安心服务月 手机家电产品可免费清洁保养
查看>>
刘作虎:一加新品将全系支持 5G
查看>>
滴滴顺风车上线新功能,特殊时期便捷出行
查看>>
不会延期!iPhone 12S预计如期在9月发售:升级三星LTPO屏幕
查看>>
腾讯物联网操作系统TencentOS tiny线上移植大赛,王者机器人、QQ公仔、定制开发板等礼品等你来拿 !
查看>>
为云而生,腾讯云服务器操作系统TencentOS内核正式开源
查看>>
腾讯汤道生:开源已成为许多技术驱动型产业重要的创新推动力
查看>>
微信小程序多端框架 kbone 开源
查看>>
视频质量评估算法 DVQA 正式开源
查看>>
腾讯优图开源视频动作检测算法DBG,打破两项世界纪录
查看>>
在中国提供了60亿次服务的疫情模块向世界开源 腾讯抗疫科技输出海外
查看>>
在中国提供了60亿次服务的疫情模块向世界开源
查看>>
世界卫生组织与腾讯加深合作 新冠肺炎AI自查助手全球开源
查看>>
Hibernate 中get, load 区别
查看>>
java反射详解
查看>>
JPA 注解
查看>>
JQuery 简介
查看>>