tmeissner
/
meissner-wohnen
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

initial commit

master
T. Meissner 11 years ago
commit
a1f0ed0c51
20 changed files with 709 additions and 0 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +4
    -0
      .gitignore
  2. +91
    -0
      buchung.html
  3. +299
    -0
      css/style.css
  4. +45
    -0
      extras.html
  5. BIN
      images/header.jpg
  6. BIN
      images/transparent.png
  7. BIN
      images/willkommen.jpg
  8. BIN
      images/willkommen_links.jpg
  9. BIN
      images/willkommen_rechts.jpg
  10. BIN
      images/wohnung1.jpg
  11. BIN
      images/wohnung2.jpg
  12. BIN
      images/wohnung3.jpg
  13. BIN
      images/wohnung4.jpg
  14. BIN
      images/wohnung5.jpg
  15. BIN
      images/wohnung6.jpg
  16. BIN
      images/wohnung7.jpg
  17. BIN
      images/wohnung8.jpg
  18. +68
    -0
      index.html
  19. +82
    -0
      kontakt.html
  20. +120
    -0
      wohnung.html

+ 4
- 0
.gitignore View File

@ -0,0 +1,4 @@
.DS_Store
.idea
*.swp
*.*#*

+ 91
- 0
buchung.html View File

@ -0,0 +1,91 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="Ferienwohnung, Meißner, Weixdorf, Dresden, Übernachten">
<meta name="description" content="Ferienwohnung Meißner Buchungsanfrage - Gemütlich und günstig Übernachten in Dresden Weixdorf">
<meta name="author" content="Torsten Meißner">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="images/header.jpg" alt="Kirchteich Weixdorf" width="944" height="200">
<h1>Ferienwohnung Meißner</h1>
</div>
<div id="nav">
<ul>
<li><a class="nav-left" href="index.html">Startseite</a></li>
<li><a href="wohnung.html">Wohnung</a></li>
<li><a class="active" href="buchung.html">Preis/Anfrage</a></li>
<li><a href="kontakt.html">Lage/Kontakt</a></li>
<li><a class="nav-right" href="extras.html">Ausflüge</a></li>
</ul>
</div>
<div id="content">
<div id="content-left">
<h2>Buchungsanfrage</h2>
<h3>Das Buchungsformular ist in Arbeit.</h3>
<p>
Anfragen stellen Sie bitte vorläufig durch eine Email an unsere Adresse:
<a href="mailto:kontakt@meissner-wohnen.de">kontakt@meissner-wohnen.de</a>.
Auf unserem Profil bei
<a href="http://www.dresden-lodge.de/ferienwohnungen/dresden/1000693/ferienwohnung-meissner.php" rel="nofollow" target="_blank">Dresden-Lodge</a>
finden Sie auch den Belegungsplan.
</p>
</div>
<div id="content-right">
<h2>Preise</h2>
<h3>Übernachtung</h3>
<table>
<tr>
<th>Personen</th>
<th>Preis/Nacht</th>
</tr>
<tr>
<td>1</td>
<td>22€</td>
</tr>
<tr>
<td></td>
<td>20€ ab 14 Nächte</td>
</tr>
<tr>
<td>2</td>
<td>36€</td>
</tr>
<tr>
<td>3</td>
<td>46€</td>
</tr>
</table>
<h3>weitere Leistungen</h3>
<table>
<tr>
<td>Endreinigung</td>
<td>inkl.</td>
</tr>
<tr>
<td>Kinderbett</td>
<td>5€ (einmalig)</td>
</tr>
</table>
</div>
</div>
<div id="footer">
<div id="footer-left">&copy 2013 Ferienwohnung Meißner</div>
<div id="footer-right"><a href="index.html">Startseite</a><a href="kontakt.html">Kontakt</a><a href="kontakt.html">Impressum</a></div>
</div>
</div>
</body>
</html>

+ 299
- 0
css/style.css View File

