omerfaruq1
80+
- Katılım
- 18 Ekim 2020
- Mesajlar
- 35
Dahası
- Reaksiyon skoru
- 6
- İsim
- ömer faruk demir
arkadaşlar kod kısmı bu şekilde ama web sitesinde butonlar gözükmüyor yardımcı olur msunuz?
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.baslik{
font-size: 20px;
margin-left: 100px;
font:bold 30px tahoma;
}
#baslik {
background-color: rgb(254, 152, 69);
width:min-content;
padding: 10px;
border-radius: 3px;
text-align: center;
}
#disbaslik{
padding: 10px;
width:100%;
background-color: rgb(58, 90, 101);
position:absolute;
top:0px;
left: 0px;
}
a:link {
color: red;
text-decoration:none;
}
a:visited {
color: black;
text-decoration:none;
}
.ilan{
margin-top: 130px;
margin-left: 160px;
}
.slider {
width: 580px;
height: 430px;
background-color: yellow;
margin-left: 160px;
text-align: center;
overflow: hidden;
}
.image-container {
width: 2320px;
background-color: pink;
height: 430px;
clear: both;
position: relative;
-webkit-transition: left 2s;
-moz-transition: left 2s;
-o-transition: left 2s;
transition: left 2s;
}
.slide {
float: left;
margin: 0px;
padding: 0px;
position: relative;
}
#slide-1:target ~ .image-container {
left: 0px;
}
#slide-2:target ~ .image-container {
left: -580px;
}
#slide-3:target ~ .image-container {
left: -1160px;
}
#slide-3:target ~ .image-container {
left: -1740px;
}
#slide-3:target ~ .image-container {
left: -2320px;
}
.buttons {
position: relative;
top: -20px;
}
.buttons a {
display: inline-block;
height: 15px;
width: 15px;
border-radius: 50px;
background-color: lightgreen;
}
</style>
</head>
<body>
<div id="disbaslik">
<div class="baslik" id="baslik" >
<a href="anasayfa.html">
sgffdhgfgdhgf
</a>
</div>
</div>
<h2 class="ilan">2020 PEUGEOT 508 1.5 BlueHDI PRİME EAT 8 SERV. BAK.</h3>
<div class="slider">
<span id="slide-1"></span>
<span id="slide-2"></span>
<span id="slide-3"></span>
<span id="slide-4"></span>
<span id="slide-5"></span>
<div id="image-container">
<img src="resim/1.jpg" class="slide" width="580" height="430"/>
<img src="resim/2.jpg" class="slide" width="580" height="430"/>
<img src="resim/3.jpg" class="slide" width="580" height="430"/>
<img src="resim/4.jpg" class="slide" width="580" height="430"/>
<img src="resim/5.jpg" class="slide" width="580" height="430"/>
</div>
<div class="buttons">
<a href="#slide-1"></a>
<a href="#slide-2"></a>
<a href="#slide-3"></a>
<a href="#slide-4"></a>
<a href="#slide-5"></a>
</div>
</div>
</body>
</html>
Mesaj otomatik birleştirildi:
Mesaj otomatik birleştirildi:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.baslik{
font-size: 20px;
margin-left: 100px;
font:bold 30px tahoma;
}
#baslik {
background-color: rgb(254, 152, 69);
width:min-content;
padding: 10px;
border-radius: 3px;
text-align: center;
}
#disbaslik{
padding: 10px;
width:100%;
background-color: rgb(58, 90, 101);
position:absolute;
top:0px;
left: 0px;
}
a:link {
color: red;
text-decoration:none;
}
a:visited {
color: black;
text-decoration:none;
}
.ilan{
margin-top: 130px;
margin-left: 160px;
}
.slider {
width: 580px;
height: 430px;
background-color: yellow;
margin-left: 160px;
text-align: center;
overflow: hidden;
}
.image-container {
width: 2320px;
background-color: pink;
height: 430px;
clear: both;
position: relative;
-webkit-transition: left 2s;
-moz-transition: left 2s;
-o-transition: left 2s;
transition: left 2s;
}
.slide {
float: left;
margin: 0px;
padding: 0px;
position: relative;
}
#slide-1:target ~ .image-container {
left: 0px;
}
#slide-2:target ~ .image-container {
left: -580px;
}
#slide-3:target ~ .image-container {
left: -1160px;
}
#slide-3:target ~ .image-container {
left: -1740px;
}
#slide-3:target ~ .image-container {
left: -2320px;
}
.buttons {
position: relative;
top: -20px;
}
.buttons a {
display: inline-block;
height: 15px;
width: 15px;
border-radius: 50px;
background-color: lightgreen;
}
</style>
</head>
<body>
<div id="disbaslik">
<div class="baslik" id="baslik" >
<a href="anasayfa.html">
sgffdhgfgdhgf
</a>
</div>
</div>
<h2 class="ilan">2020 PEUGEOT 508 1.5 BlueHDI PRİME EAT 8 SERV. BAK.</h3>
<div class="slider">
<span id="slide-1"></span>
<span id="slide-2"></span>
<span id="slide-3"></span>
<span id="slide-4"></span>
<span id="slide-5"></span>
<div id="image-container">
<img src="resim/1.jpg" class="slide" width="580" height="430"/>
<img src="resim/2.jpg" class="slide" width="580" height="430"/>
<img src="resim/3.jpg" class="slide" width="580" height="430"/>
<img src="resim/4.jpg" class="slide" width="580" height="430"/>
<img src="resim/5.jpg" class="slide" width="580" height="430"/>
</div>
<div class="buttons">
<a href="#slide-1"></a>
<a href="#slide-2"></a>
<a href="#slide-3"></a>
<a href="#slide-4"></a>
<a href="#slide-5"></a>
</div>
</div>
</body>
</html>
