zoukankan      html  css  js  c++  java

  • 由设置body线性背景色引发的问题-----当声明文档类型时，对body设置线性背景色，页面背景色无法整体线性过渡

    问题：当声明文档类型时，对body设置线性背景色，页面背景色无法整体线性过渡

     不声明文档类型时，对body设置线性背景色

    1. <HTML>
    2. <head>
    3.     <meta charset="UTF-8">
    4.     <title>Title</title>
    5.     <style>
    6.         body{
    7.             background: linear-gradient(to bottom, #fff, #000);
    8.         }
    9.     </style>
    10. </head>
    11. <body>
    13. </body>
    14. </HTML>

    显示如下： 

     

    声明文档类型后，显示如下

    1. <!DOCTYPE html>
    2. <HTML>
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6.     <style>
    7.         body{
    8.             background: linear-gradient(to bottom, #fff, #000);
    9.         }
    10.     </style>
    11. </head>
    12. <body>
    14. </body>
    15. </HTML>

    最终解决方案：

    1. <!DOCTYPE html>
    2. <HTML>
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6.     <style>
    7.         html, body{
    8.             height: 100%;
    9.         }
    10.         body{
    11.            background: linear-gradient(to bottom, #fff, #000);
    12.        }
    13.     </style>
    14. </head>
    15. <body>
    17. </body>
    18. </HTML>
    参考文档：

    CSS解决高度自适应问题

     
  • 相关阅读:
    JOI2017FinalC JOIOI 王国
    JOISC2017C 手持ち花火
    P4336 [SHOI2016]黑暗前的幻想乡
    SP104 HIGH
    P3160 [CQOI2012]局部极小值
    P4965 薇尔莉特的打字机
    【BZOJ4361】isn
    P3506 [POI2010]MOT-Monotonicity 2
    P3214 [HNOI2011]卡农
    P3704 [SDOI2017]数字表格
  • 原文地址：https://www.cnblogs.com/jeacy/p/6531988.html
Copyright © 2011-2022 走看看