Skip to content

odev yapıldı #8

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
emreozenses wants to merge 4 commits into
base: main
Choose a base branch
from
Open

odev yapıldı #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
759f336
html baslik duzenleme
emreozenses Aug 17, 2023
094cc75
html kodları girildi
emreozenses Aug 18, 2023
4248777
görev tamam
emreozenses Aug 18, 2023
b686fa1
odev yuklendi
emreozenses Aug 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .vscode/settings.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"editor.fontFamily": "Consolas, 'Courier New', monospace, 'Roboto Mono', 'Chelsea Market'"
}
146 changes: 146 additions & 0 deletions index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,146 @@
html {
font-size: 62.5%;
}
.container {
background-color: white;
width: 100%;
}
.header {
margin: 2% 0;
}
#nav1 {
text-align: center;
width: 100%;
height: 5%;
}
#a1 {
margin: 1rem 10% 1rem 5%;
width: auto;
flex-wrap: nowrap;
background-color: #ff764e;
padding: 1rem 3rem 1rem 3rem;
color: white;
border-radius: 1rem;
font-family: "Roboto Mono";
}
#a2 {
margin: 1rem 10% 1rem 10%;
width: auto;
background-color: #5ed3eb;
padding: 1rem 3rem 1rem 3rem;
color: white;
border-radius: 1rem;
font-family: "Roboto Mono";
}
#a3 {
margin: 1rem 5% 1rem 10%;
width: auto;
background-color: #ffcd69;
padding: 1rem 3rem 1rem 3rem;
color: white;
border-radius: 1rem;
font-family: "Roboto Mono";
}
footer {
text-align: center;
vertical-align: middle;
width: 100%;
height: 5rem;
background-color: #f9e7dc;
padding-top: 1rem;
padding-bottom: 1rem;
}
#imgf1 {
width: 100%;
margin: 0rem;
}
#img {
height: 15rem;
width: 100%;
overflow: hidden;

background-color: #f9e7dc;
}
#a4 {
margin: 1rem 20% 1rem 5%;
width: 1rem;
background-color: #ff764e;
padding: 0.5rem 5rem 0.5rem 2rem;
color: white;
border-radius: 1rem;
display: inline-block;
vertical-align: middle;
font-family: "Roboto Mono";
}
#a5 {
margin: 1rem 5% 1rem 5%;
width: auto;
background-color: #5ed3eb;
padding: 1rem 3rem 1rem 3rem;
color: white;
border-radius: 1rem;
vertical-align: baseline;
font-family: "Roboto Mono";
}
#a6 {
margin: 1rem 5% 1rem 20%;
width: auto;
background-color: #ffcd69;
padding: 1rem 3rem 1rem 3rem;
color: white;
border-radius: 1rem;
vertical-align: baseline;
font-family: "Roboto Mono";
}
#imgh1 {
width: 25%;
height: 25½;
border-radius: 100%;
display: inline-block;
margin-right: 10rem;
text-align: left;
}
#sh {
display: inline-block;
font-family: "Chelsea Market";
text-align: center;
padding-top: 1rem;
vertical-align: top;
margin-left: 10%;
}
.sh1 {
font-size: 2rem;
}
.subHeader {
vertical-align: top;
text-align: left;
margin: 5rem;
}
.main {
background-color: #ddb9a3;
margin: 5rem;
text-align: center;
color: white;
padding-top: 1rem;
padding-bottom: 1rem;
font-family: "Roboto Mono";
}
.content1 {
font-family: "Roboto Mono";
text-align: center;
width: 25%;
height: 25%;
padding-left: 40%;
}
.content2 {
font-family: "Roboto Mono";
width: 25%;
height: 25%;
padding-left: 40%;
text-align: center;
padding-bottom: 3rem;
}
object {
width: 40%;
height: 40%;
}
201 changes: 150 additions & 51 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,55 +1,154 @@
<!-- Aşağıdaki içerikleri CSS ile biçimlendirerek etiketleyin. -->
<!DOCTYPE html>
<html lang="tr">
<head>
<!-- Link your CSS stylesheet -->

</head>
<body>

Gezinizi Planlayın

Bilgi edinin

Karşılaştırın

<!-- "header_img.jpg" -->

Peri Bacaları Tanıtımı

Gelin ve Nevşehir'in gizli güzelliklerini keşfedin.
Sürekli açık. Ziyaret için rezervasyona gerek yoktur.