@ -0,0 +1,299 @@
/* global styles */
body {
font-family: Verdana, Geneva, sans-serif;
background: #e8e8e8;
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
p {
padding: 0.25em;
}
h1, h2, h3, p {
margin: 0;
clear: both;
}
ul {
list-style-type: none;
}
table th {
text-align: left;
padding-right: 1em;
padding-bottom: 0.5em;
}
span.cursive {
font-family: cursive;
font-size: larger;
}
/* page area styles */
#wrapper {
background: #fff;
width: 960px;
margin: 15px auto;
overflow: hidden;
box-shadow: 0px 0px 6px 2px #bbb;
}
/* header styles */
#header {
position: relative;
margin: 8px 8px 0 8px;
padding: 0;
}
#header h1 {
position: absolute;
left: 10px;
bottom: 10px;
color: #fff;
/*text-shadow: -0.06em -0.06em 0.06em black,
0.04em 0.04em 0.06em white;*/
text-shadow: .05em .05em .05em #000;
}
#header img {
display: block;
}
/* navigation bar */
#nav {
margin: 8px 8px 0 8px;
overflow: hidden;
}
#nav ul {
margin: 0;
padding: 0;
}
#nav ul li {
float: left;
width: 20%;
}
#nav ul li a {
display: block;
padding: .5em 0.25em;
border-right: 1px solid black;
background-color: darkolivegreen;
color: white;
text-transform: uppercase;
text-shadow: #666 .1em .1em .1em;
font-weight: bold;
text-align: center;
}
#nav ul li a.nav-right {
border-right: none;
}
#nav ul li a:hover {
color: #ddd;
background-color: green;
}
#nav ul li a.active {
background-color: seagreen;
}
/* content styles */
#content {
overflow: hidden;
clear: left;
margin: 8px 8px 0 8px;
padding: 0 15px 15px 15px;
}
#content h2 {
color: darkolivegreen;
padding: .65em 0 .25em 0;
}
#content h3 {
padding: 0.5em 0 0.4em 0;
}
#content p {
padding: 0.25em 0em;
}
#content a {
color: black;
border-bottom: dotted 1px black;
}
#content a:hover {
color: #666;
}
#content #maps {
padding: 10px 0;
}
#content #index-img {
margin 0 auto;
padding-left: 10px;
}
#content #index-img img {
padding: 30px;
vertical-align: middle;
}
#content #index-img img.img-left {
-webkit-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg);
}
#content #index-img img.img-right {
-webkit-transform: rotate(5deg);
-moz-transform: rotate(5deg);
-o-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg);
}
#content #content-left {
float: left;
width: 68%;
}
#content #content-right {
float: right;
width: 30%
}
#content #content-right ul {
padding-left: 1em;
margin: 0.5em 0;
list-style-type: square;
}
#img-gallery {
float: left;
width: 540px;
padding: 0;
margin: 15px 0;
}
#gallery-big {
margin-bottom: 5px;
float: left;
}
#img-gallery img.gallery-small {
background: url(../images/transparent.png) center no-repeat;
width: 125px;
height: 100px;
float: left;
padding: 5px;
margin: 0;
border: 0px solid #D9D9D9;
}
#img-gallery img.gallery-small.gallery-left {
padding-left: 0;
}
#img-gallery a {
margin: 0;
padding: 0;
}
#img-gallery a span {
background: #fff;
display: none;
}
#img-gallery a:hover {
background: #fff;
padding: 0;
margin:0;
}
#img-gallery a:hover span {
margin: 0;
display: block;
position: relative;
top: 0;
left: 0;
height: 398px;
padding: 0;
border: 0 solid #D9D9D9;
z-index: 100;
background: no-repeat;
}
a#wohnung0:hover span {
background-image: url(../images/wohnung1.jpg);
}
a#wohnung1:hover span {
background-image: url(../images/wohnung2.jpg);
}
a#wohnung2:hover span {
background-image: url(../images/wohnung3.jpg);
}
a#wohnung3:hover span {
background-image: url(../images/wohnung4.jpg);
}
a#wohnung4:hover span {
background-image: url(../images/wohnung5.jpg);
}
a#wohnung5:hover span {
background-image: url(../images/wohnung6.jpg);
}
a#wohnung6:hover span {
background-image: url(../images/wohnung7.jpg);
}
a#wohnung7:hover span {
background-image: url(../images/wohnung8.jpg);
}
/* footer styles */
#footer {
clear: both;
margin: 8px;
padding-top: 7px;
border-top: solid 2px #bbb;
overflow: hidden;
font-size: small;
}
#footer-left {
float: left;
}
#footer-right {
float: right;
}
#footer-right a {
padding-left: 1em;
color: black;
}
#footer-right a:hover {
color: #666;
}

+ 45
- 0
extras.html View File

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="Ferienwohnung, Meissner, Meißner, Weixdorf, Dresden, Übernachten">
<meta name="description" content="Gemütlich und günstig Übernachten in Dresden Weixdorf">
<meta name="author" content="Torsten Meißner">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="images/header.jpg" alt="Kirchteich Weixdorf" width="944" height="200">
<h1>Ferienwohnung Meißner</h1>
</div>
<div id="nav">
<ul>
<li><a class="nav-left" href="index.html">Startseite</a></li>
<li><a href="wohnung.html">Wohnung</a></li>
<li><a href="buchung.html">Preis/Anfrage</a></li>
<li><a href="kontakt.html">Lage/Kontakt</a></li>
<li><a class="nav-right active" href="extras.html">Ausflüge</a></li>
</ul>
</div>
<div id="content">
<h2>Ausflüge</h2>
<h3>Die Ausflugstipps sind in Arbeit.</h3>
</div>
<div id="footer">
<div id="footer-left">&copy 2013 Ferienwohnung Meißner</div>
<div id="footer-right"><a href="index.html">Startseite</a><a href="kontakt.html">Kontakt</a><a href="kontakt.html">Impressum</a></div>
</div>
</div>
</body>
</html>

BIN
images/header.jpg View File

Before After
Width: 943  |  Height: 200  |  Size: 111 KiB

BIN
images/transparent.png View File

Before After
Width: 125  |  Height: 100  |  Size: 3.8 KiB

BIN
images/willkommen.jpg View File

Before After
Width: 300  |  Height: 225  |  Size: 28 KiB

BIN
images/willkommen_links.jpg View File

Before After
Width: 200  |  Height: 150  |  Size: 14 KiB

BIN
images/willkommen_rechts.jpg View File

Before After
Width: 200  |  Height: 150  |  Size: 18 KiB

BIN
images/wohnung1.jpg View File

Before After
Width: 530  |  Height: 397  |  Size: 59 KiB

BIN
images/wohnung2.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 55 KiB

BIN
images/wohnung3.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 52 KiB

BIN
images/wohnung4.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 58 KiB

BIN
images/wohnung5.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 45 KiB

BIN
images/wohnung6.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 52 KiB

BIN
images/wohnung7.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 51 KiB

BIN
images/wohnung8.jpg View File

Before After
Width: 530  |  Height: 398  |  Size: 46 KiB

+ 68
- 0
index.html View File

@ -0,0 +1,68 @@
<!DOCTYPE html>
<html>
<head>
<title>Ferienwohnung Meißner</title>
<meta charset="utf-8">
<meta name="keywords" content="Ferienwohnung, Meißner, Weixdorf, Dresden, Übernachten">
<meta name="description" content="Willkommen bei Ferienwohnung Meißner - Gemütlich und günstig Übernachten in Dresden Weixdorf">
<meta name="author" content="Torsten Meißner">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="images/header.jpg" alt="Kirchteich Weixdorf" width="944" height="200">
<h1>Ferienwohnung Meißner</h1>
</div>
<div id="nav">
<ul>
<li><a class="nav-left active" href="index.html">Startseite</a></li>
<li><a href="wohnung.html">Wohnung</a></li>
<li><a href="buchung.html">Preis/Anfrage</a></li>
<li><a href="kontakt.html">Lage/Kontakt</a></li>
<li><a class="nav-right" href="extras.html">Ausflüge</a></li>
</ul>
</div>
<div id="content">
<h2>Willkommen</h2>
<p>
Wir begrüßen Sie ganz herzlich auf der Webseite unserer Ferienwohnung.
</p>
<div id="index-img">
<img class="img-left" src="images/willkommen_links.jpg" alt="Goldener Reiter" width="200" height="150">
<img class="img-middle" src="images/willkommen.jpg" alt="Ferienwohnung Meißner" width="300" height="225">
<img class="img-right" src="images/willkommen_rechts.jpg" alt="Pastor-Roller Kirche" width="200" height="150">
</div>
<p>
Wir präsentieren Ihnen hier die <a href="wohnung.html">Räume und Ausstattung</a> unserer Ferienwohnung.
Desweiteren finden Sie Informationen zu den Preisen und die Möglichkeit, eine unverbindliche
<a href="buchung.html">Buchungsanfrage</a> zu stellen.
</p>
<p>
Als besonderes Extra werden
außerdem einige lohnenswerte <a href="extras.html">Ausflugsziele</a> in der Umgebung unserer Ferienwohnung vorgestellt.
Es gibt einiges zu entdecken im Norden von Dresden. Und natürlich auch in Sachsens Landeshauptstadt ...
</p>
<br/>
<p>
Viele Grüße von<br />
<span class="cursive">Familie Meißner</span>
</p>
</div>
<div id="footer">
<div id="footer-left">&copy 2013 Ferienwohnung Meißner</div>
<div id="footer-right"><a href="index.html">Startseite</a><a href="kontakt.html">Kontakt</a><a href="kontakt.html">Impressum</a></div>
</div>
</div>
</body>
</html>

