Home / Questions / 25301
Accepted
May
Asked: 2020-09-28 22:42:57 +0800 CST 2020-09-28 22:42:57 +0800 CST

How to adapt a gradient background image?

  • 772

How do I adapt a gradient background image with a resolution of 150x150.

The background image is divided into several parts, as I manage to adapt the gradient image correctly.

body {
 margin: 0;
 padding: 0;
 background: url(http://dominointernet.s3.amazonaws.com/web/wp-content/uploads/2013/07/home-slider-bg-gris.png) center center fixed;
}
<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <div>contenido, contenido</div>
</body>
</html>

html5

2 Answers

  1. Best Answer

    Here you have it in RGB, I hope it helps you!

    body {
background-color: rgb(238,238,238);
@include filter-gradient(#eeeeee, #cccccc, horizontal);
@include background-image(radial-gradient(center, ellipse cover,  rgb(238,238,238) 0%,rgb(204,204,204) 100%));
}
    <!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <div>contenido, contenido</div>
</body>
</html>

    • 2

  2. Try adding

    html,body{ height:100%; }

    in your css file and removing center center fixedfrom the property backgroundin the body

    html,body{
   height:100%;
}

body {
 margin: 0;
 padding: 0;
 background: url(http://inidesing.com/imagenes/grad.png) ;
 
}
    <!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <div>contenido, contenido</div>
</body>
</html>

    • 1