Sadece ülkemizin değil, dünyanın en gizemli yerlerinden biri olan Kapadokya’yı gezerken derin bir merak duyduğunuzu biliyoruz. ‘ Peri bacaları nasıl oluştu, insanlar peri bacalarının içlerini ustalıkla nasıl oydu, bu yeraltı şehirlerini kimler yaptı, o kadar insan yerin altında nasıl yaşadı ’ diye binlerce soru geliyor gezginin aklına.


Peri bacaları oluşumunun bilimsel açıklaması olmasına rağmen mistik havasının da şöyle düşündürdüğü biliyoruz; ‘Kapadokya eskiden perilerin cenneti miydi, yoksa doğa bir mucize mi göstermek istedi!’


<!-- "hot-air-balloon.svg" -->


Kapadokya denilince akla ilk gelen şeylerden birisi de şüphesiz sıcak hava balonları ile yapılan turlar. Her sabah gün doğumundan önce yüzlerce sıcak hava balonlarından oluşan konvoy ile Kapadokya’nın eşsiz güzellikteki manzaralarını havadan izlemek katılımcılar için gerçekten olağanüstü ve rüya gibi bir deneyim.


<!-- "atv.svg" -->


ATV turları, Kapadokya’yı gezmenin heyecan verici, eğlenceli ve farklı bir yoludur. Bölgenin eşsiz ve muhteşem vadileri, dünyanın en iyi ATV turlarından birini deneyimlemenize fırsat verir. ATV turlarının herkes için uygun bir aktivite olduğunu söylemeliyiz.



<!-- "footer_img.png" -->



Gezinizi Planlayın

Bilgi edinin

Karşılaştırın

</body>
<head>
<style>
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
</style>
<link rel="stylesheet" href="index.css" />
<link href="https://fonts.google.com/specimen/Chelsea+Market" rel="stylesheet">
<link href="https://fonts.google.com/specimen/Roboto+Mono" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="header">
<nav id="nav1">
<a id="a1">Gezinizi Planlayın</a>
<a id="a2">Bilgi Edinin</a>
<a id="a3">Karşılaştırın</a>
</nav>
</div>
<div class="subHeader">
<img id="imgh1" src="/assets/header_img.jpg">
<p id="sh"><b class="sh1">Peri Bacaları Tanıtımı</b></br></br>
Gelin ve Nevşehir'in gizli güzelliklerini keşfedin.</br>
Sürekli açık. Ziyaret için rezervasyona gerek yoktur.</p>
</div>
<div class="main">
<p>Sadece ülkemizin değil, dünyanın en gizemli yerlerinden biri olan
Kapadokya’yı gezerken derin bir merak duyduğunuzu biliyoruz. ‘ Peri
bacaları nasıl oluştu, insanlar peri bacalarının içlerini ustalıkla
nasıl oydu, bu yeraltı şehirlerini kimler yaptı, o kadar insan yerin
altında nasıl yaşadı ’ diye binlerce soru geliyor gezginin aklına.</br></br> Peri
bacaları oluşumunun bilimsel açıklaması olmasına rağmen mistik havasının
da şöyle düşündürdüğü biliyoruz; ‘Kapadokya eskiden perilerin cenneti
miydi, yoksa doğa bir mucize mi göstermek istedi!’</p>
</div>
<div class="content1">
<!-- "hot-air-balloon.svg" -->
<object data="/assets/hot-air-balloon.svg"></object>
<p>
Kapadokya denilince akla ilk gelen şeylerden birisi de şüphesiz sıcak
hava balonları ile yapılan turlar. Her sabah gün doğumundan önce
yüzlerce sıcak hava balonlarından oluşan konvoy ile Kapadokya’nın eşsiz
güzellikteki manzaralarını havadan izlemek katılımcılar için gerçekten
olağanüstü ve rüya gibi bir deneyim.</p>
</div>
<div class="content2">
<!-- "atv.svg" -->
<object data="assets/atv.svg"></object>
<p>
ATV turları, Kapadokya’yı gezmenin heyecan verici, eğlenceli ve farklı
bir yoludur. Bölgenin eşsiz ve muhteşem vadileri, dünyanın en iyi ATV
turlarından birini deneyimlemenize fırsat verir. ATV turlarının herkes
için uygun bir aktivite olduğunu söylemeliyiz.</p>
</div>
<div id="img">
<img id="imgf1" src="/assets/footer_img.jpg">
</div>
<footer>
<a id="a4">Gezinizi Planlayın</a>
<a id="a5">Bilgi Edinin</a>
<a id="a6">Karşılaştırın</a>
</footer>
</div>
</div>
</body>
</html>
Binary file added odev-teslim/odev teslim.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.