У меня проблема, надо поместить текст на картинку, подскажите пожалуйста, как это сделать. Надо
CONQUER
Simple Bootstrap Template наложить на картинку.html {
width: 100%;
height: 100%;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
font-family: "Open Sans", Helvetica, Arial, sans-serif!important;
}
body {
overflow-x: hidden;
}
ul.nav {
position: relative;
left: 50%;
transform: translateX(-50%);
margin: 0;
height: 70px;
}
.navbar .navbar-nav {
display: inline-block;
float: none;
}
ul.nav li {
width: 140px;
margin-top: 5px;
display: inline;
/* Отображать как строчный элемент */
margin-right: 15px;
/* Отступ слева */
border: 1px solid #000;
/* Рамка вокруг текста */
}
li:after {
background-color: #49505F
}
.nav a {
text-align: center;
font-size: 20px;
line-height: 20px;
font-family: sans-serif;
text-decoration: none;
color: white;
display: inline-block;
padding: 10px 20px;
background-color: #383E4C;
border: 1px solid #646D7C;
}
.navbar {
background-color: #383E4C;
margin: 0;
}
img {
width: 100%;
height: 100%;
}
<div class="header">
<nav class="navbar">
<ul class="nav navbar-nav">
<li><a href="section1">Homepage</a></li>
<li><a href="section2">About Us</a></li>
<li><a href="section3">Services</a></li>
<li><a href="section4">Contact</a></li>
<li><a href="section5">External</a></li>
</ul>
</nav>
</div>
<div class="content">
<div class="img">
<img src="img/bg-1.jpg" alt="#">
<h1>CONQUER</h1>
<h4>Simple Bootstrap Template</h4>
</div>
<div class="slide-content">
<div class="bootstrap"></div>
<div class="responsive-design"></div>
<div class="parallax-layout"></div>
</div>
</div>