RDORDO
7th December 2005, 23:38
Salutare
Cine imi poate recomanda si mie niste resurse pentru invatarea aprofundarea lucrului cu css??
(si asupra stilului de lucru cu CSS)
Multumesc mult
add
7th December 2005, 23:40
again
7th December 2005, 23:45
RDORDO
7th December 2005, 23:48
Oau, that was fast.....MULTUMESC MULT
ma pun pe citit...
dar daca mai ai timp as mai avea o intrebare:
am ceva de genul:
reportstitle {
..........
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
color:#5566ff;
......
}
si apoi
<div class="reportstitle" align="left">
Un Scris Aici
</div>
Daca as vrea pentru cuvantul "SCRIS" sa am o alta culoare....este bine :
<div class="reportstitle" align="left">
Un <font color="#000099">scris </font> aici
</div>
sau e mai bine tot cu un div?
Meri mult inca o data
aolex
7th December 2005, 23:57
scrisul ala il faci paragraf sau header sau ce vrei tu ...
cat despre <div align='left'> , de ce mai folosesti css ?
#div {
text-align:left;
}
add
8th December 2005, 00:00
fara tagul FONT ... pune <span style="..."> </span>
evilone
8th December 2005, 00:02
Și mai bine ar fi să folosești tag-uri gen <em> sau <strong> și eventual să le aplici ălora CSS.
RDORDO
8th December 2005, 00:07
OK...am pricipit....acum revin la citit, invatat si la pus in practica....
multumesc mult inca o data
si tot respectul pentru calitate si rapiditate...respect!
Evil's Toy
8th December 2005, 00:13
uite si aici un curs accelerat de css
. e foarte bun pentru inceput si nu te pierzi in detalii plictisitoare.
RDORDO
9th December 2005, 00:20
Salut
Va mai deranjez cu o mica problema, daca aveti putin timp:
am in style.css :
.reportstitle {
width:600px;
height:25px;
vertical-align:bottom;
margin-top:30px;
margin-bottom:3px;
border-bottom-style:solid;
border-bottom-color:#990000;
border-bottom-width:1px;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
color:#5566ff;
text-indent:0px;
}
.reportsBox
{
width:600px;
margin-left:70px;
margin-bottom:30px;
border-bottom-style:solid;
border-bottom-color:#990000;
border-bottom-width:3px;
}
iar in pagina:
<div class="reportsBox">
<div class="reportstitle">
Titlu aici
</div>
</div>
In IE si Opera imi apare cum as fi vrut (adica scris Titlu aici subliniat cu 2 linii)......dar in Firefox apare sris textul fara nici o formatare .....de ce???? (sunt si eu la inceput in css asa ca fiti blanzi va rog
multumesc mult
i0nutzb
9th December 2005, 08:47
cred că ai o problemă
la mine arată la fel și în ie și în ff: titlu albastru, subliniat cu două linii...
hint: în loc de CODE
border-bottom-style:solid;
border-bottom-color:#990000;
border-bottom-width:3px;
poți scrie CODE
border-bottom:3px solid #990000;
RDORDO
9th December 2005, 10:06
Salut
Da, ai perfecta dreptate....problema era: atat timp cat aveam fisierul .css deschis in editor, in FF nu se vedea bine...cand am inchis fisierul din editor si-a revenit si in FF si de atunci merge bine
Multumesc mult si scuzati problema inexistenta
Si multumesc pentru hint
BoInG
10th December 2005, 00:41
Daca vrei ceva mult mai simplu pentru a invata CSS si ai si ceva viteza la download, iti recomand un tutorial video - il casesti pe torenti cautand dupa "css 2.0 lynda" ( 300mega )
RDORDO
28th December 2005, 14:43
Salutare
Revin si eu cu o intrebare, proabil stupida dar careia nu am reusit sa-i dau de cap
Presupunem o pagina nou complet goala. As vrea sa afisez un text, inconjurat de un chenar in centru paginii, folosind css
Am reusit textul
, chenarul si alinierea pe orizontata....M-am poticnit la alinerea pe verticala...Deci cum as putea sa fac astfel incat toata smecheria sa fie centrata pe mijlocul paginii, vertical? (banuiesc ca si la resize fereastr browser ramane centrata, nu? )
10q
aolex
28th December 2005, 15:58
cu div-uri e ceva mai greu folosind DOAR css dar din moment ce pe orizontala merge cu margin:0 auto;, un margin:auto; ar trebui (!!teoretic!!) sa faca acelasi lucru si pe verticala... incearca
!
RDORDO
28th December 2005, 16:35
Salut
Multumesc mult de tot pentru raspunsuri...dar sunt la inceputuri rau de tot asa ca m-ai cam pierdut prin ceata
Am incercat cu margin si din pacate nu am reusit . La partea cu alianiatul pe orizontala eu folosisem text-aling:center....ceea ce dupa cum zici nu era calea corect
Asa ca daca mai aveti putin timp:
1. Care este calea CORECTA de a realiza alinierea in centrul paginii, nu trebuie neaparat sa fie numai css, ci cum ati face voi daca ar trebui sa aveti o casuta de log in de exemplu asezata in centru paginii
2. @aolex....daca ai putin timp sa-mi explici mai clar la ce te-ai referit, mie personal cu margin nu mi-a mers nici un fel de aliniere
(
Multumesc mult de tot
aolex
28th December 2005, 16:45
pai hai sa vedem... un exemplu banal:
in css, avem un atribut cu valori. sa luam de exemplu padding.
padding:5px;
din moment ce avem doar 1 valoare, ea se aplica celor 4 (top, right, bottom si left). daca vrem padding de 5 px sus si jos, iar in dreapta si stanga de 10px, punem asa:
padding:5px 10px;
daca vrem padding diferit in toate 4 directile, putem folosi:
padding:top right bottom left;
si anume:
padding:25px 10px 3px 101px;
nu uita, valorile merg in directia ceasului... incepi cu sus (ora 12), continui cu dreapta (ora 3) , mai departe ajungem jos (ora 6) si in sfarsit stanga (ora9)! acuma, sa revenim la margin... daca vrei sa centrezi un div pe orizontala (de la dreapta la stanga), un margin:0 auto; e de ajuns. sa vedem codul:
0 reprezinta marginile pentru top si bottom iar auto reprezinta valorile pentru stanga si dreapta pentru ca avem doar 2 valori, iti aduci aminte?
din moment ce codul de mai sus centreaza un div pe verticala, acest cod ar putea sa il centreze si pe orizontala:
margin:auto;
care este egal cu:
margin:auto auto;
care este egal cu:
margin:auto auto auto auto;
nu stiu daca merge (lene sa testez) dar teoretic ar trebui...
i0nutzb
28th December 2005, 16:55
pe verticală nu merge...
aș avea ceva completări...
margin:0 1px 2px;
înseamnă că ai 0 px top , 1 left&right și 2 bottom
margin 0 1px;
înseamnă că ai 0 top&bottom și 1 left&right
cred că cea mai simplă cale de a alinia vertical este să pui o imagine de 1px lățime și 100% înălțime...
RDORDO
28th December 2005, 17:15
Salut
Multumesc mult pentru raspuns si pentru rapiditate...adica la doar 10 minute toata explicatia aia, tot respectul
Partea proasta e ca tot nu am reusit....am inteles ce ai zis dar din pacate nu mi-a mers....a mers pe orizontala dar pe verticala tot nu merge
Un test scris nu prea frumos dar care ilustreaza este
<body>
<div style="margin:auto; width:200px; height:200px;">
Cucu Rigu
</div>
</body>
Chestia asta imi centreaza pe mijlocul paginii, dar numai pe orizontala....pe verticala este in partea de sus a paginii
aolex
28th December 2005, 17:28
inseamna ca nu se poate, cu toate ca teoretic...
.
RDORDO
28th December 2005, 17:30
Aha, ok.....
dar atunci care ar fi solutia? un tabel cu height de 100% si vertical align pe mijloc?
10x a lot
i0nutzb
28th December 2005, 17:52
CODE
<body>
<div style="vertical-align:middle;">
<img src="spacer.gif" width="1" height="100%" alt="" align="middle" />
<div style="margin:auto; width:200px; height:200px;">
Cucu Rigu
</div>
</div> <!-- /wrapper -->
</body>
așa ar trebui să meargă...
să existe spacer.gif în directorul html
sebulbus
28th December 2005, 18:24
spacer.gif degeats the purpose of css.
ok, nu merge centrarea pe verticala din urmatorul motiv:
priviti pagina ca ceea ce se vede prin viewportul browserului. dar de fapt pagina trebuie privita ca rola de banda dintr-o caseta, tu vezi portiunea curenta (presupunem ca esti la un capat) dar se poate derula in jos, aducand o alta portiune in vizibil.
ca atare, mijlocul a ce? si astfel s-a elimintat alinierea verticala.
daca vrei un surogat de centrare pe verticala, da-i un padding-top sau un margin-top si un height fix. tinteste pe rezolutia cea mai folosita si hope for the best.
aolex
28th December 2005, 19:56
sau lucreaza in procente...
RDORDO
28th December 2005, 20:01
Salut
si o ultima intrebare legata de problema:
Care dintre urmatoarele 2 solutii ar fi mai "buna"(in concordanta cu noile "standarde", directii)???
1. cea propusa de ionutzb SAU
2.
<body>
<table height="100%">
<tr>
<td valign="middle">
<DIV style="margin:auto; border:2px; width:120px;">
Cucu bau
</DIV>
</td>
</tr>
</table>
</body>
Multumesc mult
@sebulbus: in varianta propusa de tine, pe langa rezumarea la o singura rezolutie, in momentul redimensionarii ferestrei browserului nu se mai pastreaza pozitionarea centrara, nu?
Aceasta este o versiune simplificată a paginii originale. Pentru a vizita versiunea originala
click aici.