Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
"Noi nu furam ca romanii"

Canalele Sky Showtime 1 și S...

Recomandare anvelope lexus rx

Extindere rețea wireless int...
 Mufa TV

PPC Energy

Camera conferinta Tenveo tevo-vl12u

Recomandare rulouri exterioare us...
 Gaoyue 858

Telefon performant pe parte audio...

Aspecte legale https://registratu...

Filtru de apa curata apa de miner...
 Unde gasesc borcane mari 5 - litr...

sfat achiziție bicicleta pli...

NVIDIA Shield Programe Romania IP

Se opreste motorul in mers Golf 5
 

HTML si CSS

- - - - -
  • Please log in to reply
27 replies to this topic

#1
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006
Salutare!
In primul rand imi cer scuze daca a mai fost dezabatuta problema dar eu nu am gasit.La fel si daca am postat gresit.
Se da un index.htm.
<html>
<head>
 <title>Titlu</title>
 <link rel="stylesheet" type="text/css" href="style/style.css" />
</head>
<body>
<center>
		<div align="left" style="border:2px solid black;height:115px;width:976px">
			 <img src="images/logo.png" alt="Logo" height="115px" width="400px" />
		</div>
</center>
		<div align="center" style="border:2px solid black;margin:0px;padding:0px">
			 <img src="images/linegreen.png" alt="Linie verde" height="12px" width="976" />
		</div>

<center>
		<div class="menu">
			 <div class="button"><a href="coltul_vesel.php" title="Coltul vesel"><img src="images/button.png" alt="Coltul vesel" /><span>Coltul vesel</span></a></div>
			 <div class="button"><a href="electronica.php" title="Electronica"><img src="images/button.png" alt="Electronica" /><span>Electronica</span></a></div>
			 <div class="button"><a href="it_c.php" title="IT&C"><img src="images/button.png" alt="IT&C" /><span>IT&C</span></a></div>
			 <div class="button"><a href="curs_valutar.php" title="Curs valutar"><img src="images/button.png" alt="Curs valutar" /><span>Curs valutar</span></a></div>
			 <div class="button"><a href="idei_afaceri.php" title="Idei de afaceri"><img src="images/button.png" alt="Idei de afaceri" /><span>Idei de afaceri</span></a></div>
			 <div class="button"><a href="horoscop.php" title="Horoscop"><img src="images/button.png" alt="Horoscop" /><span>Horoscop</span></a></div>
			 <div class="button"><a href="anunturi.php" title="Anunturi"><img src="images/button.png" alt="Anunturi" /><span>Anunturi</span></a></div>
			 <div class="button"><a href="contact.php" title="Contact"><img src="images/button.png" alt="Contact" /><span>Contact</span></a></div>
		</div>
</center>
</body>
</html>

Iar acesta este stilul:
.menu {
	  position:relative;
	  top:3px;
	  height:31px;
	  width:976px;
}
.button	{
		position:relative;
		float: left;
		margin-top:0px;
		padding:0px;
		color:red;
		font-family:arial, helvetica, sans-serif;
		background:url(over_button.png) no-repeat;
		width:122px;
		height:30px;
		overflow:hidden;
}
.button a {
		font-size:15px;
		width:122px;
		height:31px;
		display:block;
		float:left;
		color:#FFFFFF;
		text-decoration:none;
		overflow:hidden;
}
.button a:hover {
		color:#FFFFFF;
}


.button img {
		width:122px;
		height:31px;
		border:0px;
}
* html a:hover {
	   visibility:visible;
}

.button a:hover img {
		visibility:hidden;
}

.button span {
		position:absolute;
		left:0px;
		top:8px;
		text-align:center;
		width:122px;
		cursor:pointer;
}
Problema este urmatoarea:in alte browsere totul e conform proiectului.In Internet Explorer(6) intre div-uri am un spatiu alb suplimentar care nu-l pot scoate nicicum.E ca si cum as avea un border:5px solid white.Daca chiar dau border atunci intre border si continutul div-ului imi ramane un contur alb de 5-8px.
Are cineva idee ce trebuie sa mai adaug?
P.S.Mentionez ca sunt incepator.
Cu respect,
geo86

#2
MembruAnonim

MembruAnonim

    MembruAnonim

  • Grup: Banned
  • Posts: 398,284
  • Înscris: 08.10.2015
folosește și tu un css reset ;)

#3
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View Posti0nutzb, on Jun 2 2008, 21:01, said:

folosește și tu un css reset ;)
Mdea...dupa cum spuneam sunt incepator.Dar am inteles ca fisierul reset.css "forteaza" in browser modul de interpretare al CSS-ului.Nu stiu cat de ortodoxa e metoda asta si prefer sa raman cu spatiul alb in IE.Deocamdata e bine,nu ma deranjeaza. Credeam ca gresec eu undeva dar se pare ca e un bug al IE.
Oricum merci pentru ajutor si ca sa fie treaba treaba poti sa detaliezi putin acest Reset CSS? Poate ma luminez si eu si mai intereseaza si pe altii.

Merci!

#4
MembruAnonim

MembruAnonim

    MembruAnonim

  • Grup: Banned
  • Posts: 398,284
  • Înscris: 08.10.2015
dacă spui că ești începător, poate ar trebui să citești pe AICI. S-ar putea să te ajute ;)

#5
Jumping Jack

Jumping Jack

    Member

  • Grup: Members
  • Posts: 622
  • Înscris: 12.09.2007

View Postgeo86, on Jun 2 2008, 22:45, said:

Mdea...dupa cum spuneam sunt incepator.Dar am inteles ca fisierul reset.css "forteaza" in browser modul de interpretare al CSS-ului.Nu stiu cat de ortodoxa e metoda asta si prefer sa raman cu spatiul alb in IE.Deocamdata e bine,nu ma deranjeaza. Credeam ca gresec eu undeva dar se pare ca e un bug al IE.
Oricum merci pentru ajutor si ca sa fie treaba treaba poti sa detaliezi putin acest Reset CSS? Poate ma luminez si eu si mai intereseaza si pe altii.

