CSS概述(二)

字体,文本,背景,空间

style.jpeg

单位
像素:绝对单位,px,px 是 pixels(像素)的缩写,是一种绝对单位,用于屏幕显示器上,传统上一个像素对应于计算机屏幕上的一个点,而对于高清屏则对应更多。任何现代显示屏,不管是手机,平板,笔记本还是电视都是由成千上万的像素组成的,所以我们可以使用这些像素来定义长度。

百分比:相对单位,注意点:如果对 html 元素设置 font-size 为百分比值,则是以浏览器默认的字体大小16px为参照计算的(所有浏览器的默认字体大小都为 16px),如62.5%即等于10px(62.5% * 16px = 10px)。


颜色

p {
  color: white;
}

颜色关键字,如red,green,gray等。除此之外,还有两个关键词可用,分别是 transparentcurrentColor
transparent:从字面上的意思就可以知道该关键字是设置为透明。
currentColor:表示使用该元素 color 的计算值。如果该元素设置了 color 颜色值,则使用该 color;如果该元素没有设置 color,则继承父级元素的 color。

div {
  color: rgb(255, 255, 0);
  background-color: rgba(255, 255, 255, 0.1);
}

rgb()
表示为:rgb(red, green, blue)。每个参数 (red、green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%)
rgba()
在 rgb 的基础上,还可以添加一个 alpha 透明度表示半透明值,这样就构成了我 rgba,其函数表示为:rgb(red, green, blue, alpha),其中 alpha 参数是介于 0.0(完全透明)与 1.0(完全不透明)的数字。

div {
  color: #ff0000;
}

十六进制方法表示颜色。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • FreeCodeCamp - HTML5 and CSS 发现原来在另外一台电脑学 FreeCodeCamp 的时...
    付林恒阅读 9,424评论 2 17
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,081评论 0 1
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    前端进阶之旅阅读 16,594评论 32 459
  • 官方文档 初始化 Initialization是为准备使用类,结构体或者枚举实例的一个过程。这个过程涉及了在实例里...
    hrscy阅读 1,148评论 0 1
  • 世间有太多的海誓山盟会没有结局,即使最终仍然念念不忘初心,但能够海枯石烂的往往都会伴随着一种凄美,伴随有悲剧...
    金永辉煌阅读 1,928评论 14 12