CSS. 如何改变颜色

本教程将向您展示如何更改任何颜色 HTML 模板使用CSS样式属性.

页面上的项目可以通过两种方式着色:彩色代码或图像. 首先打开你的 website in browser ，按F12键打开 browser 开发人员工具.
使用此工具，您可以找到页面上任何元素的样式属性. 如果你不熟悉 browser 开发人员工具请查看本文.
例如，你可以看到下面的样式:

 
.button {
    背景:-moz-linear-gradient(#FF8E00， #FF7F00)
    Border-radius: 5px 5px 5px;
    颜色:# FFFEFE;
    显示:inline-block;
    font-family: PT Sans, Sans -serif;
    字体大小:14 px;
    粗细:400;
    行高:1.2em;
    填充:20px 27px 19px;
    首字母:大写;
}
 

在上面的样式属性中，你可以看到几个颜色代码:#FF8E00， #FF7F00， #FFFEFE等. 它们每个都定义了自己的颜色. 您可以从任何图像编辑器中获得颜色代码 software.

将代码复制到CSS文件中，保存并刷新页面 browser 要查看变化.

万一 background 颜色是使用图像创建的，您可以更改图像文件或替换图像 background 带颜色的.

例如，您有以下样式:

 
.box-red {
    背景:url(“../图片/ box-red.Gif ")重复滚动0 0透明;
    border-bottom: 1px solid #E8837E;
    Border-radius: 9px 9px 9px;
    border-right: 1px solid #E8837E;
    border-top: 1px solid #E8837E;
    颜色:# FFFFFF;
    位置:相对;
    宽度:315 px;
}

Where the background 使用以下图像设置:

 背景:url(“../图片/ box-red.Gif ")重复滚动0 0透明;

您可以进入images文件夹并替换框红色.GIF文件 background 图像或简单地替换图像 background with color

Replace:

背景:url(“../图片/ box-red.Gif ")重复滚动0 0透明;

with

背景:# E8837E;

请随时查看下面的详细视频教程: