Ki ért a css-hez?
A probléma a következő:
nem értek a css-hez, de weboldalra lenne szükségem...a html jól megy, de a css-hez egyáltalán nem értek...
valaki le írná, hogy hová kell ilyeneket tenni:
;
(
plusz leírnátok néhány css kódot pl.:
hogyan kell lebegtetni????
ezt elmagyaráznátok? Az alapoktól??
És ne osszatok meg oldalakat semmire nem megyek velük...
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz1.png)
![*](http://static.gyakorikerdesek.hu/p/vsz0.png)
Teljes CSS oktatást itt nem fogsz kapni.
[link] egy nagyon jó referencia lesz neked.
Lebegtetni a float vagy position: absolute opciókkal lehet. Ezeket is megtalálod a fenti linken.
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz0.png)
"hogyan kell lebegtetni????"
[link] :-D
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz0.png)
A CSS (Cascading Style Sheets) egy stílusleíró nyelv.
Többféle módon lehet meghívni, használni.
Általános stílust mely minden oldalon ugyan az, külön CSS fájlban szokás tárolni.
Melyet a HTML <HEAD> részén belül hívhatunk meg egy <LINK> tag -el.
<link rel="stylesheet" type="text/css" href="/sajat.css" />
Ezen kívül, egy-egy oldal módosítására használhatunk forráskódba definiált stílust is, ezt is a <HEAD> tag -ek közé kell rakni a <STYLE> elemet, és annak nyitó és záró tagja közé a CSS kódot.
<style type="text/css">
html, body { padding: 0px; margin: 0px; }
p { margin:0px; margin-bottom: 1.5em; }
</style>
Illetve az egyedi formázások esetében a formázni kívánt HTML elemnek kell megadni egy STYLE attribútumot és abban értékként a CSS formázásokat.
pl. <div style="margin: 5px; padding: 3px;">text...</div>
A pontosvessző formázási elemek elválasztásához kell, ezzel különölnek el az egyes css elemek.
A kerek zárójel speciális css paraméterekhez szokták használni, több paramétert is tartalmazhat, és valami funkciót lát el. pl.: background-image: url('hatterkep.jpg'); background-color: rgba(0,0,0,0.7);
De pl. responsive design készítésénél is szokták használni, mikor felbontás alapján adják meg a CSS -t.
pl.
@media all and (min-width: 800px) and (max-width: 1024px) {
html, body { /* stílus */ }
}
A lebegtetés elég sokoldalú lehet, de nézünk két egyszerűt.
Az első amikor a weboldal egy fix pontján a többi szöveg felet van, a többi elemtől függetlenül.
<style type="text/css">
div.lebego1 { position: absolute; top: 100px; left: 100px; z-index: 1; width: 320px; height: 240px; background-color: rgba(0,0,0,0.5); }
</style>
<div class="lebego1">text...</div>
A másik lehetőség mikor nem a weboldalhoz, hanem az ablakohoz viszonyítva lebeg, ilyenkor a görgetéstől is független, és állandó helyet foglal el.
<style type="text/css">
div.lebego2 { position: fixed; top: 0px; left: 0px; z-index: 2; width: 100%; height: 50px; background-color: rgba(0,150,0,0.7); }
</style>
<div class="lebego2">text...</div>
Részletesebb, és átfogóbb ismereteket az első hozzászóló linkjéről kiindulva találhatsz.
CSS olyan sok oldalú, változó és bővülő leírónyelv aminek újdonságait célszerű követni.
Sok jó dolgot meg lehet benne könnyedén csinálni kis gyakorlással. :-)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz2.png)
![*](http://static.gyakorikerdesek.hu/p/vsz1.png)
az első válaszban írt oldalt pedig vedd alapnak, azt muszáj tudni. Nagyon jól bemutatja az egyes dolgokat, példával is, amibe bele tudsz nyúlni.
css-ben a html elemeket tudod ugye formázni.
div, #id, .class {
/* ebben a blokkban most a dokumentumon található összes div-et, class="class" osztályú elemet, és az id="id" azonosítójú elemet tudod formázni */
/* attribútum: érték; formában */
background: #000; /* fekete háttér, többféle kóddal tudod megadni a színeket, általában hexa vagy rgb(a) formában szokták (#000 = rgb(0,0,0); */
}
#menu li{
/* itt minden li elemet formázol, ami a menu id-jú elemen belül van */
}
kezdésnél nagyon összezavarhat, amikor egy elemet nem is formáztál, de még sem úgy néz ki, ahogy szeretnéd. Ez a böngészők alap formázása. Pl a címsoroknak van alap marginja. Resetelni szokták ezeket az alap tulajdonságokat.
További kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!