css - How to add background images for jumbotron in bootstrap? -
i started bootstrap 2 days ago.
the problem i'm facing i'm unable put background image whole page or jumbotron. tried directly giving path (both relative , absolute) div tag, didn't work. have tried through css, still dont see background image in output. please help!
i want have background image jumbotron.
this code wrote:
html:
<div class="row"> <div class="jumbotron"> <div class="container"> <center> <h1>avudo computers</h1> <h5>redesigning hopes.</h5> </center> </div> </div> </div>
css:
background-image: url(../img/jumbotronbackground.jpg); background-position: 0% 25%; background-size: cover; background-repeat: no-repeat; color: white; text-shadow: black 0.3em 0.3em 0.3em;
if seems haven't declared class/id in css.
you have attach .jumbotron
css rules.
see example.
body, html { background: url(http://i.telegraph.co.uk/multimedia/archive/02423/london_2423609k.jpg) center center no-repeat; background-size: cover; height: 100%; } div.jumbotron { background-image: url(http://placehold.it/1350x550/f00/f00); background-position: 0% 25%; background-size: cover; background-repeat: no-repeat; color: white; text-shadow: black 0.3em 0.3em 0.3em; }
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /> <div class="jumbotron"> <div class="container"> <center> <h1>avudo computers</h1> <h5>redesigning hopes.</h5> </center> </div> </div>
Comments
Post a Comment