Share
Am revenit cu a doua intrare în seria Nettuts + Q & A. Astăzi, discutăm despre diferența dintre LESS și Sass, cum să treci valorile din partea serverului în JavaScript, cum să lucrezi cu PHP și cookie-uri și de doctype HTML5. Începem!
Hei Nettuts +. Sunt derutat. Care este diferența dintre LESS și Sass? Sunt aceleași?
Există avantaje pentru utilizarea ambelor; cu toate acestea, adevărul este că ambele vor face treaba minunat. Ea devine cea mai mare parte un caz de preferință, atunci când vine vorba de sintaxa și altele. În trecut, mulți preferați mai puțin, deoarece aveau o sintaxă mai prietenoasă cu CSS, deși, din Sass 3, au o nouă sintaxă, cunoscută sub numele de SCSS (Sassy CSS), care este pur și simplu un subset al sintaxei CSS3.
Envato devs folosește Sass. Un alt dezvoltator popular preferă mai puțin. Aș echivala compararea cadrului 960 CSS cu Blueprint. Ambele sunt minunate; așa că fă-ți mintea. Nu există răspunsuri greșite!
Doriți să aflați mai multe despre LESS pe Nettuts+?
Am încercat să-mi dau seama cum să trec valoarea JavaScript a unei variabile PHP. Cum pot face acest lucru? Mulțumiri!
Cea mai rapidă și mai ușoară soluție este de a echivala variabila dorită din cadrul JavaScript. De exemplu, ați putea interoga baza de date MySQL cu PHP și apoi să transmiteți valoarea returnată JavaScript-ului dvs., făcând ceva în paralel cu:
tt
Cum pot să aleg o schemă de stil pentru site-ul meu dinamic dinamic?
Deci, doriți, de exemplu, să alegeți red.css, sau blue.css, și care ar încărca o schemă de culori diferită pentru site-ul dvs. web. Asta vrei să spui? Există cu siguranță mai multe modalități de a îndeplini această sarcină, iar alegerea corectă va depinde dacă folosiți un cadru, un CMS, MVC etc. Să păstrăm lucrurile simple și ca oasele goale. Putem folosi PHP sesiuni. În primul rând, trebuie să adăugăm o Selectați , pentru ca utilizatorul să aleagă foaia de stil dorită.
tt Alegeți foaia de stil
Apoi, cu PHP, vom asculta dacă pagina a postat înapoi - sau dacă A depune a fost făcută clic pe butonul. Cu o pagină simplă, cum ar fi aceasta, putem folosi utilul $ _SERVER [ 'REQUEST_METHOD'].
"Metoda de solicitare" determină ce metodă de solicitare a fost utilizată pentru a accesa pagina: "GET", "HEAD", "POST", "PUT" "
În partea de sus a paginii, adăugați următoarele:
Din moment ce putem confirma acum când pagina a postat înapoi, putem crea un sesiune, și să stocați valoarea a ceea ce a ales utilizatorul din caseta de selectare.
Aici, noi creăm mai întâi o nouă sesiune PHP, cu session_start (). Apoi, vom crea o nouă cheie, cu $ _SESSION, numit "color_scheme". Simțiți-vă liber să numiți așa cum doriți. În mod implicit, am setat acest lucru la "implicit" (a se vedea instrucțiunea "altceva"). Aceasta înseamnă că, dacă utilizatorul nu a selectat o foaie de stil, vom folosi opțiunea implicită. Cu toate acestea, dacă au făcut o alegere, trebuie să determinăm ce opțiune din Selectați elementele pe care le-au ales și să le stocheze într-o cheie de sesiune.
Revenind la marjă, veți găsi că am aplicat a Nume de "culori" la Selectați element.
Când pagina revine înapoi, valoarea selectată din asta Selectați elementul va fi disponibil pentru noi, via $ _POST [ 'culori']. De exemplu, dacă aleg opțiunea "verde", $ _POST [ 'culori'] va fi apoi egal cu "verde".
Fără sesiuni și cookie-uri, nu ar exista nicio modalitate de a "aminti" această valoare selectată de utilizator. De aceea sunt esențiale în acest caz. Acum că $ _SESSION [ 'color_scheme'] stochează valoarea dorită, trebuie doar să încărcăm foaia de stil corespunzătoare.
tt
Bună Nettuts +! Cum pot crea intrări de formă rotunjită cu CSS pentru toate browserele?
Deci, doriți intrări stilizate, rotunjite în toate browserele, inclusiv în Internet Explorer? Okie dokie. Luați în considerare următoarea marjă simplă:
Folosind un simplu CSS3, putem crea colțuri rotunjite pentru acele intrări. Deoarece unele browsere au avut un start pe spec., Trebuie să folosim -Moz și -WebKit prefixele furnizorilor, precum și versiunea oficială a proprietății "border-radius".
Prin specificarea a
tipatributul luia depune, ultimul fragment va viza numai butoanele de trimitere și va schimba în mod corespunzător.
Din păcate, după cum probabil ați ghicit, Internet Explorer este un jaf. În timp ce IE9 viitoare are suport pentru border-radius (fără prefix), versiunile mai vechi sunt încă în pierdere. În acest moment, aveți două opțiuni:
Presupun că solicitantul acestei întrebări necesită consistență; așa că vom merge cu a doua opțiune. Să presupunem că veți lucra mult cu CSS3 și HTML5 în proiectul dvs. În acest caz, mai degrabă decât să utilizați o foaie de stil numai pentru IE, de ce să nu vă distrați și să folosiți biblioteca Modernizr?
Mai întâi, descărcați Modernizr și trimiteți fișierul modernizr.js în cadrul proiectului dvs..
tt
Apoi, aplicați o clasă de no-js la html element pe pagina dvs..
Când vizualizați proiectul în browser, Modernizr va aplica un șir lung de clase la html element, care specifică exact ceea ce este capabil de browserul dvs. Rețineți că, evident, această listă de clase va varia, în funcție de browser.
Acesta este un ajutor imens! Acum putem folosi efectul "cascadă" pentru a viza numai elementele de formă care sunt copii ai html element cu o clasă de "no-borderradius", și stil în consecință.
Dacă browserul nu acceptă o anumită caracteristică, cuvântul "nu" va fi prefixat regulii.
/ * Sunt direcționate numai browserele care nu acceptă raza de frontieră * / .no-borderradius input background: url (cale / spre / rotunjit / fundal / imagine) no-repeat;
Și apoi ne relaxăm și avem tort.
Am observat că utilizați întotdeauna doctype HTML5. Nu credeți că este periculos, când toate browserele nu acceptă încă HTML5?
Nu, nu e deloc periculos. Pentru cei necunoscuți cu doctype-ul minunat de HTML5, este:
Serios ... asta e. Cam despre asta e. Nu mai există mai multe rânduri de atribute multiple; doar un DOCTYPE simplu - așa cum ar trebui să fie. În browsere mai vechi, această doctype îi va declanșa standarde-mode... Și dacă sunteți încă îngrijorat, rețineți că și Google o folosește! Nevoie de mai mult? John Resig vorbea despre asta acum 2,5 ani!
"Ce este frumos în legătură cu acest nou DOCTYPE, în special, este că toate browserele actuale (IE, FF, Opera, Safari) se vor uita la el și vor schimba conținutul în modul standard - chiar dacă nu implementează HTML5. începeți să scrieți paginile dvs. web utilizând HTML5 astăzi și să le durați foarte mult, foarte mult timp. "
-John Resig
Dacă aveți o întrebare de dezvoltare web "nu prea complicată" pentru dvs., puteți:
Vă mulțumim pentru citire și vizionare!
Accentsconagua