andy
/
webdev
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

design & style

master
Andy 2020-02-25 20:46:00 +01:00
parent 9c71230f7f
commit 08ab8183ab
7 changed files with 68 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -29,6 +29,7 @@
* [Seitenstruktur](html/struktur.html)
* [Kopfbereich](html/header.html)
* [Formulare](html/formular.html)
* [Navigation](html/navigation.html)
## CSS
### CSS Lernen

4
css/style.css
View File

@ -20,7 +20,9 @@ header img{
padding-top: 62px;
float: left;
}
nav ul{
margin: 0;
}
nav li{
display: inline;
line-height: 160px;

22
html/formular.html
View File

@ -6,21 +6,27 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Die HTML -HEADER Struktur in Webseiten">
<title>Der HEADER in der HTML Struktur</title>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/code.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body>
<header>
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
</nav>
<div class="wrapper">
<img src="../img/logo_w.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
<ul>
<li><a href="../index.html">Home</a></li>
<li><a href="semantik.html">Semantik</a></li>
<li><a href="formulare.html">Formulare</a></li>
</ul>
</nav>
</div>
</header>
<main role="main">
<header>
<main role="main" class="wrapper">
<h1>HTML Formulare</h1>
</header>
<p>Ein Webformular ist ein Formular auf einer Webseite zur Erfassung von Daten, die zur Verarbeitung an einen
Webserver gesendet werden. Man findet sie beispielsweise in Webmail-Anwendungen,
Suchmaschineneingabefeldern, in Sozialen Netzwerken oder auf Login-Seiten. Das Absenden der Daten verläuft
@ -42,7 +48,9 @@
</main>
<footer>
<a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a>
<div class="wrapper">
<p><a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a></p>
</div>
</footer>
<script src="../js/code.js"></script>
</body>

19
html/header.html
View File

@ -6,16 +6,25 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Die HTML -HEADER Struktur in Webseiten">
<title>Der HEADER in der HTML Struktur</title>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/code.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body>
<header>
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
<div class="wrapper">
<img src="../img/logo_w.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
<ul>
<li><a href="../index.html">Home</a></li>
<li><a href="semantik.html">Semantik</a></li>
<li><a href="formulare.html">Formulare</a></li>
</ul>
</nav>
</div>
</header>
<main role="main">
<main role="main" class="wrapper">
<h1>Der HEADER in der HTML Struktur</h1>
<article>
<h2>Was gehört in den Kopf der HTML-Datei?</h2>
@ -52,7 +61,9 @@
</main>
<footer>
<a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a>
<div class="wrapper">
<p><a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a></p>
</div>
</footer>
<script src="../js/code.js"></script>
</body>

22
html/semantik.html
View File

@ -6,21 +6,27 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Die HTML -HEADER Struktur in Webseiten">
<title>Der HEADER in der HTML Struktur</title>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/code.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body>
<header>
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
</nav>
<div class="wrapper">
<img src="../img/logo_w.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
<ul>
<li><a href="../index.html">Home</a></li>
<li><a href="semantik.html">Semantik</a></li>
<li><a href="formulare.html">Formulare</a></li>
</ul>
</nav>
</div>
</header>
<main>
<header>
<main class="wrapper">
<h1>HTML Semantische Tags</h1>
</header>
<pre class="line-numbers language-html">
<code class=" language-html">&#60;abbr&#62; Abbreviation
&#60;acronym&#62; Acronym
@ -50,7 +56,9 @@
</pre>
</main>
<footer>
<a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a>
<div class="wrapper">
<p><a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a></p>
</div>
</footer>
<script src="../js/code.js"></script>
</body>

5
html/struktur.html
View File

@ -16,6 +16,11 @@
<div class="wrapper">
<img src="../img/logo_w.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
<ul>
<li><a href="../index.html">Home</a></li>
<li><a href="semantik.html">Semantik</a></li>
<li><a href="formulare.html">Formulare</a></li>
</ul>
</nav>
</div>
</header>

19
index.html
View File

@ -6,19 +6,26 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Die HTML Struktur in Webseiten">
<title>HTML Struktur</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/code.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<img src="img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
<div class="wrapper">
<img src="img/logo_w.svg" alt="Mein logo" title="Der Titel meines Bildes">
<nav role="navigation">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="html/semantik.html">Semantik</a></li>
<li><a href="html/formulare.html">Formulare</a></li>
</ul>
</nav>
</div>
</header>
<main role="main">
<main role="main" class="wrapper">
<h1 id="webdeveloper-links-tips">Webdeveloper Links &amp; Tips</h1>
<h2 id="html">HTML</h2>
<h3 id="html-lernen">HTML lernen</h3>
@ -57,6 +64,7 @@
<li><a href="html/struktur.html">Seitenstruktur</a></li>
<li><a href="html/header.html">Kopfbereich</a></li>
<li><a href="html/formular.html">Formulare</a></li>
<li><a href="html/navigation.html">Navigation</a></li>
</ul>
<h2>CSS</h2>
<h3>CSS Lernen</h3>
@ -83,7 +91,8 @@
</main>
<footer>
<a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a>
<div class="wrapper">
<p><a title="Link zu Download" href="https://git.perin.work/andy/webdev">Download</a></p></div>
</footer>
<script src="../js/code.js"></script>
<script src="js/code.js"></script>
</body>