Merci!

Nu fortezi nimic la browser, nu il faci decat sa renunte la prezentarea implicita a diferitelor elemente de pe pagina. De exemplu, poate ca mie nu imi place modul in care arata elementele de formular (input, textarea, select, etc), poate ca nu imi place cum arata paddingul si margin-ul la diferite elemente block, poate ca nu imi place ca un h1 sa aibe 20 centimetri inaltime. Daca vrei sa vezi ce inseamna asta, ia un fisier html si sterge-i legatura catre fisierul css si toate definitiile css embedded si inline. si o sa vezi cum arata pagina html cu setarile implicite ale browserului.
In plus, exista brosere diferite, si chiar daca in mare seamana intre ele in ceea ce priveste modul de interpretare, exista diferente majore - nu vorbim aici de bug-uri, de-ale lui IE sau nu.
E, uite d-aia se practica resetarea globala a setarilor implicite ale browserului, dupa care poti sa definesti cum vrei tu fiecare element.

Deci:
1. Nu ai Doctype: asta e bad, pentru ca browserul nu mai stie cum sa interpretze ce scrie acolo, si poti avea mari surprize. De exemplu, fara doctype, ie6 crede ca pagina ta este facuta pentru ie5, trece in quirksmode si o afiseaza ca si cum ar fi ie5. Intre ie 5 si 6 sint mari diferente, si pagina ta va fi afisata aiurea.
2. Ar trebui, inca odata, sa introduci un reset global. Pentru lenesi si incepatori exista varianta simpla:  * {margin:0;padding:0}
3. Codul e cam varza, scuze. Nu stiu daca l-ai copiat de undeva si l-ai modificat, sau l-ai conceput tu (inclin catre prima varianta). Ar trebui sa scoti toate imaginile alea de acolo - e clar ca sint exclusiv cu titlu de prezentare, nu au nici un rol informativ. Daca vrei poze la navigatie, baga-le in background-ul linkurilor. In felul asta scapi si de problemele tale cu marginile alea dintre div-uri.
4. Centrarea pe pagina nu se face asa. In primul rind, tag-ul <center> este depreciat si nu se mai foloseste. Daca vrei sa centrezi ceva in fereastra browserului, acel ceva sta intr-un div care are definitia css {margin: 0 auto;width: 600px /*sau cit vrei tu sa aibe*/}.
5. Navigatia ta ar trebui sa fie o lista, nu div-uri.
6. Cind scrii cod, testeaza imediat in Firefox, opera si ie6. Ai putea sa testezi numai in firefox si opera si sa faci ulterior modificarile necesare pentru ie6, insa asta ar presupune ca ai experienta si stii ce trebuie modificat. Pentru ca nu e cazul, testeaza imediat, altfel nu mai stii ce trebuie modificat pentru ie. Opera nu e foatrte folosit, insa este cel mai aproape de standarde. Daca ceva e ok in Opera, asa trebuie sa fie (ma rog, 99% din cazuri, si opera are citeva buguri),  nu cum e in ie6!  Asta nu inseamna ca automat orice diferenta este un bug de ie. Bugurile -aproape toate -sint documentate, exista solutii pentru ele, si nu trebuie confundate cu greseli de codare si particularitatile de interpretare ale browserului. Lista de buguri se gaseste aici: http://positioniseve...t/explorer.html

Uite mai jos un schelet de la care ai putea sa pleci. Uita-te la el si ce nu intelegi, intreaba. Bafta.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>Titlu</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<style type="text/css">

