- Posts: 9
- Thank you received: 7
CSS Codes
- erol.koc
- Topic Author
- Offline
- Junior Member
Less
More
6 years 6 months ago #232
by erol.koc
CSS Codes was created by erol.koc
Liebe TeilnehmerInnen,
anbei sind die heute durchgearbeiteten Dateien:
Einmal webseite.html
Einmal style.css
Viel Spass beim Weiterverändern!
anbei sind die heute durchgearbeiteten Dateien:
Einmal webseite.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<title>Meine WM-Seite</title>
</head>
<body>
<img class="center" src="wm2018.jpg" alt="WM Logo">
<h1>FIFA WM 2018</h1>
<p>Die Endrunde der Fußball-Weltmeisterschaft 2018 (englisch 2018 FIFA World Cup) ist die 21.
Austragung des bedeutendsten Turniers für Fußball-Nationalmannschaften und findet vom 14. Juni bis zum 15. Juli 2018
in Russland statt.</p>
<h2><span class="gruppe">Gruppe A</span></h2>
<p>Das sind die Mannschaften in der Gruppe A:</p>
<p class="laender">Russland<br><span id="favorit">Uruguay</span><br>Ägypten<br>Saudi Arabien</p>
<h2><span class="gruppe">Gruppe B</span></h2>
<p>Das sind die Mannschaften in der Gruppe B:</p>
<p class="laender">Portugal<br><span id="favorit">Spanien</span><br>Marokko<br>Iran</p>
<p>Hier geht es zur <a href="https://de.fifa.com/worldcup" target=”_blank”>FIFA-Webseite</a></p>
<p>Bla bla bla
</body>
</html>
Einmal style.css
body {
background-color: lightblue;
font-family: sans-serif;
}
h1 {
background-color: DodgerBlue;
color: white;
text-align: center;
}
/*h2 {
border:5px solid Tomato;
}*/
.gruppe {
border-width: 4px;
border-style: solid;
border-color: Tomato;
border-radius: 12px;
}
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
p {
margin: 10px;
text-align: justify;
}
#favorit {
background-color: yellow;
}
.laender {
text-transform: uppercase;
font-size: 1.4em;
}
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 14px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}
Viel Spass beim Weiterverändern!
The following user(s) said Thank You: franz
Please Anmelden to join the conversation.
Moderators: ivan.gula, gozde.taskaya