Web sitesi nasıl daha güzel hale getirilir?

GTA Carl Johnson · 5 Mart 2023

ErrorCorrection dedi:

Sitenin Domain'ini almadım. O yüzden HTML kodlarını atacağım. Ne olsa daha güzel olurdu. Yazarsanız çok sevinirim.
Bilmeyen arkadaşlar için attığım kodların hepsini kopyalayıp, not defterinden açtıkları yere yapıştırdıktan sonra dosyayı .html olarak kaydedip bakabilirler.

HTML:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Css-sites</title>
<style type="text/css" media="screen">
html{
 scroll-behavior: smooth;

}

body{
 max-height: 100%;
 max-width: 100%;
 margin: 0;
 }
*{box-sizing: border-box;
 margin: 0;
 }
.navbar{
 background-color: #E8D5C4;
 padding: 10px 0 0 10px;
 }
.main-div__item a{
 text-decoration: none;
 color: #4E6E81;
 font-weight: bold;
 font-size: 15px;
 font-family: sans-serif;
 }
.main-div{
 display: inline-block;
 width: calc(100% - 150px);
 text-align: right;
 }
.main-div__items{
 margin: 0;
 padding: 0;
 list-style: none;
 }
.main-div__item{
 display: inline-block;
 margin-left: 10px;
 box-sizing: border-box;
 }
.main_logo{
 color: #40513B;
 text-decoration: none;
 font-size: 15px;
 font-weight: bolder;
 }
.main-div__item a:hover{
 color: #BE6DB7;
 }
