Tutorial xhtml/css
Last Updated: Oct 11 2015 16:23, Started by
Jumping Jack
, Dec 06 2007 20:47
·
0
#37
Posted 19 September 2008 - 19:58
Ei, si ca sa vedeti si voi cu cine aveti de-a face, abia azi am regasit topicul asta!!! Cred ca am nevoie de un hard disk nou! Si nu ma refer la computador...
Buna seara! |
#38
Posted 19 September 2008 - 22:31
http://forum.softped....php?act=Search îți permite să găsești ușor orice cu parametrii corecți.
|
#39
Posted 21 September 2008 - 21:58
OriginalCopy, on Sep 19 2008, 22:31, said: http://forum.softped....php?act=Search îți permite să găsești ușor orice cu parametrii corecți. Da, stiu, glumeam. Eu nu il cautam, am dat peste el din intimplare. Daca voiam, il gaseam eu, fii pe pace |
#40
Posted 10 November 2008 - 09:10
Incerc sa trec si eu de la layout cu tabele la layout cu DIV-uri si am o nelamurire. Care este de fapt rolul clasei "clearfix"?
Am citit de cateva ori si tot n-am priceput. Mi se pare ca are o definitie foarte complicata. Quote .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ Quote atentie mare la clasa clearfix. Sub nici o forma aceasta nu trebuie sa dispara pentru ca veti avea surprize neplacute [atat pe IE cat si pe FX si alte browsere]. Aceasta clasa inlocuieste clasicul <br style="clear:both"> folosit pt clearing. De ce aceasta clasa si nu <br>? pt ca nu adauga cod suplimentar in sursa. .clearfix {clear:both;} De ce nu e suficient asa? |
#41
Posted 11 November 2008 - 23:48
1) de ce nu e suficient?
Browserele moderne știu mai mulți pseudoselectors. Prin urmare, după clasa clearfix se adaugă un punct caruia i se dă clear both. Altfel spus, clear:both nu se dă clasei ci punctului inserat după 2) cum se folosește? <div class="clearfix"> <div style="float:left"></div> <div style="float:right"></div> </div><!--/.clearfix-->3) de ce? păi te scutește de clear:both, care îți poate crea ceva probleme uneori cqnd ai mai multe float-uri unul într-altul Sper că ai înțeles |
#42
Posted 10 November 2009 - 17:24
Văd că n-a mai postat nimeni pe acest tutorial din noiembrie 2008 și e păcat, pentru că fără CSS nu mai faci nimic în ziua de azi în materie de layout de site-uri. Eu am învățat singur și încă mai învăț și n-am timp pentru câte sunt de învățat în domeniu!
De aceea vin cu ceva util zic eu pentru începătorii într-ale CSS-ului: http://line25.com/articles/15-must-read-articles-for-css-beginners |
#43
Posted 18 April 2010 - 10:19
Jumping Jack, on 4th March 2008, 16:53, said: Afisarea unei poze la hover peste un cuvint. hehe... Am gasit adineauri o problemuta pe un alt topic, si m-am gindit sa postez aici rezolvarea. Este vorba de afisarea unei poze la mouseover (hover, de fapt). Adica, o poza incarcata in sursa sa nu fie aratata decat la hover peste un cuvint. Iata mai <!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>dropdown list</title> <style type="text/css"> * {margin:0;padding:0; list-style:none;border:none} body {font:normal 62.5%/1.4 verdana, arial, helvetica, sans-serif;color:#000;background:#fff} a:link,a:visited,a:hover,a:active {outline:0} a {text-decoration:none;color:#c33} #wrapper {height:500px;position:absolute;left:50%;top:50%;margin:-250px auto auto -460px;width:920px;font-size:120%;background:#ccc} a.poze{position: relative;} a.poze:hover {background-color: transparent;z-index: 50;} /*nu scoateti background:transparent, altfel nu mai functioneaza in ie6 */ a.poze span{ position: absolute;background-color: #fff;padding: 0;left: -1000px;visibility: hidden;text-decoration: none;} a.poze:hover span{ visibility: visible;top: 0;left: 70px;text-decoration:none;background:#fff;color:#000} a.poze span img{ border: 1px solid #aaa;} </style> </head> <body> <div id="wrapper"> <p> Lorem Ipsum is simply dummy text <a class="poze" href="#" onclick="return false;">cuvintul tau cu hover <span><img src="http://forum.softpedia.com/images/softpedia_forum_logo.gif" alt="" /></span></a> Lorem Ipsum is simply dummy <a class="poze" href="#" onclick="return false;">cuvintul tau cu hover <span><img src="http://forum.softpedia.com/images/softpedia_forum_logo.gif" alt="" /></span></a>text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy <a class="poze" href="#" onclick="return false;">cuvintul tau cu hover <span><img src="http://forum.softpedia.com/images/softpedia_forum_logo.gif" alt="" /></span></a>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> </body></html> Este ceea ce cautam cu o singura deosebire. Eu as vrea ca imaginea sa se deschida lateral stanga sau dreapta si sa folosesc o imagine care are integrat un frame deoarece as vrea sa evit flash. Ma poate ajuta cineva? Edited by DacicDracon, 18 April 2010 - 10:35. |
#45
Posted 15 May 2010 - 14:14
ok, postez eu un exemplu de sablon xhtml/css valabil pt 95% dintre site-uri.
voi include comentariile in codul sursa. un exemplu live, bazat pe acest sablon, aici. xhtml, in afara de clase, structura va ramane aceeasi pe intregul site: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Titlu</title> <style type="text/css"> @import "style.css"; /* import css pt. compatibilitatea cu browserele antice, care vor afisa doar text (NS, IE5<) */ </style> </head> <body class="fixed col-2-right no-js"> <!-- tipul layoutului, definit in CSS: col-1 - o coloana (pagina fara bare laterale) col-2-left - 2 coloane (principala + bara laterala stanga) col-2-right - 2 coloane (principala + bara laterala dreapta) col-3 - 3 coloane (principala + bara laterala dreapta + bara laterala stanga) col-3-left - 3 coloane (principala + 2 bare laterale stanga) col-3-right - 3 coloane (principala + 2 bare laterale dreapta) fixed - latimea paginii fixa (dupa 960gs) fluid - latimea paginii elastica (100%), dar tot trebuie limitata in CSS pe la 1400-1600px pt a mentine textul usor de citit si la rezolutii mari no-js - aceasta clasa va fi eliminata cu javascript, foarte util daca vrem sa aflam daca utilizatorul are sau nu javascript activat --> <!-- pagina --> <div id="page"> <!-- antent --> <div id="header"> <!-- continutul propriu-zis al antetului --> <div class="page-content clear-block"> <h1 id="logo"><a href="#">Titlu</a></h1> <!-- <h1> va fi folosit doar pe pagina principala, pe restul paginilor va fi inlocuit cu <div> din motive ce tin de SEO --> <!-- meniul principal --> <ul class="navigation clear-block"> <li class="active"><a href="#"><span class="title">Home</span></a></li> <li><a href="#"><span class="title">About us</span></a></li> <li><a href="#"><span class="title">Contact</span></a> <ul> <li><a href="#"><span class="title">Test nivel 2</span></a></li> <li><a href="#"><span class="title">Test mai multe nivele</span></a> <ul> <li><a href="#"><span class="title">Test nivel 3</span></a></li> <li><a href="#"><span class="title">etc</span></a></li> </ul> </li> </ul> </li> <!-- am folosit <span>-uri pt. a lasa posibilitatea designer-ului sa creeze un meniu mai complex dpdv grafic (de exemplu "tab"-uri) --> </ul> <!-- /meniul principal --> </div> <!-- /continutul propriu-zis al antetului --> </div> <!-- /antet --> <!-- coloanele principale --> <div id="main"> <!-- continutul propriu-zis al coloanelor principale --> <div class="page-content clear-block"> <!-- coloana principala --> <div id="primary-content"> <div class="blocks"> coloana principala </div> </div> <!-- coloana principala --> <!-- coloana 2 --> <div id="sidebar"> <!-- "blocuri", o lista cu widgets --> <ul class="blocks"> <li>- bloc din bara latera</li> <li>- bloc din bara latera</li> </ul> <!-- /blocuri --> </div> <!-- /coloana 2 --> <!-- loc pentru coloana 3 (vizibila doar pe col-3, col-3-left, col-3-right) aceeasi structura ca si coloana 2, se schimba doar ID-ul cu "sidebar2" --> </div> <!-- /continutul propriu-zis al coloanelor principale --> </div> <!-- /coloanele principale --> <!-- subsol --> <div id="footer"> <!-- continutul propriu-zis al subsolului --> <div class="page-content"> subsol </div> <!-- /continutul propriu-zis al subsolului --> </div> <!-- /subsol --> </div> <!-- /pagina --> </body> </html> css: /* reset la spatii la toate elementele */ *{ margin:0; padding:0; } html,body{ min-height:100%; /* pt ca "div.subsol" sa fie la subsolul paginii :) */ } /* evident se schimba in functie de design */ body{ font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif; font-size:14px; font-style:normal; color:#4e4e4e; } /* pagina ("wrapper") */ #page{ width: 100%; height: 100%; min-height: 800px; /* se va schimba in functie de design, daca acest div va avea o imagine ca fundal... */ } /* continutul propriuzis */ .page-content{ max-width:1600px; /* nu mai mult de 1600 de pixeli pt ca face pagina greu de citit la rezolutii mari */ min-width:780px; /* nu mai puti de 780px (minim 800x600), pt ca poate distruge design-ul */ margin:0 auto; /* centram continutul (nu merge in IE 5.5 si mai jos) */ position: relative; /* in caz ca adaugam elemente absolute, ele trebuie pozitionate in functie de pozitia acestui div) */ } /* tipul paginii */ /* latime fixa */ body.fixed .page-content{width:980px;} /* 960gs - detalii pe http://960.gs/ */ /* marimea implicita a coloanelor (se defineste mai jos pt toate situatiile) */ body.fixed #primary-content{width:670px;} body.fixed #sidebar{width:310px;} body.fixed #sidebar2{width:230px;} /* o singura coloana, bare laterale ascunse */ body.fixed.col-1 #primary-content{width:980px;left:0;} body.fixed.col-1 #sidebar, body.fixed.col-1 #sidebar2{display:none;} /* 2 coloane, bl stanga */ body.fixed.col-2-left #primary-content{left:310px;} body.fixed.col-2-left #sidebar{left:-670px;} body.fixed.col-2-left #sidebar2{display:none;} /* 2 coloane, bl dreapta */ body.fixed.col-2-right #primary-content{left:0;} body.fixed.col-2-right #sidebar{right:0;} body.fixed.col-2-right #sidebar2{display:none;} /* 3 coloane - doua bl stanga si dreapta */ body.fixed.col-3 #primary-content{left:230px;width:520px;} body.fixed.col-3 #sidebar{right:0px;width:230px;} body.fixed.col-3 #sidebar2{left:-520px;} /* 3 coloane - doua bl stanga */ body.fixed.col-3-left #primary-content{left:460px;width:520px;} body.fixed.col-3-left #sidebar{left:-750px;width:230px;} body.fixed.col-3-left #sidebar2{left:-290px;} /* se calculeaza ca si 960px - bl1 - (bl1+bl2) */ /* 3 coloane - doua bl dreapta */ body.fixed.col-3-right #primary-content{left:0;width:520px;} body.fixed.col-3-right #sidebar{left:0;width:230px;} body.fixed.col-3-right #sidebar2{left:0;} /* latime elastica */ body.fluid .page-content{padding:0 10px;width: auto;} /* 100%-10px (10 pixeli spatiu) */ /* marimea implicita a coloanelor (se defineste mai jos pt toate situatiile elastice) */ body.fluid #primary-content{width:70%;} body.fluid #sidebar{width:30%;} body.fluid #sidebar2{width:25%;} /* o singura coloana, bare laterale ascunse */ body.fluid.col-1 #primary-content{width:100%;left:0;} body.fluid.col-1 #sidebar, body.fluid.col-1 #sidebar2{display:none;} /* 2 coloane, bl stanga */ body.fluid.col-2-left #primary-content{left:30%;} body.fluid.col-2-left #sidebar{left:-70%;} body.fluid.col-2-left #sidebar2{display:none;} /* 2 coloane, bl dreapta */ body.fluid.col-2-right #primary-content{left:0;} body.fluid.col-2-right #sidebar{right:0;} body.fluid.col-2-right #sidebar2{display:none;} /* 3 coloane - doua bl stanga si dreapta */ body.fluid.col-3 #primary-content{left:25%;width:50%;} body.fluid.col-3 #sidebar{right:0;width:25%;} body.fluid.col-3 #sidebar2{left:-50%;} /* 3 coloane - doua bl stanga */ body.col-3-left #primary-content{left:50%;width:50%;} body.col-3-left #sidebar{left:-75%;width:25%;} body.col-3-left #sidebar2{left:-25%;} /* se calculeaza ca si 100% - bl1 - (bl1+bl2) */ body.col-3-left #primary-content .blocks{margin-left:10px;} /* 3 coloane - doua bl dreapta */ body.fluid.col-3-right #primary-content{left:0;width:50%;} body.fluid.col-3-right #sidebar{left:0;width:25%;} body.fluid.col-3-right #sidebar2{left:0;} body.fluid.col-3-right #primary-content .blocks{margin-right:10px;} /* proprietatile coloanelor */ /* foarte important - desi pare ca n-are sens, float:left si position:relative ne permit sa folosim aceeasi structura html pt tipurile diferite de pagini de mai sus */ #primary-content, #sidebar, #sidebar2{ top:0; position:relative; float:left; z-index:0; overflow:hidden; min-height: 150px; } #main{ padding: 20px 0; } /* logo (titlul paginii) */ #header #logo{ margin: 0; padding: .5em .25em; font-weight: bold; font-size: 400%; letter-spacing: -0.06em; font-variant: small-caps; line-height: normal; } #header #logo a{ text-decoration: none; } /*** meniul principal ***/ /* doar un exemplu, evident se schimba in functie de design */ ul.navigation, ul.navigation li{ margin: 0; padding:0; list-style-type: none; } ul.navigation{ background: #ddd; display: block; } ul.navigation li{ float: left; position: relative; z-index: 10; } ul.navigation li a{ display: block; text-shadow: #fff 0px -1px -1px; font-size: 115%; font-weight: bold; color: #333; text-align: center; padding: 10px 15px; text-decoration: none; } body ul.navigation li a:hover, ul.navigation li.active a{ background: #eee; color: #CC0000; } /* nivel 2 si mai sus */ ul.navigation ul{ list-style-type:none; position:absolute; display:none; width:250px; top:40px; left:0; margin:0; padding:4px; line-height:normal; background-color:#fff; /* pt ie */ background-color:rgba(255,255,255, 0.75); /* transparent, doar in opera 10.5+, ff 3.6+ ... */ box-shadow:0px 8px 14px rgba(0,0,0,0.3); /* umbra */ border-bottom-right-radius:8px; /* colturi rotunde */ border-bottom-left-radius:8px; } ul.navigation li.active ul, ul.navigation li.active-parent ul,ul.navigation li.active-ancestor ul{ background-color:#000; border-bottom:1px solid #333; border-left:1px solid #333; border-right:1px solid #333; } ul.navigation ul li{ float:none; margin:0; } ul.navigation ul li a{ min-height:1px; height:auto; padding:0; text-align:left; text-transform:none; line-height:normal; font-size: 100%; } ul.navigation ul li a span.title{ padding: 10px 10px 4px 10px; display: block; } ul.navigation li.active ul a{background:none;} ul.navigation ul li.active a{color:#f8b013;} ul.navigation ul li.active li a{color:#dedede;} ul.navigation ul ul{left:240px;top:10px;border-radius:8px;} ul.navigation li:hover ul ul,ul.navigation li:hover ul ul ul,ul.navigation li:hover ul ul ul ul{display:none;} ul.navigation li:hover ul,ul.navigation li li:hover ul,ul.navigation li li li:hover ul,ul.navigation li li li li:hover ul{display:block;} /* subsol, pozitionat jos chiar daca nu avem suficient continut */ #footer{ position: absolute; bottom: 0; width: 100%; } #footer .page-content{ border-top: 1px solid #ccc; padding: 20px 0; } /* "clearfix" - inlocuieste <br clear="both" /> */ .clear-block:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0;} /* clasa ajutatoare pt efectul fadeIn/Out cu jQuery nefolosit in acest exemplu - voi posta si codul jQuery daca e necesar */ .fadeThis{position:relative;z-index:1;} .fadeThis span.hover{ position:absolute; top:0; left:0; display:block; height:100%; width:100%; z-index: 5; } /* spatiu intre imagini alineate la stanga/dreapta dintr-un articol */ img.alignleft,img.alignright{padding:3px;margin-top:4px;margin-bottom:4px;border-radius:4px;} /* la fel, dar pt alte elemente */ .alignleft{float:left;margin-right:8px;} .alignright{float:right;margin-left:8px;} .aligncenter{display:block;margin-left:auto;margin-right:auto;text-align:center;} /*** stilul pt imprimanta, trebuie dezvoltat in functie de design (eliminate imaginile si de pe alte elemente) ***/ @media print { *{font-family: "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif;} body { line-height: 1.5; color:#000; background: none; font-size: 10pt; } #page{ background: none; } hr { background:#ccc; color:#ccc; width:100%; height:2px; margin:2em 0; padding:0; border:none; } code { font:.9em "Courier New", Monaco, Courier, monospace; } a img { border:none; } blockquote { margin:1.5em; padding:1em; font-style:italic; font-size:.9em; } a:link, a:visited { background: transparent; font-weight:700; text-decoration: underline; } /* afiseaza href, invizibil pe web */ a:link:after, a:visited:after { content: " (" attr(href) ")"; font-size: 90%; } } bafta si intreaba-ti-ma orice nu intelegeti Edited by unu, 15 May 2010 - 14:44. |
#46
Posted 26 July 2010 - 11:52
Intrebarea mea este de ce se lasa spatiu la lista .De ce se face asa :
[font="Comic Sans MS"][font="Arial Black"] node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace(" over", ""); } } } } } window.onload=startList; </script> si asa : <body> <div id="wrapper"> <ul id="navi"> <li><a href="#">Un link</a></li> <li><a href="#">Un link cu sublinks</a> <ul> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> </ul> </li> <li><a href="#">Un link</a></li> <li><a href="#">Un link</a></li> <li><a href="#">Un alt link cu sublinks</a> <ul> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> </ul> </li> <li><a href="#">Un link</a></li> <li><a href="#">Un link</a></li> </ul> </div> </body></html>[/code] [/quote] [/font][/font] si nu asa : <body> <div id="wrapper"> <ul id="navi"> <li><a href="#">Un link</a></li> <li><a href="#">Un link cu sublinks</a> <ul> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> </ul> </li> <li><a href="#">Un link</a></li> <li><a href="#">Un link</a></li> <li><a href="#">Un alt link cu sublinks</a> <ul> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> <li><a href="">Sublinks</a></li> </ul> </li> <li><a href="#">Un link</a></li> <li><a href="#">Un link</a></li> </ul> </div> </body></html>[/code] [/quote] [/font][/font] |
|
#47
Posted 20 December 2010 - 00:30
Foarte, foarte misto topicul. Academic. Am invatat multe (unele care credeam ca le stiu)...
|
#48
Posted 01 August 2011 - 21:51
Quote Ok, l-am facut Sticky... Este o buna sursa de invatare pentru cei care sunt la inceput de drum. Ala a luat-o cu doctype cu xhtml strict etc. Ma omule da de unde sa stie oamenii ce e ala un element,ce e ala un tag,atribut.Nici nu stiu unde tre sa scri toate astea. PS: Nu stiu ce ai vrut sa spui cu Quote ..desi ne asteptam ca cei care vor citi cele de aici sa aibe o bruma de cunostinte de baza. |
#49
Posted 21 September 2011 - 13:46
Andrey77, on 1st August 2011, 21:51, said: Din contra. Este cel mai prost explicat tutorial care l-am citit vreodata.Ca sa ii faci pe ceilalti sa inteleaga pe deplin,trebuie sa te pui in locul lor,ca si cand n-ai sti nimic.Vei observa ca iti pui intrebari.Tot tu vei si raspunde la ele.Formuland raspunsul intr-un mod mai pe intelesul tuturor + diferite explicatii (de unde se nasc intrebarile) + exemple rezulta un tutorial. Ala a luat-o cu doctype cu xhtml strict etc. Ma omule da de unde sa stie oamenii ce e ala un element,ce e ala un tag,atribut.Nici nu stiu unde tre sa scri toate astea. PS: Nu stiu ce ai vrut sa spui cu dar daca vi cu ceva de genul:" Eu le-am spus ca trebuie sa stie cate ceva la inceput." Pai eu iti voi spune ca in tutorial trebuie sa INVETI pe ceilalti ,daca tu le pui conditia sa stie deja ceea ce ar trebui sa le explici tu ,atunci de ce sa mai citeasca tutorialul(care deja nu mai e tutorial) daca ei stiu deja? Pai da, ar trebui sa citesti ce scrie prin tutorialul asta, ca sa iti intre ceva in cap. Sau tu probabil te astepti sa incepi sa te uiti in gol la un ecran timp de 10 minute si PAC! sa stii tot? Despre DOCTYPE si alea -alea, este destul de clar explicat ce si cum si unde, insa nu te-ai obosit sa cauti. Citez: "In conformitate cu standardul w3c, un doctype (document type declaration, sau DTD) informeaza browserul despre ce versiune de (X)HTML se foloseste, pentru ca acesta sa stie care va fi modul de interpretare a paginii. El arata astfel - pentru xhtml 1.0 strict: etc etc " |
#50
Posted 13 October 2011 - 21:30
Jumping Jack, on 21st September 2011, 14:46, said: Pai da, ar trebui sa citesti ce scrie prin tutorialul asta, ca sa iti intre ceva in cap. Sau tu probabil te astepti sa incepi sa te uiti in gol la un ecran timp de 10 minute si PAC! sa stii tot? Despre DOCTYPE si alea -alea, este destul de clar explicat ce si cum si unde, insa nu te-ai obosit sa cauti. Citez: "In conformitate cu standardul w3c, un doctype (document type declaration, sau DTD) informeaza browserul despre ce versiune de (X)HTML se foloseste, pentru ca acesta sa stie care va fi modul de interpretare a paginii. El arata astfel - pentru xhtml 1.0 strict: etc etc " Ma rog,poate nu e prea corect ce am spus dar macar il face sa inteleaga pe cititor bazele.Bine,acum o sa zici ca prea caut nod in papura si cer prea multe,da m-a enervat ca se numeste tutorial.Parca tutorialele invatau oamenii ceea ce vroiau sa stie cap coada,fara sa sara peste ceva.Bn acm nu mai are rost,nu mai continui ca mi-e lene sa-ti explic,continuq-ti tutorialul,si apropo daca era ceva gen articol html sau "imbunatatiti-va cunostintele HTML" ,atunci era super tare,avand in vedere ca cei care stiu deja au ce invata de aici,insa nu si pentru cei care acum vor sa invete. |
#51
Posted 14 October 2011 - 02:49
Nici mie nu-mi place tutorialul, dar cinste vouă ca l-ați făcut și p-ăsta.
Prima greșeală ar fi ca ați bătut apa in piuă cu prea multă teorie, și nici aia intreagă, doar pentru niște taguri amărâte. Am văzut secționarea div-urilor aiurea și id in id, sau poziționarea background-ului la modul "background:url(limagine.jpg) no-repeat 1px 1px" și alte facilități din-astea care nu ar trebui să arate așa pentru un începător. Greșeli sunt destule, că de n-ar fi, topicul ăsta ar fi avut acum peste 100 de pagini. Repet, măcar v-ați dat silința și pentru ăsta. Bravo vouă. @Andrey77, ție nu ți-aș zice nimic că te cheamă ca pe mine, dar te asigur că nici tu nu ști ce e ăla doctype, diferența dintre strict, basic și celelalte, sau ce rol are in documentul html. Deci, încă nu știm html. Cred că ar trebui să lăsăm tutorialul așa cum e. Măcar unu tot a prins ceva din el. |
|
#52
Posted 14 October 2011 - 09:46
w3room, on 14th October 2011, 03:49, said: Nici mie nu-mi place tutorialul, dar cinste vouă ca l-ați făcut și p-ăsta. Prima greșeală ar fi ca ați bătut apa in piuă cu prea multă teorie, și nici aia intreagă, doar pentru niște taguri amărâte. Am văzut secționarea div-urilor aiurea și id in id, sau poziționarea background-ului la modul "background:url(limagine.jpg) no-repeat 1px 1px" și alte facilități din-astea care nu ar trebui să arate așa pentru un începător. Greșeli sunt destule, că de n-ar fi, topicul ăsta ar fi avut acum peste 100 de pagini. Repet, măcar v-ați dat silința și pentru ăsta. Bravo vouă. @Andrey77, ție nu ți-aș zice nimic că te cheamă ca pe mine, dar te asigur că nici tu nu ști ce e ăla doctype, diferența dintre strict, basic și celelalte, sau ce rol are in documentul html. Deci, încă nu știm html. Cred că ar trebui să lăsăm tutorialul așa cum e. Măcar unu tot a prins ceva din el. |
#53
Posted 22 October 2011 - 23:11
Bai, daca io eram bun de prof, scriam o carte, nu un tutorial online. Ideea initiala a tutorialului asta era de a da o serie de raspunsuri la intrebarile cele mai des intilnite pe forum. Ca eram (eu cel putin) satul de probleme legate de proasta intelegere a box modelului si erori elementare, gen tag-uri inchise aiurea si lipsa de doctype.
De altfel, este un topic deschis, fiecare este liber sa contribuie, daca crede ca are ceva de completat. Dar de ce sa construim ceva, daca putem arunca cu caramizi in altii? Ca asa e pe la noi! Evident ca daca era sa o luam de la zero absolut, altfel suna toata polologhia aia. Insa cei care vin pe forumul asta cu probleme de design nu sint nici bucatarese si nici controlori RATB (nu ca as avea ceva cu tagma lor), ci oameni care au pus deja mina pe un editor si le-a iesit ceva de pus pe ecran, insa au uitat sa se documenteze in prealabil intr-un manual de specialitate (sau tutoriale de pe web, ca pute locul de ele), ca deh, este vorba de html si css, chestii simple, nu-i asa? PS: Nu e complet, pentru ca mai avem si altele de facut, scuze. Dar revin la invitatia de mai sus catre cei care sint dispusi sa contribuie. Ca doar nu o sa punem copyright pe el! @Andrey77: Conform definitiei de pe Wikipedia, un tutorial este: "A tutorial is one method of transferring knowledge and may be used as a part of a learning process. More interactive and specific than a book or a lecture; a tutorial seeks to teach by example and supply the information to complete a certain task." Nu este nicaieri specificat ca un tutorial trebuie sa inceapa de la zero absolut. Asta e o idee pe care tu ti-o asumi, si cind vezi ca nu e cum ai crezut, Zbang! dai verdict ca e naspa. Eu cred ca titlul de tutorial se potriveste destul de bine subiectului in cauza. Ca nu e perfect, OK, se admite, insa pina la a spune ca este cel mai "prost tutorial" este mai lung drumul. Pe de alta parte te cred ca este "cel mai prost explicat tutorial care l-am citit vreodata", pentru ca nu stiu ce ai citit pina acum. Poate vii cu exemple mai bune. Peace! Edited by Jumping Jack, 22 October 2011 - 23:28. |
#54
Posted 06 November 2011 - 11:35
Nu stiu daca poastez unde trebuie dar am si eu o problema cu un css...am cautat peste tot pe net dar nu am gasit ce cautam.
Vreau ca in dreapta situ-lui sa-mi inserez o imagine oblica...nu dreapta ...ceva ca-n exemplul de aici aici ...uitati-va la imaginea din dreapta cu online Multumesc:) Edited by adi94, 06 November 2011 - 11:36. |
Anunturi
Bun venit pe Forumul Softpedia!
▶ 1 user(s) are reading this topic
0 members, 1 guests, 0 anonymous users