• 理解CSS前景色和透明度


    前面的话

      颜色的出现让网页不再只是黑白,运用好颜色设计,能让网页增色不少。一个网页给人们留下的第一印象实际上就是它的整体颜色。关于如何设置颜色,请移步CSS的6种颜色模式实际上,颜色的应用主要分为前景色、背景色和透明三个部分。本文主要介绍前景色和透明度。

    color

      color前景色

      值: <color> | inherit

      初始值: 用户代理特定的值

      应用于: 所有元素

      继承性: 有

    【影响边框】

      一般来说,前景是元素的文本,不过前景还包括元素周围的边框。有两种方式直接影响一个元素的前景色,可以使用color属性,也可以使用属性border-color设置边框颜色

    【继承颜色】

      color是可以继承的,可以把文档中的所有正常文本设置为某种颜色,如通过声明body{color:red;}设置为红色。这会把所有没有其他样式的文本变成红色(如锚就不包含在内,锚有其自己的颜色样式)。但浏览器对表单类元素有预定义的颜色,使body颜色无法继承到表单类元素中

    opacity

      opacity是CSS3中专门用来设置透明度的一个属性,opacity只能给整个元素设置一个透明度,并且其透明度直接会继承给其后代元素

      值: value | inherit

      value:默认值是1,可以取0-1的任意浮点数。其中,1表示完全不透明,0表示完全透明

      初始值: 1

      应用于: 所有元素

      继承性: 无

    【兼容性】

      IE8-浏览器不支持opacity透明属性,可以使用其专用的滤镜来实现opacity透明属性的透明效果

      filter:alpha(opacity=透明值),该透明值是0-100之间的任意整数

    opacity: 0.8;
    filter:alpha(opacity=80);

  • 相关阅读:
    Vue Router详细教程
    Vue CLI使用
    百度点选识别,单字90+
    CPU毫秒级 | 极验点选识别
    Linux内核之进程管理
    Linux内核之基本概念
    MySQL InnoDB技术内幕:内存管理、事务和锁
    ZooKeeper简介
    分布式一致性协议之ZAB
    图解HTTP读书笔记
  • 原文地址:https://www.cnblogs.com/xiaohuochai/p/5218459.html
Copyright © 2020-2023  润新知