Diskuze: Fonty podporující češtinu / český text na webu
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
Zobrazeno 10 zpráv z 10.
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
Pravdepodobne spatny kodovani, mne to funguje v poradku, pridej toto do hlavicky, pokud v hlavicce nespecifikujes charset:
<meta charset="UTF-8"><!DOCTYPE html>
<html lang="cs-cz" >
<head>
<meta charset="utf-8">
<title>Jan Kozeluh</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<nav id="nav">
<button class="nav-icon"
id="nav-icon"><span></span></button>
<ul>
<li><a href="#home">home</a></li>
<li><a href="#about">about</a></li>
<li><a href="#blog">blog</a></li>
<li><a href="#contact">contact</a></li>
</ul>
</nav>
<section id="home">
<h2>Home</h2>
<p>.</p>
<p>.</p>
</section>
<section id="about">
<h2>about</h2>
<p>.</p>
<p>.</p>
</section>
<section id="blog">
<h2>O mne</h2>
<p>Snazím se.</p>
<p>.</p>
</section>
<section id="contact">
<h2>contact</h2>
<p><img src="Images/email.png" width=25px, height=20px,
alt="emailicon">honzik.kozeluh@seznam.cz</p>
<p class="konec">Layout author : Ines Montani,Web author : Jan
Kozeluh</p>
</section>
<script src="js/index.js"></script>
</body>
</html>
@import url(https://fonts.googleapis.com/css?…|Work+Sans:700);
box-sizing: border-box;
padding: 0;
margin: 0;
border: 0;
outline: 0;
}
html {
font-size: 10px;
}
body {
background: #111;
color: #fff;
font: bold 2.5rem/1.55 "osifont","EB Garamond", Garamond, Georgia,
sans-serif;
}
section {
padding: 12.5%;
width: 100%;
}
section:nth-of-type(even) {
background: #fff;
color: #111;
}
p {
margin-bottom: 2.5em;
}
a {
color: inherit;
text-decoration: none;
}
h2 {
font: bold 3.2rem "osifont",Garamond, Georgia, sans-serif;
text-transform: uppercase;
letter-spacing: 5px;
margin-bottom: 2em;
}
nav {
mix-blend-mode: difference;
z-index: 100;
}
nav ul {
position: fixed;
top: 60px;
right: 5px;
height: 100vh;
visibility: hidden;
pointer-events: none;
list-style: none;
width: 35px;
}
nav ul li {
font: bold 1.5rem "Arial Black", Gadget, sans-serif;
text-transform: uppercase;
letter-spacing: 2px;
padding: 0.75em 0;
-webkit-writing-mode: vertical-lr;
-ms-writing-mode: tb-lr;
writing-mode: vertical-lr;
}
nav.active ul {
visibility: visible;
pointer-events: initial;
transition-delay: 0.2s;
}
.nav-icon {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
cursor: pointer;
display: inline-block;
height: 35px;
position: fixed;
top: 15px;
right: 15px;
transition: background 0.3s;
width: 35px;
}
.nav-icon span {
position: absolute;
top: 15px;
left: 5px;
background: #fff;
display: block;
height: 3px;
right: 5px;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
.nav-icon span:before, .nav-icon span:after {
width: 100%;
height: 3px;
background: #fff;
content: "";
display: block;
left: 0;
position: absolute;
}
.nav-icon span:before {
top: -8px;
}
.nav-icon span:after {
bottom: -8px;
}
.active .nav-icon span {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.konec {
font-size:15px;
}
Děkuji moc teď jsem to konvertoval . Promiňte za ztrátu času jsem hňup.
Zobrazeno 10 zpráv z 10.