Nauka CSS

**sam_wiesz_kto** · 07-06-2013

Witam.
Wiem, w sieci jest mnóstwo materiałów.
No właśnie... który z nich wybrać, co polecacie ?
Każda rada, wskazówka, podpowiedź jest na wagę złota.
Książki, kursy, strony ?
W jakim kierunku iść ? Może CSS nie jest dobrym pomysłem ? Wyczytałem, że po HTML'u warto przyswoić CSS, jeżeli to nie do końca dobry kierunek to prosiłbym o sprostowanie.
Mój plan/sytuacja wygląda tak :

Siedzę przy komputerze i czekam na klientów, nie gram w gry, nie mam facebooka i innych pożeraczy czasu, chcę ten czas spożytkować.
W przyszłości na pewno pójdę w stronę programowania, ale póki co tata ma firmę i potrzebuje zmienić stronę, nie ma pośpiechu, gdzieś za 6 miesięcy.
Uważam, że w 6 miesięcy można dużo się nauczyć.
CSS czy coś innego ? Co po CSS ?
Co myślicie ?
Tak jak napisałem, każda rada mile widziana.
Pozdrawiam.

**lame2** · 07-07-2013

Zacznij od typografii. HTML + CSS to tylko narzędzie.

Web Design is 95% Typography | Information Architects

**sam_wiesz_kto** · 07-07-2013

Napisał lame2

Zacznij od typografii. HTML + CSS to tylko narzędzie.

Web Design is 95% Typography | Information Architects

Super ! Właśnie o to chodziło.
Dzięki !

**sam_wiesz_kto** · 07-18-2013

Typografia jest tak obszernym tematem... im więcej czytam tym większą sprawę zdaję sobie z tego jak mało wiem.

Sprawdzam swoje umiejętności w praktyce, napisałem prostą stronę.

Kod HTML

Kod:

<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="utf-8">
<title>TYTUL STRONY</title>

<meta name="description" content=" OPIS STRONY">

<meta name="keywords" content =" POZYCJONOWANIE ">

<link href="css/main.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Lora">


</head>

<body>

<div id="wrapper">
<div id="header">
		<img src="img/lego.png" alt"OPIS"/>
</div>

<div id="menu">

<ul>
	<li><a href="index.html">Strona Główna</a></li>
	<li><a href="#">OPCJA</a>
		<ul>
			<li><a href="#" >PODOPCJA</a></li>
			<li><a href="#">PODOPCJA2</a></li>
			<li><a href="#">PODOPCJA3</a></li>
			<li><a href="#">PODOPCJA4</a></li>
			<li><a href="#">PODOPCJA5</a></li>
			<li><a href="#">PODOPCJA6</a></li>
		</ul>
		</li>
	<li><a href="#">Oferta</a>

		<ul>
			<li><a href="#">1</a></li>
			<li><a href="#">2</a></li>
			<li><a href="#">3</a></li>
	  		<li><a href="#">4</a></li>
			<li><a href="#">5</a></li>
		</ul>
		</li>

	<li><a href="#">AHAAA</a></li>
	<li><a href="#">Kontakt</a></li>
</ul>

</div>

<div id="content">


<p>JAKIS TAM TEKST</p>

<h1>NAGLOWEK</h1>




</div>
	<div id="footer">STOPKA</div>
</div>



</body>
</html>

CSS

Kod:

body{
	background-image: url(../img/tlo.jpg);
	background-repeat: repeat;
	color: #333333;
	font-family: 'Lora', serif;
    font-size: 1em; line-height: 1.5em;
	height: 900px;
	margin: 0;
	padding: 0 100px;
}
	
p {  margin: 0; padding: 0;}

h1, h2 { 
	color: #333333 ;
	padding: 0 20px;
	text-align: center;
}
	
#wrapper{
	background-color: white;
	margin: 0 auto;
	min-height: 100%;
	position: relative;
}
	
#content{
	margin: 10px;
	padding: 0;
}
	
#header{
background-color: #000;
width:100%;
}

#footer{
	bottom:0;
	background:#383838;
	color: #ebcc50;
	height:30px; 
	position:absolute;
	text-align: center;
	width:100%; 
}
/* menu */

#menu {

background: #444; 
color: #999;
font-family: sans-serif, lora;
font-size: 14px;
height: 44px;
margin: 0 auto;
position: relative;
width: 100%;
}

#menu ul {list-style-type: none;}

#menu ul li { 
float:left; 
position:relative;
}

#menu ul li a {
border-right:1px solid #000;
color: #999;
display: block;
padding: 10px;
text-align: center;
text-decoration: none;
}

#menu ul li a:hover {
background: #6B6B6B;
color: #fff;
}

#menu ul li ul { display:none; }

#menu ul li:hover ul { 
display:block; 
position:absolute;
}

#menu ul li:hover ul li a{ 
background: #624949; 
border-bottom: 1px solid #f2f2f2; 
border-right:none; 
color: #fff; 
display: block; 
width: 110px; 
}

#menu ul li:hover ul li:hover { 
background: #ffbd55; 
color: #fff;
}

