nekoya/web
nekoya/web
1
0
Fork 0
mirror of https://gitlab.com/nekoya/web.git synced 2025-04-17 11:04:29 +02:00
Code Issues Projects Releases Packages1 Wiki Activity

resize image on Home Page

Browse source
This commit is contained in:
Kelvin Samuel 2021-09-23 13:56:34 +07:00
parent 8b340d8807
commit 2142c43a7c
2 changed files with 28 additions and 17 deletions

34
Style-index.css
View file

@ -16,7 +16,6 @@ body {
.carousel-inner{
margin-top: -3%;
width: 1518px;
}
.carousel-item{
@ -26,11 +25,15 @@ body {
position: relative;
}
@media screen and (max-width: 398px) {
.carousel-inner {
image-resolution: 4vw;
}
.carousel-img{
overflow:hidden;
}
.carousel-img figure{
position: relative;
width: 450%;
margin: 0;
left: 0;
}
.banner{
@ -325,30 +328,37 @@ body {
}
.main_slider{
width: 1400px;
height: 500px;
height: 550px;
background-repeat: no-repeat;
background-size: cover;
background-position: center center ;
margin-top: 3%;
margin-left: 4%;
position: relative;
}
.slider-img figure{
position: relative;
width: 350%;
margin: 0;
left: 0;
}
.main_slider_content{
width: 60%;
}
.main_slider_content h6{
.main_slider_content p{
font-size: 16pt;
font-weight: 500;
text-transform: uppercase;
margin-bottom: 29px;
margin-top: 20%;
margin-top: 15%;
}
.main_slider_content h1{
.main_slider_content a{
font-weight: 400;
line-height: 1;
font-size: 50pt;
font-size: 46pt;
}
.red_button{

11
index.html
View file

@ -57,7 +57,7 @@
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-inner" id="carousel-img">
<div class="carousel-item active">
<img class="d-block w-100" src="assets/Carousel_1.webp" alt="First slide" height="550px">
</div>
@ -288,13 +288,14 @@
</div>
</div>
<div class="main_slider" style="background-image: url(assets/slider_1.webp);">
<div class="main_slider" id="slider-img" style="background-image: url(assets/slider_1.webp);">
<div class="container fill_hight">
<div class="row align-items-center fill_hight" style="margin-top: -4%;">
<div class="col">
<div class="main_slider_content">
<h6>Spring / Summer Collection 2021</h6>
<h1>Get up to 30% off Now Arrivals</h1>
<p>Spring / Summer Collection 2021</p>
<a>Get up to 30% off <br> Now Arrivals</a>
<br>
<div class="red_button shop_now_button"><a href="product-list.html">Shop now</a></div>
</div>
</div>
@ -494,7 +495,7 @@
</div>
<div class="product_slider_nav_right product_slider_nav d-flex align-items-center justify-content-center flex-column">
<i class="fa fas-chevron-right" aria-hidden="true"><img
src="https://img.icons8.com/ios-glyphs/30/000000/more-than.webp"/></i>
src="https://img.icons8.com/ios-glyphs/30/000000/more-than"/></i>
</div>
</div>
</div>