Vi er tilbake med den andre oppføringen i Nettuts + Q & A-serien. I dag diskuterer vi forskjellen mellom LESS og SASS, hvordan du overfører server-sideverdier til JavaScript, hvordan du arbeider med PHP og informasjonskapsler, og HTML5-doktypen. Her går vi!
Hei Nettuts +. Jeg er forvirret. Hva er forskjellen mellom LESS og SASS? Er de de samme?
Det er fordeler med å bruke begge; Men sannheten er: begge vil få jobben gjort fantastisk. Det blir for det meste tilfelle, når det gjelder syntaks og slikt. Tidligere har mange foretrukket MINDRE, fordi de hadde en mer vennlig CSS-lignende syntaks, selv om de som Sass 3 har en ny syntaks, kjent som SCSS
(Sassy CSS), som ganske enkelt er en delmengde av CSS3s syntaks.
Envato devs bruker Sass. Andre populære utviklere foretrekker mindre. Jeg vil likestille det til å sammenligne 960 CSS-rammeverket til Blueprint. De er begge store; så sett opp ditt eget sinn. Det er ingen feil svar!
Ønsker å lære mer om MINDRE på Nettuts+?
Jeg har forsøkt å finne ut hvordan jeg skal overføre verdien av en PHP-variabel til min JavaScript. Hvordan gjør jeg dette? Takk!
Den raskeste og enkleste løsningen er å ekko ønsket variabel fra JavaScript. For eksempel kan du spørre MySQL-databasen med PHP, og deretter sende den returnerte verdien til JavaScript ved å gjøre noe i tråd med:
Tut
Hvordan kan jeg velge et fargeskjema stilark for min hjemmeside dynamisk?
Så du vil, for eksempel, velge red.css, eller blue.css, og det ville laste inn et annet fargevalg for nettstedet ditt. Er det det du mener? Det er sikkert flere måter å utføre denne oppgaven på, og det riktige valget vil avhenge av om du bruker et rammeverk, et CMS, MVC, osv. La oss holde ting enkelt, og som bare-bein som mulig. Vi kan bruke PHP økter
. Først må vi legge til en å velge
boks, for brukeren å velge ønsket farge stilark.
Tut Velg stilarket ditt
Neste, med PHP, vil vi lytte etter om siden har postet tilbake - eller hvis Sende inn
knappen har blitt klikket. Med en enkel side som dette, kan vi bruke den hjelpsomme $ _SERVER [ 'REQUEST_METHOD']
.
"Request Method" bestemmer hvilken forespørselsmetode som ble brukt for å få tilgang til siden: 'GET', 'HEAD', 'POST', 'PUT' "
Øverst på siden legger du til følgende:
Siden vi nå kan bekrefte når siden har postet tilbake, kan vi deretter opprette en økt
, og lagre verdien av hva brukeren valgte fra valgboksen.
Her lager vi først en ny PHP-økt, med session_start ()
. Deretter oppretter vi en ny nøkkel, med $ _SESSION
, kalt "color_scheme." Ta gjerne navnet på det du ønsker. Som standard angir vi dette til "standard" (se "annet" -oppgaven). Dette betyr at hvis brukeren ikke har valgt et stilark, bruker vi standardversjonen. Men hvis de gjorde et valg, må vi avgjøre hvilket alternativ fra å velge
element de valgte, og lagre det i en sesjonstast.
Når du går tilbake til markeringen, finner du at vi brukte en Navn
av "farger" til å velge
element.
Når siden legger inn igjen, vil valgt verdi av denne å velge
elementet vil være tilgjengelig for oss, via $ _POST [ 'farger']
. For eksempel, hvis jeg velger alternativet "grønn", $ _POST [ 'farger']
vil da være lik «grønn».
Uten økter og informasjonskapsler ville det ikke være mulig å "huske" denne brukeren valgte verdien. Derfor er de avgjørende i dette tilfellet. Nå som $ _SESSION [ 'color_scheme']
lagrer ønsket verdi, vi trenger bare å laste inn riktig stilark.
Tut
Hei Nettuts +! Hvordan lager jeg avrundede skjemainnganger med CSS for alle nettlesere?
Så du vil ha stiliserte, avrundede innganger i alle nettlesere, inkludert Internet Explorer? Okei. Vurder følgende enkle oppslag:
Ved å bruke noen enkle CSS3, kan vi lage avrundede hjørner for disse inngangene. Fordi noen nettlesere har en headstart på spesifikasjonen, må vi bruke -moz
og -webkit
leverandør prefikser, samt den offisielle versjonen av "border-radius" eiendommen.
Ved å spesifisere en
type
attributt avsende inn
, den siste brikken vil bare målrette sende knapper, og vil stile tilsvarende.
Dessverre, som du sikkert gjettet, er Internet Explorer en rykk. Mens den kommende IE9 har støtte for border-radius
(uten prefiks), er de eldre versjonene fortsatt tap. På dette punktet har du to valg:
Jeg antar at spørsmålet om dette spørsmålet krever konsistens; så vi går med det andre alternativet. La oss anta at du skal jobbe tungt med CSS3 og HTML5 i prosjektet ditt. I så fall, i stedet for å bruke et IE-bare stilark, hvorfor ikke ha det gøy, og bruk det nyttige Modernizr-biblioteket?
Først last ned Modernizr, og referer til modernizr.js-filen i prosjektet ditt.
Tut
Deretter gjelder en klasse av no-js
til html
element på siden din.
Når du ser prosjektet ditt i nettleseren, bruker Modernizr en lang rekke klasser til html
element, som spesifiserer nøyaktig hva nettleseren din er i stand til. Vær oppmerksom på at denne listen av klasser vil tydeligvis variere, avhengig av nettleseren.
Dette er en stor hjelp! Nå kan vi bruke "cascade" -effekten til å bare målrette mot formelementene som er barn av html
element med en klasse av "no-borderradius" og stil tilsvarende.
Hvis nettleseren ikke støtter en bestemt funksjon, blir ordet "nei" prefiks til regelen.
/ * Kun målrettes nettlesere som ikke støtter grense-radius * / .no-borderradius-inngang bakgrunn: url (bane / til / avrundet / bakgrunn / bilde) no-repeat;
Og så slapper vi av og har kake.
Jeg la merke til at du alltid bruker HTML5-doktypen. Tror du ikke det er farlig, når alle nettlesere ennå ikke støtter HTML5?
Nei, det er ikke farlig i det hele tatt. For de som ikke er kjent med den fantastiske, enkle HTML5-doktypen, er det:
Seriøst ... det er det. Det er alt der er til det. Ikke flere multi-line spott av attributter; bare en plain-ole DOCTYPE - som det burde være. I eldre nettlesere vil denne doktypen utløse dem standarder-modus
... Og hvis du fortsatt er bekymret, merk at selv Google bruker det! Trenger mer? John Resig snakket om dette for 2,5 år siden!
"Hva er fint med denne nye DOCTYPE, spesielt er at alle nåværende nettlesere (IE, FF, Opera, Safari) vil se på det og bytte innholdet til standardmodus - selv om de ikke implementerer HTML5. Dette betyr at du kan begynn å skrive websidene dine ved hjelp av HTML5 i dag, og få dem til å vare i veldig, veldig lang tid. "
-John Resig
Hvis du har et "ikke-for-komplisert" webutviklingsspørsmål for oss, kan du:
Takk for at du leser og ser på!