Dałem 900px height dla BODY, by w przypadku małej ilości tekstu nie kończyła się 2cm pod logo

, dobrze to zrobiłem ?
Min-height przeciwnie... jak będzie dużo treści by rozciągała się w dół.

Problem mam z LOGO i MENU, a konkretnie z przestrzenią między tymi dwoma elementami. Widać to dokładnie na poniższym screenie.
Chodzi mi o ten biały pasek.

WAŻNE : nie chcę gotowej odpowiedzi, prosiłbym o jakąś wskazówkę, żebym sam do tego doszedł.
Z góry dzięki za pomoc.
Pozdro

menu.JPG

**lame2** · 07-18-2013

Zboczyłeś. Zostaw HTML, ucz się typografii, umiejętności praktykuj przy użyciu odpowiednich narzedzi, np. Axure czy Fireworks.
Znajomość HTML ani troche nie zrobi z Ciebie eksperta od typografii, usability, UI-designera (czy jak bys tego nie nazwal).
Specow od kodowania HTML jest sporo, nie zarobisz duzo bedac jednym z nich.

Axure

**sam_wiesz_kto** · 07-18-2013

Wielkie dzięki !

Trochę jestem zagubiony, bo na dzień dzisiejszy pracuję w ,,biurze", siedzę tu 12 godz. mam internet i komputer, klienci przychodzą na max 5-10 minut, także w ciągu tych 12godz. mam ok. 10 godz. luzu.
Nie lubię siedzieć bez celu na serwisach typu facebook, tylko inwestować w siebie, w rozwój, gospodarować czas, uczyć się, budować skilla.

Także dzięki za pokierowanie mną.
Na pewno sprawdzę wyżej wymienione programy,a typografia zawsze mnie interesowała, może nie w postaci online, ale przez kilka lat maluję regularnie graffiti, także litery to moja pasja poza komputerowa.
A litery to nie tylko litery, ale cała kompozycja, wszystko musi być dopracowane.

Napiszę coś tutaj czasami, chyba, że ktoś uzna to za spam, postaram się pisać rzeczy wnoszące coś.
Pozdro

**lame2** · 07-18-2013

Cóż, jeśli praca sprawia że czujesz się zagubiony, to nie bardzo wiem jak Ci pomóc ani dostosować program nauczania

**sam_wiesz_kto** · 07-19-2013

Standardowo źle sformułowałem swoją wypowiedź.

Zagubiony, w sensie nie wiedziałem za co się zabrać, czy skupić na stronach www czy może programach, bardziej zawsze interesowało mnie pisanie programów.
Kilka lat temu jak nie pogrążyłem się jeszcze to trochę czasu na C++ później Delphi poświęciłem.
Bardzo podobał mi się python, nawet z ciekawości w assemblerze coś tam potrafiłem zrobić, sprawdziłem wszystko, całe dnie przy komputerze siedziałem.
Później zacząłem za dużo myśleć o zbędnych sprawach co doprowadziło to uzależnienia się od alkoholu i innego syfu.

Typografia to najlepsze co mogłeś mi doradzić bo przyda się do wszystkiego, bardzo ważny, obszerny dział.

Pobrałem wersję testową axure rp pro 6.5, wczoraj opanowałem totalne podstawy typu płynne poruszanie się po programie.

Zaraz zrobię kilka tutoriali, żeby jeszcze płynniej się poruszać + poznać możliwości programu, no i wtedy będę próbował coś tam działać.

Gdybym kiedykolwiek napisał coś pozbawionego sensu, post nie miał ładu i składu, chaotyczny to prosiłbym o wyrozumiałość, od niedawna dopiero mój mózg pracuje w 100% bez zbędnych substancji.

Mam mega zapał do pracy. Dużo się nauczyłem w ciągu ostatnich lat takich życiowych spraw, głównie ucząc się od ludzi, którym bardzo wiele zawdzięczam.

Lubię przychodzić do pracy, moi znajomi, czasami ktoś z rodziny mówią, że jestem nienormalny... jak można lubić chodzić do pracy ?
Można, prosiłem szefa o możliwość pracy w niedziele, ale nie opłaca mu się, szkoda.
Praca idealna dla mnie na dzień dzisiejszy, komputer + rozmowa z ludźmi, dwie zajebiste rzeczy.
Dobra, dość tego pisania, czas leci.
Pozdro

**lame2** · 07-19-2013

Robi się nam pamiętnik, a forum nie jest do tego...

**jankes** · 09-16-2015

Ja swego czasu uczyłem się z tego kursu:
Kurs CSS3 zaawansowany / Web design / Kursy - Wydawnictwo Strefa Kursów - szkolenia wideo

Jest to już zaawansowany kurs oraz przekazuje wiele informacji tak więć jesli szukacie jakiegoś dobrego miejsca gdzie możecie sie nauczyć programować to jak najbardziej polecam.

Temat: Nauka CSS

Narzędzia wątku

Display

Nauka CSS

Zasady Postowania

Subskrybuj