christian/SaS
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Create header.html

Browse Source
This commit is contained in:
Pentabyteman
2017-11-18 12:15:57 +01:00
committed by GitHub
parent 17ccfcd30b
commit 2c367f8c5c
1 changed files with 128 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web_dev/header.html
+128
View File
@@ -0,0 +1,128 @@
<div id=header>
<style>
#logo {
width: 90%;
padding-left: 2%;
padding-top: 2%;
}
.top-links {
color: #929292;
vertical-align: top;
padding-top: 5px;
text-align: center;
}
#logotablerow {
padding-right: 2%;
}
#search {
vertical-align: middle;
}
#search_icon {
width: 80%;
vertical-align: middle;
padding-left: 0px;
}
table{
border-collapse: collapse;
border: 1px solid black;
}
table tr{
border: 1px solid black;
vertical-align: top;
}
table td{
padding-left: 10px;
padding-top: 2px;
border: 1px solid black;
}
.link-container {
text-align: center;
width: 10%;
}
.allcenter {
vertical-align: middle;
text-align: right;
padding-right: 10px;
}
#search {
font-size: 16pt;
background: #D6D5D5;
color: black;
}
#search:focus{
font-size: 16pt;
background: #D6D5D5;
color: black;
outline: none;
}
ul {
list-style-type: none;
position: relative;
margin-left: 2%;
margin-top: 20px;
width: 96%;
background: #D6D5D5;
border: none;
}
li {
float: left;
width: 30%;
margin-top: 0.5%;
margin-bottom: 0.5%;
vertical-align: middle;
padding-left: 3%;
color: #929292;
}
li a {
display: block;
color: #666;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.active {
background: #9F2D17;
color: white;
}
li a:hover:not(.active) {
background: #929292;
}
</style>
<table class="table">
<tr>
<td id ="logotablerow", width="20%">
<img id="logo" src="apb_icon.jpeg" alt="logo">
</td>
<td class="link-container">
<a class="top-links", href="www.tagesschau.de">tagesschau.de</a>
</td>
<td class="link-container">
<a class="top-links", href="www.spiegel.de">spiegel.de</a>
</td>
<td class="link-container">
<a class="top-links", href="www.zeit.de">zeit.de</a>
</td>
<td class="link-container">
<a class="top-links", href="www.bpb.de">bpb.de</a>
</td>
<td vertical-align="middle", width="25%" class="allcenter">
<input type="text" id="search" maxlength="30" placeholder="Datenbank durchsuchen">
</td>
<td width="5%" class="allcenter">
<a href="https://www.dohiy.com/wp-content/uploads/2014/06/itsatrap.jpg"><img id="search_icon" src="search_icon.png" alt="search"></a>
</td>
</tr>
</table>
<div id="navigation">
<ul>
<li><a class="active" href="https://www.none.com">Gesetzesblatt</a></li>
<li><a href="https://www.none.com">Datenbank</a></li>
<li><a href="https://www.none.com">Mein Goethopia</a></li>
</ul>
</div>