+ 82
- 0
kontakt.html View File

@ -0,0 +1,82 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="Ferienwohnung, Meißner, Weixdorf, Dresden, Übernachten">
<meta name="description" content="Ferienwohnung Meißner Kontakt - Gemütlich und günstig Übernachten in Dresden Weixdorf">
<meta name="author" content="Torsten Meißner">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="images/header.jpg" alt="Kirchteich Weixdorf" width="944" height="200">
<h1>Ferienwohnung Meißner</h1>
</div>
<div id="nav">
<ul>
<li><a class="nav-left" href="index.html">Startseite</a></li>
<li><a href="wohnung.html">Wohnung</a></li>
<li><a href="buchung.html">Preis/Anfrage</a></li>
<li><a class="active" href="kontakt.html">Lage/Kontakt</a></li>
<li><a class="nav-right" href="extras.html">Ausflüge</a></li>
</ul>
</div>
<div id="content">
<h2>Anschrift</h2>
<h3>Ferienwohnung Meißner</h3>
<p>
Martina und Dieter Meißner<br />
Pastor-Roller-Straße 20<br />
01108 Dresden<br />
</p>
<br />
<table>
<tr>
<td>Telefon</td>
<td>+49 (0)351 8900797</td>
</tr>
<tr>
<td>E-Mail</td>
<td><a href="mailto:kontakt@meissner-wohnen.de">kontakt@meissner-wohnen.de</a></td>
</tr>
</table>
<br />
<p>
<a href="http://www.dresden-lodge.de/ferienwohnungen/dresden/1000693/ferienwohnung-meissner.php" rel="nofollow" target="_blank">Profil der Ferienwohnung bei Dresden-Lodge (mit Belegungsplan)</a>
</p>
<h2>Lage und Anfahrt</h2>
<div id="maps">
<iframe width="914" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"
src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q=ferienwohnung+mei%C3%9Fner,+pastor-roller-stra%C3%9Fe,+dresden&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=63.255964,135.263672&amp;ie=UTF8&amp;hq=ferienwohnung+mei%C3%9Fner,&amp;hnear=Pastor-Roller-Stra%C3%9Fe,+Weixdorf+01108+Dresden,+Deutschland&amp;t=m&amp;fll=51.150292,13.805169&amp;fspn=0.003119,0.008256&amp;st=110616160731137639226&amp;rq=1&amp;ev=zi&amp;split=1&amp;ll=51.152082,13.804021&amp;spn=0.016151,0.034332&amp;z=15&amp;iwloc=A&amp;output=embed">
</iframe><br />
<small>
<a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=de&amp;geocode=&amp;q=ferienwohnung+mei%C3%9Fner,+pastor-roller-stra%C3%9Fe,+dresden&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=63.255964,135.263672&amp;ie=UTF8&amp;hq=ferienwohnung+mei%C3%9Fner,&amp;hnear=Pastor-Roller-Stra%C3%9Fe,+Weixdorf+01108+Dresden,+Deutschland&amp;t=m&amp;fll=51.150292,13.805169&amp;fspn=0.003119,0.008256&amp;st=110616160731137639226&amp;rq=1&amp;ev=zi&amp;split=1&amp;ll=51.152082,13.804021&amp;spn=0.016151,0.034332&amp;z=15&amp;iwloc=A" style="text-align:left">Größere Kartenansicht</a>
</small>
</div>
<h3>Mit öffentlichem Nahverkehr</h3>
<p>
Straßenbahn: Linie 7 bis Endhaltestelle Weixdorf<br />
S-Bahn: SBS Richtung Königsbrück bis Haltepunkt Weixdorf
</p>
</div>
<div id="footer">
<div id="footer-left">&copy 2013 Ferienwohnung Meißner</div>
<div id="footer-right"><a href="index.html">Startseite</a><a href="kontakt.html">Kontakt</a><a href="kontakt.html">Impressum</a></div>
</div>
</div>
</body>
</html>

