| Autor | Zpráva | ||
|---|---|---|---|
| jouza Profil |
Zdravím, nemůžu nastylovat header, a h1, a nevím proč, nevím kde je chyba .. :(
Teprve se to učím, tak proto tak jednoduchý kod. :) Budu rád, když mi poradíte, kde mám chybu, abych se jí mohl příště vyvarovat, protože já jí prostě nevidím :/ Díky :-) HTML <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>HTML Basic Layout</title>
<link rek="stylesheet" type="text/css" href="css/styly.css">
</head>
<body>
<div id="conteiner">
<header>
<h1>This is Site</h1>
</header>
<nav>
<ul>
<li> <a href="#"></a>Menu Item</a></li>
<li> <a href="#"></a>Menu Item</a></li>
<li> <a href="#"></a>Menu Item</a></li>
<li> <a href="#"></a>Menu Item</a></li>
<li> <a href="#"></a>Menu Item</a></li>
</ul>
</nav>
<aside>
<article>
<h3>Sidebar</h3>
<p>This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.</p>
</article>
</aside>
<section>
<article>
<h3> Article title 1 </h3>
<p> This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. </p>
</article>
<hr />
<article>
<h3> Article title 1 </h3>
<p> This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. </p>
</article>
</section>
<footer>
<P> copyrightby <a href="#">FreeLancing Care</a></p>
</footer>
</div>
</body>
</html>CSS /* CSS Document */
html,body{margin:0; padding:0}
h1,h2,h3,h4,h5,h6{margin:0; padding:0}
ul{margin:0; padding:0}
header,nav,section,article,aside,footer{display:block;overflow:hidden}
/* conteiner */
#conteiner {
width: 900px;
margin: 0 auto;
display: block;
}
/* Top Header */
header {
background: #ccc;
}Bože, já jsem slepej ! .... <link rek="stylesheet" type="text/css" href="css/styly.css"> Díky, už to mám :d |
||
| Trejpa Profil |
jouza:
Element header nastylovaný je, pro nadpis žádné styly neuvádíš. Chybu v kódu vidím jen jednu a ta se stylování netýká: <li> <a href="#"></a>Menu Item</a></li> Živá ukázka tvého kódu beze změn. Aha, rel jsem přehlédl. |
||
| jouza Profil |
jj, dívám se na jednoho maníka, to on tak udělal ty odkazy, taky sem se tomu divil, ale myslel, jsem že to má své opodstatnění, nakonec to smazal, že udělal chybu, že to tam nemá co dělat :D
Jinak díky za rychlou reakci :) btw díky za editor, určitě ho využiji :) |
||
| jouza Profil |
Chtěl bych se ještě na něco zeptat, a nerad bych kvůli tomu zakládal další téma, když je to ta samá stránka .. :-)
kod je následující: HTML <!-- ten stejný -->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>HTML Basic Layout</title>
<link rel="stylesheet" type="text/css" href="css/styly.css">
</head>
<body>
<div id="conteiner">
<header>
<h1>This is Site</h1>
</header>
<nav>
<ul>
<li> <a href="#">Menu Item</a></li>
<li> <a href="#">Menu Item</a></li>
<li> <a href="#">Menu Item</a></li>
<li> <a href="#">Menu Item</a></li>
<li> <a href="#">Menu Item</a></li>
</ul>
</nav>
<aside>
<article>
<h3>Sidebar</h3>
<p>This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.This is Sidebar content.
This is Sidebar content.This is Sidebar content.This is Sidebar content.</p>
</article>
</aside>
<section>
<article>
<h3> Article title 1 </h3>
<p> This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. </p>
</article>
<hr />
<article>
<h3> Article title 1 </h3>
<p> This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. This is article 1 content. This is article 1 content.
This is article 1 content. This is article 1 content. </p>
</article>
</section>
<footer>
<P> copyrightby <a href="#">FreeLancing Care</a></p>
</footer>
</div>
</body>
</html>CSS /* CSS Document */
html,body{margin:0; padding:0}
h1,h2,h3,h4,h5,h6{margin:0; padding:0}
ul{margin:0; padding:0}
header,nav,section,article,aside,footer{display:block;overflow:hidden}
/* conteiner */
#conteiner {
width: 900px;
margin: 0 auto;
display: block;
}
/* Top Header */
header {
background: #ccc;
padding: 16px 20px;
}
header h1 {
color: #fff;
text-shadow: 1px 1px 1px #000;
}
/* menu*/
nav {
/* float: left; */
width: 100%;
display: block;
margin: 0 auto;
background-color: rgb(148,148,148);
}
nav ul{
list-style: outside none none;
width:100%;
}
nav > ul > li{
display:inline;
}
nav > ul > li > a{
color: #fff;
text-decoration: none;
padding: 10px 55px;
float: left;
border-right: 1px solid #8f867a;
}Zajímá mě, proč když tam přidám float: right;, tak ten text pod tím zmizí.
Nejspíš ten float špatně chápu, a rád bych věděl, proč udělal to co udělal. viz. sh. ctrlv.cz/gqCD 1. ctrlv.cz/0zMp 2. Díky :) Hádám, že jelikož je ten blok přes celou šířku, tak to vyhnalo vše ostatní někam do pryč, ale to je jen teorie .. :d podle mě by ten float neměl v tomhle případě dělat vůbec nic ... |
||
| Trejpa Profil |
#5 · Zasláno: 1. 12. 2016, 10:46:01
jouza:
Co to je za uchylárnu změnit položky seznamu na inline a odkazy v nich na block a nechat je plavat? Proč neplavou položky? Každopádně ten float nepoužíváš správně. Je vhodné uvnitř jednoho bloku nechat plavat zanořené bloky, které mají být vedle sebe a následujícím blokem plavání ukončit (clear). V rámci menu můžeš plavání ukončit třeba pomocí overflow. Větší plovoucí bloky mají pochopitelně nastavenou šířku. příklad Plavání vysvětluji v kódu příkladu Jednoduché schéma stránky. |
||
| jouza Profil |
Díky, mrknu na to :)
Na začátku toho "jednoduchého schématu" je toto /* Tohle a vhodné doctype (třeba žádné) sjednotí box model na okrajový: */
* {
-moz-box-sizing: border-box;
-khtml-box-sizing: border-box;
box-sizing: border-box;}to nestačí jenom {box-sizing: border-box;} ?
no.. vyzkouším to všechno a uvidím :) To envadí, že na té stránce chybí tag <head> and <body> ?Když na tím tak uvažuju, tak divy se už nepoužívají :(( |
||
| Tomášeek Profil |
#7 · Zasláno: 1. 12. 2016, 14:36:42
jouza:
„To envadí, že na té stránce chybí tag <head> and <body> ?“
Nechybí a ani chybět nemůže. Oba jsou v každém HTML dokumentu povinné, jen mají nepovinnou počíteční a koncovou značku. Doporučuji nahlédnout do DOMu, nebo do HTML specifikace. „Když na tím tak uvažuju, tak divy se už nepoužívají“ Eh? Samozřejmě, že používají. A na rozdíl od jiných fungují všude správně. |
||
| jouza Profil |
Já myslel, že je nahradily tagy jako
<header> <nav> <section> atd ..
Takže když budu dělat stránku, měl bych spíš používat divy nebo ty tagy z html5 ? |
||
| Tomášeek Profil |
#9 · Zasláno: 1. 12. 2016, 15:23:06
Ono to záleží na tobě.
IE8 a níže ty "nové" elementy neznají, čtečky s nimi budou mít problém, žádné výhody nepřinesou. Jsou jen nevýhody, proč je chceš používat (a dost možná i blbě)? Každý svého štěstí strůjcem. To o nahrazení něčeho něčím je blbost, div existuje i nadále, nemohl tedy být nahrazen. Jen se do HTML dostala další sada značek, které lze užít, s nevýhodami napsanými výše, s výhodami žádnými. |
||
| jouza Profil |
#10 · Zasláno: 1. 12. 2016, 15:54:21
Nemyslel jsem to tak, že nové tagy nahradily divy, ale že se od HTML5 používají místo <div id="hlavicka,paticka,leve menu, pravé menu atd." ty nové, které jsou přímo na to určené ... -_-
Myslím si, že kdybych je nepoužíval blbě, tak je snad v životě nemůžu používat správně ne ? Každý se učí, a každý dělá chyby, bez toho "abych je používal blbě" se je správně nenaučím ... Díky za pomoc, už si poradím ... |
||
|
Časová prodleva: 7 let
|
|||
0