节背景颜色深浅

该文章教大家调节DW中背景颜色的深浅

<!doctype html>

背景颜色透明
   <style>

          .header{

                 width:

400px;

                 height:

400px;

                 background:#

FF0004;

          }

   </style>
   <div

class=“header”>

新建一个HTML文档在“body”标签中写一个‘div’类名为“header”

然后在“style”标签中写“header”的样式,宽400像素,高400像素,背景颜色为红色

效果如下图
在这里插入图片描述

接下来设置背景颜色的深浅
在这里插入图片描述

当这个页面出现后直接点击“颜色选取器”

弹出下面的页面
在这里插入图片描述

点击HSLa,然后选择红色,直接回车。

应该如下

   <style>

          .header{

                 width:

400px;

                 height:

400px;

                 background:hsla(0,0%,0%,1.00);

          }

   </style>

后面“1.00”用来调节深浅

当后面的值我们设置为0.5时,效果见下图
在这里插入图片描述

原来的深红色变成现在的粉色。

猜你喜欢

转载自blog.csdn.net/weixin_44540360/article/details/91356688