bittner/about.html

## about.html
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Über das Projekt</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
    <div class="container">
        <h1>Über das Projekt</h1>

        <div class="row">
            <div class="col-4">
                <ul class="nav flex-column">
                    <li><a href="index.html">Willkommen bei diesem Projekt!</a></li>
                    <li><a href="links.html">Meine Links</a></li>
                    <li><a href="about.html">Über das Projekt</a></li>
                </ul>
            </div>

            <main class="col-8">
                <p>Dieses Projekt ist im Rahmen des SmartNinja-Kurses 2019 entstanden.</p>
            </main>
        </div>
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>

## index.html
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Mein erstes Projekt</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
    <div class="container">
        <h1>Mein erstes Projekt</h1>

        <div class="row">
            <div class="col-4">
                <ul class="nav flex-column">
                    <li><a href="index.html">Willkommen bei diesem Projekt!</a></li>
                    <li><a href="links.html">Meine Links</a></li>
                    <li><a href="about.html">Über das Projekt</a></li>
                </ul>
            </div>

            <main class="col-8">
                <h2>Herzlich Willkommen!</h2>

                <p>Schön, dass du hierher gefunden hast.</p>
                <p>Es gibt viel Neues zu entdecken.</p>
            </main>
        </div>
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>

## links.html
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Meine Linksammlung</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
    <div class="container">
        <h1>Meine Linksammlung</h1>

        <div class="row">
            <div class="col-4">
                <ul class="nav flex-column">
                    <li><a href="index.html">Willkommen bei diesem Projekt!</a></li>
                    <li><a href="links.html">Meine Links</a></li>
                    <li><a href="about.html">Über das Projekt</a></li>
                </ul>
            </div>

            <main>
                <h2>Keyboard Shortcuts</h2>

                <ol>
                    <li><a href="https://www.stichpunkt.de/tasten-kombinationen/uebersicht.pdf">Übersicht Tastenkombinationen</a> (PDF)</li>
                    <li><a href="https://www.shortcutfoo.com/app/dojos/pycharm-win/cheatsheet">PyCharm Cheat Sheet</a></li>
                </ol>

                <h2>HTML und CSS</h2>

                <ol>
                    <li><a href="https://www.w3schools.com/tags/tag_main.asp">Das main Tag</a> (und andere HTML5-Tags)</li>
                </ol>

                <h2>Projekte</h2>

                <ol>
                    <li><a href="https://gist.github.com/bittner/199885284bdd9ae58c4234ac87839e51">Mein Projekt-Gist</a> (GitHub)</li>
                </ol>
            </main>
        </div>
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>

## style.css
h1, h2, h3 {
    font-family: Arial;
}

ul {
    float: left;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 1em;
    height: 20em;
}
	<!DOCTYPE html>
	<html lang="de">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<title>Über das Projekt</title>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
	</head>
	<body>
	<div class="container">
	<h1>Über das Projekt</h1>

	<div class="row">
	<div class="col-4">
	<ul class="nav flex-column">
	<li><a href="index.html">Willkommen bei diesem Projekt!</a></li>
	<li><a href="links.html">Meine Links</a></li>
	<li><a href="about.html">Über das Projekt</a></li>
	</ul>
	</div>

	<main class="col-8">
	<p>Dieses Projekt ist im Rahmen des SmartNinja-Kurses 2019 entstanden.</p>
	</main>
	</div>
	</div>

	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
	</body>
	</html>
	h1, h2, h3 {
	font-family: Arial;
	}

	ul {
	float: left;
	margin-top: 0;
	margin-bottom: 0;
	margin-right: 1em;
	height: 20em;
	}