+ 120
- 0
wohnung.html View File

@ -0,0 +1,120 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="Ferienwohnung, Meißner, Weixdorf, Dresden, Übernachten">
<meta name="description" content="Ferienwohnung Meißner Ausstattung der Wohnung - Gemütlich und günstig Übernachten in Dresden Weixdorf">
<meta name="author" content="Torsten Meißner">
<link rel="stylesheet" href="css/style.css">
<!-- fixes problem with big gallery picture in IE8 -->
<!--[if IE 8]>
<style type="text/css">
#img-gallery a:hover span {
margin-top: -18px;
}
</style>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="images/header.jpg" alt="Kirchteich Weixdorf" width="944" height="200">
<h1>Ferienwohnung Meißner</h1>
</div>
<div id="nav">
<ul>
<li><a class="nav-left" href="index.html">Startseite</a></li>
<li><a class="active" href="wohnung.html">Wohnung</a></li>
<li><a href="buchung.html">Preis/Anfrage</a></li>
<li><a href="kontakt.html">Lage/Kontakt</a></li>
<li><a class="nav-right" href="extras.html">Ausflüge</a></li>
</ul>
</div>
<div id="content">
<div id="content-left">
<h2>Räume</h2>
<p>
Hier können Sie einige Bilder unserer Wohnung anschauen.
</p>
<div id="img-gallery">
<img id="gallery-big" src="images/wohnung1.jpg" alt="" width="530" height="398">
<a id="wohnung0"><img class="gallery-small gallery-left" src="images/wohnung1.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung1"><img class="gallery-small" src="images/wohnung2.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung2"><img class="gallery-small" src="images/wohnung3.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung3"><img class="gallery-small" src="images/wohnung4.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung4"><img class="gallery-small gallery-left" src="images/wohnung5.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung5"><img class="gallery-small" src="images/wohnung6.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung6"><img class="gallery-small" src="images/wohnung7.jpg" alt="" width="125" height="100">
<span></span>
</a>
<a id="wohnung7"><img class="gallery-small" src="images/wohnung8.jpg" alt="" width="125" height="100">
<span></span>
</a>
</div>
</div>
<div id="content-right">
<h2>Ausstattung</h2>
<p>
Unsere 2-Zimmer Ferienwohnung hat eine Wohnfläche von 41qm und ist funktional und gemütlich ausgestattet.
</p>
<p>
Sie befindet sich im 1. OG unseres Hauses und eignet sich für bis zu 3 Personen (plus einem Kleinkind).
</p>
<h3>Küche</h3>
<ul>
<li>Einbauküche</li>
<li>Herd, Kühlschrank, Toaster</li>
<li>Kaffeemaschine, Wasserkocher</li>
<li>Sitzecke zum Verweilen</li>
</ul>
<h3>Wohn- & Schlafzimmer</h3>
<ul>
<li>Doppelbett, Schlafsofa</li>
<li>Stubentisch mit Sitzen</li>
<li>Kommoden zum Verstauen</li>
<li>LCD-Fernseher, Musikanlage</li>
</ul>
<h3>Bad & Flur</h3>
<ul>
<li>Dusche</li>
<li>beleuchteter Badspiegel</li>
<li>Kleider- & Schuhschrank</li>
<li>Garderobe mit Spiegel</li>
</ul>
<h3>Allgemein</h3>
<ul>
<li>Internet über WLAN</li>
<li>PKW-Stellplatz</li>
<li>Garten mit Gartenmöbeln</li>
</ul>
</div>
</div>
<div id="footer">
<div id="footer-left">&copy 2013 Ferienwohnung Meißner</div>
<div id="footer-right"><a href="index.html">Startseite</a><a href="kontakt.html">Kontakt</a><a href="kontakt.html">Impressum</a></div>
</div>
</div>
</body>
</html>

Write Preview
Loading…
Cancel
Save