* {margin:0;padding:0} /* reset global la toate marginile si padding-urile*/
ul, ol {list-style:none} /* taie toate punctele de la liste */
p, h1, h2, h3, h4, h5, h6, div, ul, ol, li, dl {font-size:1em;font-weight:normal}
body {font:normal 12px/1.8 arial, helvetica, sans-serif;color:#000;background:#fff}
a{text-decoration:none}
#header,#content,#menu,#footer{width:976px;margin:0 auto;clear:both} /*asta iti centreaza tie elementele pe pagina */
#header h1 {height:115px;background:url(images/logo.png) no-repeat;text-indent:-9999px}
.linie {border:2px solid #000;text-align:center;height:12px;background:#fff url(images/linegreen.png) center center no-repeat}
#menu ul {float:left;width:976px}
#menu li {float:left}
#menu li a {float:left;font-size:15px;color:#fff;padding:5px 0;width:122px;text-align:center;overflow:hidden;background:#ccc url(images/button.png)}
#menu li a:hover {background:#ddd;background-image:none}
#main {float:left;width:800px}
#sidebar {float:right;width:156px}
</style>
</head>
<body>
<div id="header">
<h1>Logo</h1>
</div>
<div class="linie">
</div>
<div id="menu">
<ul>
<li id="vesel"><a href="#">Coltul vesel</a></li>
<li id="electronica"><a href="#">Electronica</a></li>
<li id="itc"><a href="#">IT&C</a></li>
<li id="valutar"><a href="#">Curs valutar</a></li>
<li id="afaceri"><a href="#">Idei de afaceri</a></li>
<li id="horoscop"><a href="#">Horoscop</a></li>
<li id="anunturi"><a href="#">Anunturi</a></li>
<li id="contact"><a href="#">Contact</a></li>
</ul>
</div>
<div id="content">
	<div id="main">
	<h2>Some content</h2>
	<p>
	Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
	</p>
	</div>
	<div id="sidebar">
	<h2>Some sidebar</h2>
	<ul>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	</ul>
	</div>
</div>
<div id="footer">
<h2>Some footer</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
</p>
</div>
</body>
</html>

Edited by Jumping Jack, 03 June 2008 - 12:05.


#6
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View PostJumping Jack, on Jun 3 2008, 09:51, said:

Deci:
1. Nu ai Doctype: asta e bad, pentru ca browserul nu mai stie cum sa interpretze ce scrie acolo, si poti avea mari surprize. De exemplu, fara doctype, ie6 crede ca pagina ta este facuta pentru ie5, trece in quirksmode si o afiseaza ca si cum ar fi ie5. Intre ie 5 si 6 sint mari diferente, si pagina ta va fi afisata aiurea.
2. Ar trebui, inca odata, sa introduci un reset global. Pentru lenesi si incepatori exista varianta simpla:  * {margin:0;padding:0}
3. Codul e cam varza, scuze. Nu stiu daca l-ai copiat de undeva si l-ai modificat, sau l-ai conceput tu (inclin catre prima varianta). Ar trebui sa scoti toate imaginile alea de acolo - e clar ca sint exclusiv cu titlu de prezentare, nu au nici un rol informativ. Daca vrei poze la navigatie, baga-le in background-ul linkurilor. In felul asta scapi si de problemele tale cu marginile alea dintre div-uri.
4. Centrarea pe pagina nu se face asa. In primul rind, tag-ul <center> este depreciat si nu se mai foloseste. Daca vrei sa centrezi ceva in fereastra browserului, acel ceva sta intr-un div care are definitia css {margin: 0 auto;width: 600px /*sau cit vrei tu sa aibe*/}.
5. Navigatia ta ar trebui sa fie o lista, nu div-uri.
6. Cind scrii cod, testeaza imediat in Firefox, opera si ie6. Ai putea sa testezi numai in firefox si opera si sa faci ulterior modificarile necesare pentru ie6, insa asta ar presupune ca ai experienta si stii ce trebuie modificat. Pentru ca nu e cazul, testeaza imediat, altfel nu mai stii ce trebuie modificat pentru ie. Opera nu e foatrte folosit, insa este cel mai aproape de standarde. Daca ceva e ok in Opera, asa trebuie sa fie (ma rog, 99% din cazuri, si opera are citeva buguri),  nu cum e in ie6!  Asta nu inseamna ca automat orice diferenta este un bug de ie. Bugurile -aproape toate -sint documentate, exista solutii pentru ele, si nu trebuie confundate cu greseli de codare si particularitatile de interpretare ale browserului. Lista de buguri se gaseste aici: http://positioniseve...t/explorer.html
Acum am inteles de ce este cat se poate de "curat" sa folosesti acest CSS Reset.
Trecand peste asta,azi mi-am luat o carte de HTML,XHTML,CSS si XML.O sa o studiez cu timpul si cu siguranta o sa ma destupe.
1.Obisnuiesc sa pun Doctype-ul cand testez in Internet.Nu-i dadeam mare importanta pe local.Acum o sa-l am in vedere cu siguranta.
2.Cum e mai indicat? Sa am reset-ul inline sau extern? Daca il pun extern pot pune codul in acelasi stil pentru restul site-ului sau trebuie sa fac doua fisiere .css diferite? (style.css si reset.css).
3.Codul HTML e scris de mine.CSS-ul e copiat si modificat. Pai o sa ma documentez sa vad cum se face cum zici tu.Deocamdata atat am stiut.
4.Nu stiuam ca n u se mai foloseste tag-ul <center>.O sa evit sa-l mai folosesc.
5.Am observat ca toata lumea face cu lista dar eu n-am stiut sa fac. O sa studiez.
6.Testez imediat pe IE6,Opera,Firefox si Netscape.Doar atat am la dispozitie.
Intrebari:
1.Inca n-am inteles ce standard trebuie scris la <meta...charset=...Vad ca tu ai pus UTF-8 dar de ce.........
2.Intrebarea de lapunctul 2. de mai sus.
3.Am facut un <hr /> dar Opera nu a vrut sa afiseze linia sub nicio forma.Si asta e depreciat? Ce solutie exista?
Deocamdata cam atat.

Multumesc mult!

Edited by geo86, 03 June 2008 - 20:39.


#7
Jumping Jack

Jumping Jack

    Member

  • Grup: Members
  • Posts: 622
  • Înscris: 12.09.2007

View Postgeo86, on Jun 3 2008, 20:25, said:

Acum am inteles de ce este cat se poate de "curat" sa folosesti acest CSS Reset.
Trecand peste asta,azi mi-am luat o carte de HTML,XHTML,CSS si XML.O sa o studiez cu timpul si cu siguranta o sa ma destupe.
1.Obisnuiesc sa pun Doctype-ul cand testez in Internet.Nu-i dadeam mare importanta pe local.Acum o sa-l am in vedere cu siguranta.
2.Cum e mai indicat? Sa am reset-ul inline sau extern? Daca il pun extern pot pune codul in acelasi stil pentru restul site-ului sau trebuie sa fac doua fisiere .css diferite? (style.css si reset.css).
3.Codul HTML e scris de mine.CSS-ul e copiat si modificat. Pai o sa ma documentez sa vad cum se face cum zici tu.Deocamdata atat am stiut.
4.Nu stiuam ca n u se mai foloseste tag-ul <center>.O sa evit sa-l mai folosesc.
5.Am observat ca toata lumea face cu lista dar eu n-am stiut sa fac. O sa studiez.
6.Testez imediat pe IE6,Opera,Firefox si Netscape.Doar atat am la dispozitie.
Intrebari:
1.Inca n-am inteles ce standard trebuie scris la <meta...charset=...Vad ca tu ai pus UTF-8 dar de ce.........
2.Intrebarea de lapunctul 2. de mai sus.
3.Am facut un <hr /> dar Opera nu a vrut sa afiseze linia sub nicio forma.Si asta e depreciat? Ce solutie exista?
Deocamdata cam atat.

Multumesc mult!
1. doctype: vezi ca nu e totuna ce doctype folosesti. Sint mai multe variante, cel mai bine ar fi sa citesti topicul cu tutorialul xhtml/css care e sticky la technical area.
2. In principiu partea de reset este parte integranta din fisierul css mare, nu este nevoie sa il faci separat (mai economisesti un request pentru browser). Si cu asta incepe fisierul css. Dar poti sa il pui si separat, mai ales ca asta de obicei e acelasi, nu se modifica, il salvezi undeva ca atare si il apelezi cind ai nevoie, e mai usor dpdv al organizarii si al timpului, insa in cazul asta sa ai grija sa fie incarcat inainte de celalalt fisier, deci il apelezi in head primul sau il incluzi cu import in style.css - sus de tot, inainte de orice alta declaratie din style.css, altfel ai putea avea surpriza ca o serie de declaratii vor fi rescrise de asta si nu vrei. In nici un caz nu il faci embedded sau inline.
3. raspunsul e la fel ca la primul punct
4. Nu numai center, ci si font, b, i, si inca destule.
5. la fel ca la 1 si 3
6. E suficient. Insa: ie7 e deja destul de raspindit, si difera destul de bine de ie6. Cel mai bine e sa instalezi ie7, iar pentru ie6 apelezi la o varianta standalone.
raspunsuri la celelalte intrebari:
1. uite aici informatii despre utf8
2. Ti-am raspuns deja
3. hr nu e depreciat, ar fi trebuit sa ti-o afiseze. Doar daca hr vine dupa un element care are float , nu o vezi. Declara hr {clear:both} si-o vezi.

bafta

Edited by Jumping Jack, 03 June 2008 - 21:15.


#8
xnoise

xnoise

    Active Member

  • Grup: Members
  • Posts: 1,310
  • Înscris: 08.02.2007
hr este unul dintre cele mai "infecte" elemente. In niciun browser nu arata la fel si proprietatile de css nu se aplica niciodata in 2 browsere la fel pt un hr. Nerecomandata folosirea sa.

Doctype-ul recomandat este HTML 4.01 strict, dar pentru multi varianta cea mai fiabila este HTML 4.01 trans. in niciun caz nu trebuie declarat [atasat] un doctype XHTML, pentru ca un document cu doctype XHTML trebuie servit ca content type application/xml+xhtml, iar IE o sa ofere un mare download box daca se intampla asta. Chestia asta legata de doctype a devenit ca o poezie. Am repetat-o de 1000000000 ori pana acum. Motive mai sunt o groaza.

Cat despre teste, acestea ar trebui facute generic pe urmatoarele: Firefox (sau opera, sau safari), IE6, IE7/8. Am pus Firefox sau opera sau safari pt ca aceste 3 browsere sunt in mare masura standard compliant. IE-urile intra in alta categorie.

@jumping: <b> si <i> nu sunt depreciate. Se prefera alternativ folosirea <strong> si <em> din motive de semantica. Probabil ca or sa fie depreciate in HTML 5.

Acum cateva explicatii care tin probabil mai mult de acel topic mentionat de @jumping: un Doctype [DTD, Document Type Definition] este un fisier [impropriu spus pt ca este mai mult de atat] care tine definitiile pentru elementele care pot fi folosite intr-un document. Astfel, nefiind definit in DTD-urile pt html, elementul <banana>, de altfel valid in XML, este invalid in HTML. Evident, DTD-ul poate fi modificat si creat un DTD custom care sa includa si elementul <banana> cu toate definitiile sale. Astfel, elementul declarat, el poate fi folosit fara ca documentul sa fie invalid. Nu te astepta insa sa fie validat documentul cu validatorul W3C care nu recunoaste doctype-uri custom. Prin modul in care un DTD controleaza elementele prezente intr-un document el este de nelipsit intr-un document (oricare ar fi el: HTML, XHTML, XML).

Mai multe aici...

Edited by xnoise, 03 June 2008 - 22:32.


#9
Jumping Jack

Jumping Jack

    Member

  • Grup: Members
  • Posts: 622
  • Înscris: 12.09.2007
@xnoise: Ce ai tu asa de tare impotriva lui XHTML?  :huh:
Ok, nu mai intru in polemica despre xhtml vs html, pentru ca nu o ajungem nicaieri. In ultima instanta depinde de gustul fiecaruia ce standard foloseste, atat vreme cat il foloseste corect. Eu folosesc xhtml pentru ca m-am obisnuit cu sintaxa lui, pentru ca in proiecte mari este cel mai folosit, pentru ca blogurile si cms-urile au deja template-urile in xhtml si e mai comod sa folosesti ceva care este deja acolo. Pentru proiecte mici nu are nici o importanta, dar atata vreme cit in alte parti folosesc xhtml,  nu vad nici un rost in a  schimba periodic macazul.  Ca xhtml ar trebui servit ca aplicatie xml in loc de text/html, chiar nu ma intereseaza, e problema W3C, nu a mea.
In alta ordine de idei, iata ce spune chiar webstandards group despre xhtml vs html.

<b> si <i> : si pentru ca nu sint semantice, sint depreciate. Ca nu apar ca atare in lista de elemente oficial declarate depreciate, este putin important, indeplinesc din plin  definitia unui element depreciat, si anume aceea ca se ocupa strict de prezentarea unui element, nu cu  semantica. Bold si italic nu au nici o semnificatie semantica, insa strong si emphasize au.

Edited by Jumping Jack, 04 June 2008 - 12:36.


#10
xnoise

xnoise

    Active Member

  • Grup: Members
  • Posts: 1,310
  • Înscris: 08.02.2007
ca replica: de ce sa NU folosesti XHTML [si chiar e pe bune, mai ales partea cu IE-ul si declararea de content-type]: http://www.webdevout...beware-of-xhtml . Daca va intrebati, webdevout este un loc in care sunt publicate chestii f interesante si are cam aceeasi credibilitate ca webstandards org. Faci niste afirmatii putin cam... incredibile. Intai imi dai o sursa in care se arata avantajele (cu care as fi de acord daca nu as sti ce s-a lucrat la XHTML 2.0 si daca nu as sti drawback-urile XHTML 1.0) dupa care zici ca content-type-ul este problema W3C. W3c a creat XHTML [standardele] si tinand cont ca ei au creat acest standard, mi se pare normal sa respecti pana la capat standardul . Citez de pe la amaratii aia de la w3c:

"User agents that access XHTML documents served as Internet media type text/html via the DOM can use the HTML DOM, and can rely upon element and attribute names being returned in upper-case from those interfaces."

"User agents that access XHTML documents served as Internet media types text/xml, application/xml, or application/xhtml+xml can also use the XML DOM. Elements and attributes will be returned in lower-case. Also, some XHTML elements may or may not appear in the object tree because they are optional in the content model (e.g. the tbody element within table). This occurs because in HTML 4 some elements were permitted to be minimized such that their start and end tags are both omitted (an SGML feature). This is not possible in XML. Rather than require document authors to insert extraneous elements, XHTML has made the elements optional. User agents need to adapt to this accordingly. For further information on this topic"

deci un document XHTML servit cu content-type text/html este interpretat ca HTML, nu ca XML. Dintr-o data 3/4 din avantajele mentionate de tine si de cei de la webstandards dispar. Si daca te uiti mai atent, partea cu maintainance-ul e cam bullshit. La fel de usor de intretinut e un document HTML ca si unul XHTML. Partea cu nu ma intereseaza ce recomanda si nu citesc ce zic aia de la W3C e ... penibil dupa parerea mea, in conditiile in care presupun ca esti un dezvoltator care stie ce inseamna un standard. Discutia asta am mai purtat-o de 10000000 ori si pe aici si prin alte parti, iar resurse gasesti pe net despre ce si cum trebuie folosit.

Vis a vis de <b> si <i> iar gresesti. Pana ce elementele astea nu sunt scoase din DTD-ul de html/xhtml ele sunt perfect valide si interpretabile de catre browsere. Din nou te bazezi pe o consideratie proprie, ignorand din nou pe cei de la W3C. Ei sunt singurii capabili sa scoata sau sa introduca elemente in definitiile pt XHTML si HTML. Hai sa nu mai vorbim pe ce ni se pare noua, si sa prezentam lucrurile asa cum sunt ele. termenul de "deprecated" se refera la un element care putea fi folosit anterior intr-un document si care ulterior, dupa modificarea standardelor nu mai poate fi folosit. Nu are nici o treaba cu semantica.

O seara placuta.

#11
xnoise

xnoise

    Active Member

  • Grup: Members
  • Posts: 1,310
  • Înscris: 08.02.2007
atasat un print screen cu dragutul de IE. In background se poate vedea pagina servita ca text/html, in download box se cere aceeasi pagina dar cu un content-type: application/xhtml+xml la un refresh. Asadar, deduceti voi de ce nu ar trebui folosit XHTML.

Attached Files


Edited by xnoise, 04 June 2008 - 22:50.


#12
MembruAnonim

MembruAnonim

    MembruAnonim

  • Grup: Banned
  • Posts: 398,284
  • Înscris: 08.10.2015
@xnoise: perfect adevărat ce spui tu. dar problema apare când ai clienți ce îți cer în mod expres xhtml 1.0 strict sau 1.1. Și stai să te gândești : renunț la client? îl convingi că greșește și încerci să-i schimbi concepțiile băgate de alții în cap?* sau faci treaba bine, așa cum vrea el?

* sunt convins că ai avut clienți care au vrut site-uri fără tabele iar datele din site erau tabulare. Trebuie să reinventezi apa caldă și să faci site-ul fără tabele :w00t: genul ăsta de clienți sunt un pic mai dificili din punctul ăsta de vedere și prefer să îi las în pace, oferindu-le ce îmi cer :)

#13
georgica

georgica

    Active Member

  • Grup: Members
  • Posts: 1,483
  • Înscris: 30.01.2003

View Postxnoise, on Jun 4 2008, 23:49, said:

atasat un print screen cu dragutul de IE. In background se poate vedea pagina servita ca text/html, in download box se cere aceeasi pagina dar cu un content-type: application/xhtml+xml la un refresh. Asadar, deduceti voi de ce nu ar trebui folosit XHTML.

Nu vreau sa intru in polemica asta HTML vs XHTML dar nu ma pot abtine : de unde le scoti tu cu fereastra de download ?
Eu n-am reusit sa fac sa apara fereastra de download nici cu application/xml, nu mai vorbesc de application/xhtml+xml cum folosesc in mod curent.

Uite 2 pagini de test :
- application/xml - http://aari.8k.ro/teste/test.htm
- application/xhtml+xml - http://aari.8k.ro/teste/xtest.htm

La mine le afiseaza corect si in ie6 si ie7. In plus, sint si in "Standards compliance mode" (vezi dupa alinierea la centru a body-ului).

#14
xnoise

xnoise

    Active Member

  • Grup: Members
  • Posts: 1,310
  • Înscris: 08.02.2007
din pacate lumea aici vine sa invete. Nu cred ca vine aici ca client. Am considerat ca am datoria de a explica pentru cei mai incepatori ce anume e corect si ce nu. Asta e singurul motiv pentru care sunt atat de vehement in afirmatiile mele. Bineinteles ca viata reala este putin diferita, dar in momentul in care ajungi la un anumit nivel si ai puterea de a iti impune punctul de vedere ar trebui sa do the right thing. Am avut clienti de genul asta la inceput, acum insa sunt cautat tocmai pentru ca stiu cum anume e corect si ce anume trebuie facut. Unii sunt chiar interesati de chestia asta, si un html chior standard compliant costa mult mai mult decat un "tag soup" facut de un incepator.

Discutiile de aici imi place sa cred ca la nivel teoreti macar sunt despre standarde si practici corecte.

PS: testul cu IE si specificatia conving majoritatea clientilor ca nu e ok. Daca mai adaugi si problemele legate de indexarea paginilor de catre motoarele de cautare (unele din ele chiar au probleme la documentele servite ca application/xhtml+xml, application/xml sau text/xml) ajungi sa il convingi relativ usor ca nu e bine. Daca nu reusesc sa il conving, merg pe metoda: ai venit la mine, lasa-ma sa imi fac treaba cum trebuie daca tot ma platesti. Si asta merge aproape mereu. Daca clientul e tot incapatanat, renunt la el, pentru ca nu e singurul client de pe piata.

PS2: @georgica: inarmeaza-te cu rabdare si uite-te mai atent la ce iti serveste apache-ul. Una din greselile comune ale incepatorilor e sa nu se uite la headere. O sa descoperi cu stupoare ca tu trimiti un xhtml cu application/xhtml+xml si de fapt apache suprascrie headerele si trimite un text/html. Daca fortezi din php un header content-type: application/xhtml+xml o sa vezi ce vbesc. Nu mai sari ca apucatul si incearca sa citesti inainte de a veni cu chestii din astea pe aici.

uite un exemplu:
<?php header("Content-type: application/xhtml+xml"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<link rel="stylesheet" href="test.css" type="text/css" media="screen" />
	<style type="text/css">
		* {  padding:0; margin:0 }
		html { width:100%; height:100%;}
		body {
			background-color: #77b;
			font-family: Arial, helvetica, sans-serif;
			color: #fff;
			height:100%; width:100%; padding:0; margin:0;
		}
		h1, p {
			text-align: center;
		}
		p {
			margin-top: 100px;
		}
		a {
			font-weight: bold;
			color: #ff0;
		}
	</style>
</head>
<body>
	<h1>Slimbox</h1>
	<a href="#" id="start" rel="1"><img src="images/image-1.jpg" style="width:100px;" /></a>
	<p>
		<a href="images/image-1.jpg" class="test" rel="lightbox[test]" title="Monkey temple in Nepal. (Photo by C. Beyls)"><img src="images/image-1.jpg" style="width:100px;" /></a>
		<a href="images/image-2.jpg" class="test" rel="lightbox[test]" title="Monkey temple in Nepal. (Photo by C. Beyls2)"><img src="images/image-2.jpg" style="width:100px;" /></a>
		<a href="images/image-3.jpg" class="test" rel="lightbox[test]" title="Monkey temple in Nepal. (Photo by C. Beyls3)"><img src="images/image-3.jpg" style="width:100px;" /></a>
	</p>		

</body>

</html>

Daca scoti headerul ala si namespace-ul de xhtml o sa descoperi ca desi ai un doctype xhtml, apache trimite un html. De asemenea o sa descoperi ca IE iti da un download box si ca in FX / Opera / Safari merge. Invatati sa va documentati inainte sa scrieti ceva sau sa criticati ceva. Toate cele bune.

PS3: ca sa te convingi ti-am atasat un print screen cu content-type-ul servit de apache (Am highlightat content-type-ul.):

Attached Files


Edited by xnoise, 05 June 2008 - 09:29.


#15
georgica

georgica

    Active Member

  • Grup: Members
  • Posts: 1,483
  • Înscris: 30.01.2003
Pusesem o intrebare, nu ma apucase nimic altceva. Am vrut sa dau un raspuns mai pe masura da cum am zis, nu mai intru in polemici.

Da, ai dreptate.
Mult succes in viata.

#16
Jumping Jack

Jumping Jack

    Member

  • Grup: Members
  • Posts: 622
  • Înscris: 12.09.2007

View Postxnoise, on Jun 4 2008, 21:51, said:

ca replica: de ce sa NU folosesti XHTML [si chiar e pe bune, mai ales partea cu IE-ul si declararea de content-type]: http://www.webdevout...beware-of-xhtml . Daca va intrebati, webdevout este un loc in care sunt publicate chestii f interesante si are cam aceeasi credibilitate ca webstandards org. Faci niste afirmatii putin cam... incredibile. Intai imi dai o sursa in care se arata avantajele (cu care as fi de acord daca nu as sti ce s-a lucrat la XHTML 2.0 si daca nu as sti drawback-urile XHTML 1.0) dupa care zici ca content-type-ul este problema W3C. W3c a creat XHTML [standardele] si tinand cont ca ei au creat acest standard, mi se pare normal sa respecti pana la capat standardul . Citez de pe la amaratii aia de la w3c:

"User agents that access XHTML documents served as Internet media type text/html via the DOM can use the HTML DOM, and can rely upon element and attribute names being returned in upper-case from those interfaces."

"User agents that access XHTML documents served as Internet media types text/xml, application/xml, or application/xhtml+xml can also use the XML DOM. Elements and attributes will be returned in lower-case. Also, some XHTML elements may or may not appear in the object tree because they are optional in the content model (e.g. the tbody element within table). This occurs because in HTML 4 some elements were permitted to be minimized such that their start and end tags are both omitted (an SGML feature). This is not possible in XML. Rather than require document authors to insert extraneous elements, XHTML has made the elements optional. User agents need to adapt to this accordingly. For further information on this topic"

deci un document XHTML servit cu content-type text/html este interpretat ca HTML, nu ca XML. Dintr-o data 3/4 din avantajele mentionate de tine si de cei de la webstandards dispar. Si daca te uiti mai atent, partea cu maintainance-ul e cam bullshit. La fel de usor de intretinut e un document HTML ca si unul XHTML. Partea cu nu ma intereseaza ce recomanda si nu citesc ce zic aia de la W3C e ... penibil dupa parerea mea, in conditiile in care presupun ca esti un dezvoltator care stie ce inseamna un standard. Discutia asta am mai purtat-o de 10000000 ori si pe aici si prin alte parti, iar resurse gasesti pe net despre ce si cum trebuie folosit.

Vis a vis de <b> si <i> iar gresesti. Pana ce elementele astea nu sunt scoase din DTD-ul de html/xhtml ele sunt perfect valide si interpretabile de catre browsere. Din nou te bazezi pe o consideratie proprie, ignorand din nou pe cei de la W3C. Ei sunt singurii capabili sa scoata sau sa introduca elemente in definitiile pt XHTML si HTML. Hai sa nu mai vorbim pe ce ni se pare noua, si sa prezentam lucrurile asa cum sunt ele. termenul de "deprecated" se refera la un element care putea fi folosit anterior intr-un document si care ulterior, dupa modificarea standardelor nu mai poate fi folosit. Nu are nici o treaba cu semantica.

O seara placuta.

Nu am zis nimic de maintenance, eu am zis ca mi-e mie mai comod sa folosesc un singur standard in loc de doua, in conditiile in care cel pe care il folosesc este perfect potrivit scopului. Maintenance-ul e fix la fel ca la html.



N-am spus ca nu citesc si nu ma intereseaza ce zice w3c, am zis ca "... ca xhtml ar trebui servit ca aplicatie xml in loc de text/html, chiar nu ma intereseaza, e problema W3C, nu a mea.". E altceva, nu rastalmaci.
Citez de la w3c de data asta, nu de la altii:
"Why is it allowed to send XHTML 1.0 documents as text/html?

XHTML is an XML format; this means that strictly speaking it should be sent with an XML-related media type (application/xhtml+xml, application/xml, or text/xml). However XHTML 1.0 was carefully designed so that with care it would also work on legacy HTML user agents as well. If you follow some simple guidelines, you can get many XHTML 1.0 documents to work in legacy browsers. However, legacy browsers only understand the media type text/html, so you have to use that media type if you send XHTML 1.0 documents to them. But be well aware, sending XHTML documents to browsers as text/html means that those browsers see the documents as HTML documents, not XHTML documents."

Pe aceeasi pagina, uite ce spune w3c despre motivele utilizarii xhtml in loc de html.

Si apropo, ca sa lamurim o polemica de-a noastra mai veche, de pe topicul cu tutorialul, referitoare la "este xhtml1.1 xml sau nu  ", citez tot de la w3c:

"Why is it disallowed to send XHTML 1.1 documents as text/html?

XHTML 1.1 is pure XML, and only intended to be XML. It cannot reliably be sent to legacy browsers. Therefore XHTML 1.1 documents must be sent with an XML-related media type, such as application/xhtml+xml." :)


Ca sa inchei, repet ce am mai spus mai devreme: e la latitudinea fiecaruia sa hotarasca ce standard foloseste. Nu am spus nimanui "html e rau, foloseste xhtml". Eu folosesc xhtml, perfect constient ca de fapt browserul il trateaza ca pe html, pentru ca MI-E MIE MAI COMOD! Acum. Peste 3 ani, cind o fi iarasi html 5 tare, nu stiu ce o sa fac. Faptul ca w3c isi da cu stingu-n dreptu' si acum anunta marea descoperire xhtml si p-orma o da la intors si spune ca de fapt html e viitorul, nu xhtml, ca nu are suport si asa si pe dincolo, chiar il face pe fiecare developer sa fie liber sa creada ce vrea. Fiecare are un adevar absolut si daca ceilalti sint de alta parere iese cu scintei.  Acum 5 ani foloseam html 4.01 si ziceam ca e racheta cosmica. Acum html este aruncat la cutia de vechituri. Miine se razbuna si scoate iar capul, cu vers. 5. Iar noi nu facem altceva decat sa ne scoatem ochii! Parca am popi si ne certam daca isus este sau nu este intruchiparea lui dumnezeu pe pamint! Chiar, poate se infiinteaza doua mari religii: xhatemelismul si hatemelismul.

PS. b si i sint intr-adevar oficial inca in carti, e adevarat, iar partea cu deprecierea lor este o parere subiectiva, si asta e adevarat. Insa atat vreme cit exista o tendinta catre semantica pe de o parte, si pe de alta parte un set de tag-uri care incalca aceste reguli , prefer sa nu le folosesc altogether, mai ales ca exista alternativa. Acelasi lucru as putea spune si despre br si hr, insa pentru primul inca nu exista o solutie alternativa convenabila, iar hr este oricum nu numai infect ci si complet inutil, deci nu il folosesc practic deloc.

cheers

Edited by Jumping Jack, 05 June 2008 - 12:32.


#17
xnoise

xnoise

    Active Member

  • Grup: Members
  • Posts: 1,310
  • Înscris: 08.02.2007
sunt de acord cu tine in mare masura, dar dupa ce am citit si ce am invatat, sunt de parere ca html e totusi atat forward compatible cat si backwards compatible, proprietate pe care xhtml nu o are. W3C nu are nici o vina pentru "datul cu stangul in dreptul", vina o poarta majoritatea producatorilor de UA (pornind de la cei clasici pt PC, laptop, etc pana la cei care produc USA's pt browsere mobile) dar si a dezvoltatorilor care nu sunt in stare sa respecte standardele. XHTML este un concept teribil. Si foarte interesant. Extinderile sale merg mlt dincolo de cele ale html-ului, singura mare problema este ca el nu poate fi folosit acum. Nu este parsat corect deci nu poate fi folosit corect. E cumva un pic ca manelizarea. Imi iau telefon de 20 de milioane (sa zicem htc diamond) dar nu il folosesc decat sa sun de pe el. Nu folosesc wireless-ul, mailul, etc etc etc. Dar ma dau mare ca e in trend. XHTML-ul este si el tot un trend, si chiar unul destul de periculos. Tu din intamplare esti unul care a ales din propriile tale motive sa foloseasca XHTML, dar marea majoritate folosesc doar pt ca DW pune default XHTML ca doctype sau pt ca e cool. HTML nu e scos din uz, si nimeni nu a zis asta (cel putin eu nu imi amintesc).

Pentru un incepator raman la concluzia ca e mai curat sa foloseasca HTML 4.01 si nu strict, ci trans. Asta pana invata destul incat sa poata sa ia o decizie nu in baza trendului ci bazata pe experienta sa. Cat despre comoditate, reafirm ca HTML 4.01 este compatibil HTML 5, in timp ce niciun XHTML nu este compatibil XHTML 2.0. Si pt mine asta e un motiv destul de serios sa nu renunt la HTML. :)

PS: ca tot vbim de standarde, uite un exemplu clasic: IE nu intelege border:dotted. Oare e chiar asa? De fapt il intelege din moment ce pare a aplica dashed. Si asta e una din multele gauri de specificatie ale celor de la w3c: cum trebuie sa arate un "dot" si cum trebuie sa arate un "dash"? IE-ul presupune ca asa arata un dot, mozilla presupune altfel. Desi IE-ul pare ca greseste, de fapt nu greseste ci foloseste o gaura de standardizare si anume ca punctul nu e descris: sa fie de 2 pixeli inaltime/latime, etc etc etc. Dar si cei de la w3c fac munca voluntara. Niciun standard nu este complet lipsit de erori si tot ce putem face este sa multumim totusi ca exista o standardizare si ca putem incropi un HTML/XHTML 99% cross-browser (daca suntem atenti poate chiar 100%). Si asta e meritul celor de la w3c si al altora care au muncit la reunificarea diferitelor standarde definite de manufacturerii de browsere. + ca munca lor este free, deci sa nu cerem chiar asa de mult. Eu am in viitor intentia sa particip la discutiile w3c, dar mai am o groaza de invatat intre timp. sper sa pot ajuta candva cu ceva. :)

Edited by xnoise, 05 June 2008 - 12:52.


#18
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View PostJumping Jack, on Jun 3 2008, 09:51, said:

Uite mai jos un schelet de la care ai putea sa pleci. Uita-te la el si ce nu intelegi, intreaba. Bafta.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>Titlu</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<style type="text/css">

* {margin:0;padding:0} /* reset global la toate marginile si padding-urile*/
ul, ol {list-style:none} /* taie toate punctele de la liste */
p, h1, h2, h3, h4, h5, h6, div, ul, ol, li, dl {font-size:1em;font-weight:normal}
body {font:normal 12px/1.8 arial, helvetica, sans-serif;color:#000;background:#fff}
a{text-decoration:none}
#header,#content,#menu,#footer{width:976px;margin:0 auto;clear:both} /*asta iti centreaza tie elementele pe pagina */
#header h1 {height:115px;background:url(images/logo.png) no-repeat;text-indent:-9999px}
.linie {border:2px solid #000;text-align:center;height:12px;background:#fff url(images/linegreen.png) center center no-repeat}
#menu ul {float:left;width:976px}
#menu li {float:left}
#menu li a {float:left;font-size:15px;color:#fff;padding:5px 0;width:122px;text-align:center;overflow:hidden;background:#ccc url(images/button.png)}
#menu li a:hover {background:#ddd;background-image:none}
#main {float:left;width:800px}
#sidebar {float:right;width:156px}
</style>
</head>
<body>
<div id="header">
<h1>Logo</h1>
</div>
<div class="linie">
</div>
<div id="menu">
<ul>
<li id="vesel"><a href="#">Coltul vesel</a></li>
<li id="electronica"><a href="#">Electronica</a></li>
<li id="itc"><a href="#">IT&C</a></li>
<li id="valutar"><a href="#">Curs valutar</a></li>
<li id="afaceri"><a href="#">Idei de afaceri</a></li>
<li id="horoscop"><a href="#">Horoscop</a></li>
<li id="anunturi"><a href="#">Anunturi</a></li>
<li id="contact"><a href="#">Contact</a></li>
</ul>
</div>
......
Intrebare:
1.De ce pentru logo (prima linie) te-ai folosit de h iar pentru menu,linie etc. ai folosit div-uri? Sau ai vrut sa-mi arati ca am la dispozitie 2 metode?!
2.Am vazut in unele coduri ca se foloseste selectorul #wrapper cu diferite proprietati.Poti sa-mi explici,te rog,de ce si cand se foloseste? N-am prea inteles....
3.Linia asta: #header h1 {height:115px;background:url(images/logo.png) no-repeat;text-indent:-9999px} .De ce ai mai pus #header in fata? Nu era suficient h1 {height:115px;background:url(images/logo.png) no-repeat;text-indent:-9999px},adica fara #header?
Merci!

Edited by geo86, 06 June 2008 - 22:40.


Anunturi

Chirurgia endoscopică a hipofizei Chirurgia endoscopică a hipofizei

"Standardul de aur" în chirurgia hipofizară îl reprezintă endoscopia transnazală transsfenoidală.

Echipa NeuroHope este antrenată în unul din cele mai mari centre de chirurgie a hipofizei din Europa, Spitalul Foch din Paris, centrul în care a fost introdus pentru prima dată endoscopul în chirurgia transnazală a hipofizei, de către neurochirurgul francez Guiot. Pe lângă tumorile cu origine hipofizară, prin tehnicile endoscopice transnazale pot fi abordate numeroase alte patologii neurochirurgicale.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate