skrabanek
/
html-uvod
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

css intro

master
Jakub Škrabánek 3 years ago
parent
a086d6ee3b
commit
271cd0b760
2 changed files with 108 additions and 50 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 113
      04/index.html
  2. 45
      04/style.css

113
04/index.html
View File

@ -1,51 +1,64 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cesty</title>
</head>
<body>
<h1>Cesty s Webhostingem u447</h1>
<h3>Cesty</h3>
<ul>
<li><a href="/u447/www/">HOME</a></li>
<li><a href="/u447/www/galerie/">Galerie</a>
<ul>
<li><a href="/u447/www/galerie/2020">2020</a>
<ul>
<li><a href="/u447/www/galerie/2020/foto1.html">Foto1</a></li>
<li><a href="/u447/www/galerie/2020/foto2.html">Foto2</a></li>
<li><a href="/u447/www/galerie/2020/foto3.html">Foto3</a></li>
</ul>
</li>
<li><a href="/u447/www/galerie/2021">2021</a>
<ul>
<li><a href="/u447/www/galerie/2021/foto1.html">Foto1</a></li>
<li><a href="/u447/www/galerie/2021/foto2.html">Foto2</a></li>
<li><a href="/u447/www/galerie/2021/foto3.html">Foto3</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="/u447/www/kontakty">Kontakty</a>
<ul>
<li><a href="/u447/www/kontakty/boss.html">Boss</a></li>
<li><a href="/u447/www/kontakty/littleboss.html">Little Boss</a></li>
<li><a href="/u447/www/kontakty/minions">Minions</a>
<ul>
<li><a href="/u447/www/kontakty/minions/mini1.html">Minion1</a></li>
<li><a href="/u447/www/kontakty/minions/mini2.html">Minion2</a></li>
<li><a href="/u447/www/kontakty/minions/mini3.html">Minion3</a></li>
<li><a href="/u447/www/kontakty/minions/mini4.html">Minion4</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</body>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS</title>
<link rel="stylesheet" href="style.css"> <!-- importovani CSS -->
<style>
/* CSS Kód */
</style>
</head>
<body>
<div class="wwwhead">
<h1 class="nadpis">Nadpis</h1>
<h1 class="nadpis2">Nadpis 2</h1>
<h3>Podnadpis</h3>
<ul>
<li><a href="#">ODKAZ1</a></li>
<li><a href="#">ODKAZ1</a></li>
</ul>
<p class="nadpis2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias quas corporis voluptates, dolorum quisquam accusamus sed obcaecati a sint asperiores odit quis doloremque soluta rerum distinctio aliquid pariatur. Est, officiis.</p>
<p class="nadpis2">Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut sunt suscipit laborum quidem, nisi veritatis a totam accusantium ab nam adipisci esse? Aperiam nihil impedit, natus praesentium laboriosam aut nam.</p>
<p class="nadpis2">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Atque voluptatem dicta commodi obcaecati veritatis sed sequi, similique id praesentium esse repellendus, suscipit rerum, ratione fuga itaque adipisci ex illum iste.</p>
<table>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</div>
</body>
</html>

45
04/style.css
View File

@ -0,0 +1,45 @@
/* CSS Kód */
.nadpis{
color:red;
font-size: 50px;
text-align: center;
}
.nadpis2 {
color: #1900ff;
font-size: 30px;
text-align: center;
}
p.nadpis2{
font-size: 20px;
}
.wwwhead{
width: 50%;
text-align: center;
border: 10px double black;
border-radius: 10px;
margin: auto;
padding: 0px 10px;
background-color: #6cd5ff;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
a{
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
table, th, td {
border: 2px solid;
margin-left: auto;
margin-right: auto;
border-collapse: collapse;
}
td {
width: 100px;
height: 100px;
}
Write Preview
Loading…
Cancel
Save