.main-div__item::before{
 content: "\2022";
 }
 .main-div__item-login a{
 color: #fff;
 background-color: #3795BD;
 border: 2px solid white;
 padding: 7px 12px;
 /* border-radius: 10px 30px; */
 border-radius: 10px;
 }.main-div__item-login a:hover{
 color:#3795BD;
 background-color: white;
 border-color: #3795BD;
 }.main-div__item-login::before{
 content: none;
 }.section{
 height: 650px;
 width: 100%;
 background-image: url(https://wallpaper.dog/large/5445110.jpg);
 background-position: bottom;
 background-attachment: fixed;
 background-size: cover;
 }.section h2{
 text-align:left;
 color: #E8D5C4;
 position: absolute;
 top: 50%;
 left:50%;
 transform: translate(-50%, -50%);
 font-size: 25px;
 user-select: none;
 transition:1s;
 padding: 20px;
 }.section h2:hover{
 background-color: rgba(66, 5, 68, 0.24);
 box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
 }
.main-div__header{
 margin: 0 25%;
 text-align: center;
 margin-top: 30px;
 margin-bottom: 50px;
}.main-row{
 display: inline-block;
 width: 25%;
 padding: 30px;
 margin: 15px;
}.main{
 text-align: center;
}.main h3{
 color: #804674;
}.main-texts h3{
 margin-bottom: 30px;
}.main-row p{
 letter-spacing: 0.5px;
}.main-div__header p{
 margin-top: 20px;
}.photo{
 margin-left: 15%;
 display: inline-block;
 width: 30%;
 height: 400px;
 background-image: url(https://p4.wallpaperbetter.com/wallpaper/936/632/876/girl-butterfly-model-blonde-wallpaper-preview.jpg);
 background-repeat: no-repeat;
 background-position: center top;

}.aside{
 display: inline-block;
 width: calc(100% - 60%);
 background-color: #DBE2EF;
 min-height: 400px;
 vertical-align: top;
}.product{
 margin-top: 50px;
}.aside h2{
 font-family: system-ui;
 width: 100%;
 text-align: center;
 margin-top: 12%;
}.aside p{
 margin-left: 30px;
 margin-top: 40px;
 text-align: left;
 padding: 5px;
 font-family: system-ui;
 letter-spacing: 0.7px;
 word-spacing: 1px;
}.aside .btn{
 margin-left: 30px;
 background-color: #F38181;
 padding: 10px;
 font-size: 20px;
 color: white;
}.aside .btn a{
 text-decoration: none;
 color: white;
}.opt{
 display: inline-block;
 width: 25%;
 min-height: 200px;
 height: 300px;
 background-color: rgba(168, 169, 178, 0.38);
 text-align: center;
 float: left;
 margin: 40px;
 padding: 20px;
 border-radius: 20px;
 text-overflow: ellipsis;
 box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
 transition: box-shadow .6s;
}.opt:hover{
 box-shadow: rgba(0, 0, 0, 0.8) 0px 5px 15px;
}

.premium{
 margin: 0 auto;
 width: 1200px;
 box-sizing: border-box;
}.premium .title{
 margin-top: 100px;
 width: 100%;
 text-align: center;
 padding-bottom: 20px;
} ul{
 margin: 0;
 padding: 0;
 list-style-type: none;
}ul li{
 padding-bottom: 10px;
}.opt h3{
 margin-bottom: 30px;
}.price{
 margin-bottom: 20px;
}.buy{
 cursor: pointer;
 border: 3px solid white;
 background-color: #EB455F;
 width: 100px;
 height: 50px;
}.buy a{
 text-decoration: none;
 color: white;
}.rec-pack{
 background-color: #EDF1D6;
 color: tomato;
 padding: 8px;
 border-radius: 5px;

}.standart-pack{
 background-color: #3A98B9;
 color: white;
}.yukari{
 background-color: #898121;
 color: white;
 text-decoration:none;
 padding: 15px;
 border-radius: 100%;
 position: fixed;
 bottom: 20px;
 right:20px;
}.numbers{
 user-select:none;
 margin-top:50px;
 display:inline-block;
 height:200px;
 width: 100%;
 background-color:transparent;
}.film{
 float: left;
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 position: relative;
 transition: .5s;
}.dizi{
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 float: left;
 position: relative;
 transition: .5s;

}.belgesel{
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 float: left;
 position: relative;
 transition: .5s;

}.film-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.film-sayi span{
 font-size: 30px;
}.dizi-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.dizi-sayi span{
 font-size: 30px;
}.belgesel-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.belgesel-sayi span{
 font-size: 30px;
}.film:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.film:hover .film-sayi{
 font-size: 30px;
}.dizi:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.dizi:hover .dizi-sayi{
 font-size: 30px;
}.belgesel:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.belgesel:hover .belgesel-sayi{
 font-size: 30px;
}

</style>
</head>
<body>
<header class="main-header">
<div class="navbar">
 <a href="Css-sites.html" class="main_logo">GetMovie.com</a>
 <div class="main-div">
 <ul class="main-div__items">
 <li class="main-div__item"><a href="Css-sites.html">Home</a></li>
 <li class="main-div__item"><a href="#">Get Movie</a></li>
 <li class="main-div__item"><a href="#">Say Hello</a></li>
 <li class="main-div__item main-div__item-login"><a href="about.html">About</a></li>
 </ul>
 </div>
</div>
</header>
<div class="section">
<h2>Welcome <br>
What would you like to watch today?</h2>
</div>
<main class="main">
 <div class="main-div__header">
 <h3>How it works</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
 </div>

 <div class = "main-texts">
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 </div>
</main>
<main class="product">
 <div class="photo"></div>
 <div class="aside">
 <h2>Get All Dresses</h2>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
 quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
 consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse</p>
 <button class="btn"><a href="https://www.zara.com/tr/en/man-suits-l808.html" target="_blank">
 Buy Now.
 </a></button>
 </div>
 <main class="premium">

 <h3 class="title">
 Become a Premium.
 </h3>
 <div class="free opt">
 <h3>Free</h3>
 <h4 class="price">Free</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The All Series</li>
 <li>Dowloand 1080p</li>
 </ul>
 <button class="buy"><a href="#">Be Free User</a></button>

 </div>

 <div class="Recommended opt standart-pack">
 <h3 class="rec-pack">Standart</h3>
 <h4 class="price">9.99 $</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The Some Series</li>
 </ul>

 <button class="buy"><a href="#">Be Standart User</a></button>

 </div>

 <div class="Premium opt">
 <h3>Premium</h3>
 <h4 class="price">19.99 $</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The All Series</li>
 <li>Dowloand 1080p</li>
 </ul>
 <button class="buy"><a href="#">Be Premium User</a></button>

 </div>
 </main>
</main>
<div class="numbers">
 <div class="film">
 <div class="film-sayi">
 <h3>Film sayısı</h3>
 <span>715</span>
 </div>
 </div>

 <div class="dizi">
 <div class="dizi-sayi">
 <h3>Dizi sayısı</h3>
 <span>196</span>
 </div>
 </div>

 <div class="belgesel">
 <div class="belgesel-sayi">
 <h3> Üye Sayısı</h3>
 <span>15.000</span>
 </div>
 </div>
</div>
<a href="#" class="yukari">Up</a>
</body>
</html>

Tam CC çalma sitesi formatında.

ErrorCorrection · 5 Mart 2023

AslanBey340 dedi:
@ErrorCorrection hangi programla yaptınız siteyi.

Sublime-text editörünü kullandım ve HTML5-CSS3 kullandım.

GTA Carl Johnson dedi:
Tam CC çalma sitesi formatında.

Öyle yapmak istememiştim ama

AslanBey340 · 5 Mart 2023

ErrorCorrection dedi:
Hayır sadece aklıma ilk o geldi. Domain alma sitesi ya da alışveriş sitesi yapacağım şunalık Front-End çalıştığım için üstünkörü yazdım.

Domain alırsan ne olacak domain adı?

ErrorCorrection · 5 Mart 2023

AslanBey340 dedi:
Hangi programla yaptın?

Ne hangi programlamla hocam?
Açtım sublime-exti yazdım işte. Programdan kastınız web-site yapma uygulamaları ise. Onlarla yapmadım.

GTA Carl Johnson · 5 Mart 2023

ErrorCorrection dedi:
Sublime-text editörünü kullandım ve HTML5-CSS3 kullandım.

Öyle yapmak istememiştim ama

Boş ver, üzülme sonra daha iyisini yaparsın

canıko · 5 Mart 2023

ErrorCorrection dedi:

Sitenin Domain'ini almadım. O yüzden HTML kodlarını atacağım. Ne olsa daha güzel olurdu. Yazarsanız çok sevinirim.
Bilmeyen arkadaşlar için attığım kodların hepsini kopyalayıp, not defterinden açtıkları yere yapıştırdıktan sonra dosyayı .html olarak kaydedip bakabilirler.

HTML:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Css-sites</title>
<style type="text/css" media="screen">
html{
 scroll-behavior: smooth;

}

body{
 max-height: 100%;
 max-width: 100%;
 margin: 0;
 }
*{box-sizing: border-box;
 margin: 0;
 }
.navbar{
 background-color: #E8D5C4;
 padding: 10px 0 0 10px;
 }
.main-div__item a{
 text-decoration: none;
 color: #4E6E81;
 font-weight: bold;
 font-size: 15px;
 font-family: sans-serif;
 }
.main-div{
 display: inline-block;
 width: calc(100% - 150px);
 text-align: right;
 }
.main-div__items{
 margin: 0;
 padding: 0;
 list-style: none;
 }
.main-div__item{
 display: inline-block;
 margin-left: 10px;
 box-sizing: border-box;
 }
.main_logo{
 color: #40513B;
 text-decoration: none;
 font-size: 15px;
 font-weight: bolder;
 }
.main-div__item a:hover{
 color: #BE6DB7;
 }
.main-div__item::before{
 content: "\2022";
 }
 .main-div__item-login a{
 color: #fff;
 background-color: #3795BD;
 border: 2px solid white;
 padding: 7px 12px;
 /* border-radius: 10px 30px; */
 border-radius: 10px;
 }.main-div__item-login a:hover{
 color:#3795BD;
 background-color: white;
 border-color: #3795BD;
 }.main-div__item-login::before{
 content: none;
 }.section{
 height: 650px;
 width: 100%;
 background-image: url(https://wallpaper.dog/large/5445110.jpg);
 background-position: bottom;
 background-attachment: fixed;
 background-size: cover;
 }.section h2{
 text-align:left;
 color: #E8D5C4;
 position: absolute;
 top: 50%;
 left:50%;
 transform: translate(-50%, -50%);
 font-size: 25px;
 user-select: none;
 transition:1s;
 padding: 20px;
 }.section h2:hover{
 background-color: rgba(66, 5, 68, 0.24);
 box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
 }
.main-div__header{
 margin: 0 25%;
 text-align: center;
 margin-top: 30px;
 margin-bottom: 50px;
}.main-row{
 display: inline-block;
 width: 25%;
 padding: 30px;
 margin: 15px;
}.main{
 text-align: center;
}.main h3{
 color: #804674;
}.main-texts h3{
 margin-bottom: 30px;
}.main-row p{
 letter-spacing: 0.5px;
}.main-div__header p{
 margin-top: 20px;
}.photo{
 margin-left: 15%;
 display: inline-block;
 width: 30%;
 height: 400px;
 background-image: url(https://p4.wallpaperbetter.com/wallpaper/936/632/876/girl-butterfly-model-blonde-wallpaper-preview.jpg);
 background-repeat: no-repeat;
 background-position: center top;

}.aside{
 display: inline-block;
 width: calc(100% - 60%);
 background-color: #DBE2EF;
 min-height: 400px;
 vertical-align: top;
}.product{
 margin-top: 50px;
}.aside h2{
 font-family: system-ui;
 width: 100%;
 text-align: center;
 margin-top: 12%;
}.aside p{
 margin-left: 30px;
 margin-top: 40px;
 text-align: left;
 padding: 5px;
 font-family: system-ui;
 letter-spacing: 0.7px;
 word-spacing: 1px;
}.aside .btn{
 margin-left: 30px;
 background-color: #F38181;
 padding: 10px;
 font-size: 20px;
 color: white;
}.aside .btn a{
 text-decoration: none;
 color: white;
}.opt{
 display: inline-block;
 width: 25%;
 min-height: 200px;
 height: 300px;
 background-color: rgba(168, 169, 178, 0.38);
 text-align: center;
 float: left;
 margin: 40px;
 padding: 20px;
 border-radius: 20px;
 text-overflow: ellipsis;
 box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
 transition: box-shadow .6s;
}.opt:hover{
 box-shadow: rgba(0, 0, 0, 0.8) 0px 5px 15px;
}

.premium{
 margin: 0 auto;
 width: 1200px;
 box-sizing: border-box;
}.premium .title{
 margin-top: 100px;
 width: 100%;
 text-align: center;
 padding-bottom: 20px;
} ul{
 margin: 0;
 padding: 0;
 list-style-type: none;
}ul li{
 padding-bottom: 10px;
}.opt h3{
 margin-bottom: 30px;
}.price{
 margin-bottom: 20px;
}.buy{
 cursor: pointer;
 border: 3px solid white;
 background-color: #EB455F;
 width: 100px;
 height: 50px;
}.buy a{
 text-decoration: none;
 color: white;
}.rec-pack{
 background-color: #EDF1D6;
 color: tomato;
 padding: 8px;
 border-radius: 5px;

}.standart-pack{
 background-color: #3A98B9;
 color: white;
}.yukari{
 background-color: #898121;
 color: white;
 text-decoration:none;
 padding: 15px;
 border-radius: 100%;
 position: fixed;
 bottom: 20px;
 right:20px;
}.numbers{
 user-select:none;
 margin-top:50px;
 display:inline-block;
 height:200px;
 width: 100%;
 background-color:transparent;
}.film{
 float: left;
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 position: relative;
 transition: .5s;
}.dizi{
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 float: left;
 position: relative;
 transition: .5s;

}.belgesel{
 display: inline-block;
 height: 200px;
 width: 33.3%;
 background-color: #EB455F;
 float: left;
 position: relative;
 transition: .5s;

}.film-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.film-sayi span{
 font-size: 30px;
}.dizi-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.dizi-sayi span{
 font-size: 30px;
}.belgesel-sayi{
 color: white;
 font-size: 20px;
 position: absolute;
 top: 50%;
 left:50%;
 transform:translate(-50% ,-50%);
 text-align: center;
 transition: .5s;
}.belgesel-sayi span{
 font-size: 30px;
}.film:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.film:hover .film-sayi{
 font-size: 30px;
}.dizi:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.dizi:hover .dizi-sayi{
 font-size: 30px;
}.belgesel:hover{
 box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}.belgesel:hover .belgesel-sayi{
 font-size: 30px;
}

</style>
</head>
<body>
<header class="main-header">
<div class="navbar">
 <a href="Css-sites.html" class="main_logo">GetMovie.com</a>
 <div class="main-div">
 <ul class="main-div__items">
 <li class="main-div__item"><a href="Css-sites.html">Home</a></li>
 <li class="main-div__item"><a href="#">Get Movie</a></li>
 <li class="main-div__item"><a href="#">Say Hello</a></li>
 <li class="main-div__item main-div__item-login"><a href="about.html">About</a></li>
 </ul>
 </div>
</div>
</header>
<div class="section">
<h2>Welcome <br>
What would you like to watch today?</h2>
</div>
<main class="main">
 <div class="main-div__header">
 <h3>How it works</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
 </div>

 <div class = "main-texts">
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 <div class = "main-row">

 <h3>Register</h3>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua.</p>
 </div>
 </div>
</main>
<main class="product">
 <div class="photo"></div>
 <div class="aside">
 <h2>Get All Dresses</h2>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
 quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
 consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse</p>
 <button class="btn"><a href="https://www.zara.com/tr/en/man-suits-l808.html" target="_blank">
 Buy Now.
 </a></button>
 </div>
 <main class="premium">

 <h3 class="title">
 Become a Premium.
 </h3>
 <div class="free opt">
 <h3>Free</h3>
 <h4 class="price">Free</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The All Series</li>
 <li>Dowloand 1080p</li>
 </ul>
 <button class="buy"><a href="#">Be Free User</a></button>

 </div>

 <div class="Recommended opt standart-pack">
 <h3 class="rec-pack">Standart</h3>
 <h4 class="price">9.99 $</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The Some Series</li>
 </ul>

 <button class="buy"><a href="#">Be Standart User</a></button>

 </div>

 <div class="Premium opt">
 <h3>Premium</h3>
 <h4 class="price">19.99 $</h4>
 <ul>
 <li>Get Video</li>
 <li>Access The All Series</li>
 <li>Dowloand 1080p</li>
 </ul>
 <button class="buy"><a href="#">Be Premium User</a></button>

 </div>
 </main>
</main>
<div class="numbers">
 <div class="film">
 <div class="film-sayi">
 <h3>Film sayısı</h3>
 <span>715</span>
 </div>
 </div>

 <div class="dizi">
 <div class="dizi-sayi">
 <h3>Dizi sayısı</h3>
 <span>196</span>
 </div>
 </div>

 <div class="belgesel">
 <div class="belgesel-sayi">
 <h3> Üye Sayısı</h3>
 <span>15.000</span>
 </div>
 </div>
</div>
<a href="#" class="yukari">Up</a>
</body>
</html>

Site güzel aslında ama fontlar ve renkler uymamış ama uğraşılırsa güzel olur tabii üzülmeye gerek yok.

ErrorCorrection · 5 Mart 2023

canıko dedi:
Site güzel aslında ama fontlar ve renkler uymamış.

Renkler için pek uğraşmadım. Aslında kıyafet alışveriş sitesi formatından yapacağım.

GTA Carl Johnson dedi:
Boş ver, üzülme sonra daha iyisini yaparsın

Hocam ben nasıl daha iyi yaparım diye yazdım çoğu kişi direk kötü, dolandırıcı sitesi, kötü olmuş deyinci ister istemez moral bozuluyor.

canıko · 5 Mart 2023

ErrorCorrection dedi:
Renkler için pek uğraşmadım. Aslında kıyafet alışveriş sitesi formatından yapacağım.

Hocam ben nasıl daha iyi yaparım diye yazdım çoğu kişi direk kötü, dolandırıcı sitesi, kötü olmuş deyinci ister istemez moral bozuluyor.

Bence moralinin bozulması saçma onlara inat daha iyisini yapmayı dene.

ErrorCorrection · 5 Mart 2023

canıko dedi:
Bence moralinin bozulması saçma onlara inat daha iyisini yapmayı dene.

Öyle yapacağım da ben sadece biraz öneri istemiştim hocam.

E1Rhan · 5 Mart 2023

Netlify,Github Pages gibi sitelere yükleyip paylaşın daha iyi olur.

Web sitesi nasıl daha güzel hale getirilir?

GTA Carl Johnson

Picopat

ErrorCorrection

Hectopat

AslanBey340

Centipat

ErrorCorrection

Hectopat

GTA Carl Johnson

Picopat

canıko

Picopat

ErrorCorrection

Hectopat

canıko

Picopat

ErrorCorrection

Hectopat

E1Rhan

Megapat