请帮忙看看吧，谢谢

来源：3-2 编程练习

qq_初晴moment_5

2019-09-11 17:12:04

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>线性渐变</title>
    <style type="text/css">
         div{
          width: 100px;
          height: 100px;
          display: inline-block;
          text-align: center;
         }
         span{
          font-size: 12px;
          line-height: 30px;
         }
         .d1,.d2,.d3{
          width: 90px;
          height: 90px;
         }
         .d1{
          background: linear-gradient(yellow,red);
         }
         .d2{
          background: linear-gradient(to right,yellow,red);
         }
         .d3{
          background: linear-gradient(to right bottom,red,yellow);
         }
    </style>
</head>
<body>
    <div><span>上下方向渐变</span><div class="d1"></div></div>
    <div><span>左右方向渐变</span><div class="d2"></div></div>
    <div><span>对角方向渐变</span><div class="d3"></div></div>
</html>

写回答

1回答