45 Powerful CSS / JavaScript Techniques

width = "650">
width = "650">
Smashing-žurnāls-Sludinājuma 45 Powerful CSS / JavaScript Techniques /> 45 Powerful CSS / JavaScript Techniques 45 Powerful CSS / JavaScript Techniques 45 Powerful CSS / JavaScript Techniques

Spacer 45 Powerful CSS / JavaScript Techniques

CSS un JavaScript ir ārkārtīgi spēcīgi instrumenti, dizaineriem un izstrādātājiem. Tomēr dažreiz ir grūti izstrādāt viena lieliska ideja, kas varētu atrisināt problēmu, ka esat saskaras šobrīd. Labas ziņas: gandrīz katru dienu dizaineriem un izstrādātājiem nāk klajā ar svaigu un gudrs CSS trikiem un paņēmieniem un dalīties tajos ar citiem izstrādātājiem tiešsaistē. Mēs regulāri apkopot visus šos trikus, filtrēt tos, šķirot tos, pārskata tos un sagatavot viņus Smashing Magazine lasītāji.

Šo amatu mēs piedāvājam 45 noderīgs CSS / JavaScript paņēmienus, kas var palīdzēt jums atrast gudrs risinājumus dažām no savām problēmām, vai vienkārši iedvesmojieties, kādā ir iespējams ar CSS. Mēs uz interesantu CSS-tehnoloģijas, navigācijas izvēlni, CSS tipogrāfijas, CSS saraksti un CSS pogām. Šajā amatā uzmanība ir uz CSS, lūdzu ievērot, ka dažas metodes izmantot JavaScript vai PHP, lai uzlabotu funkcionalitāti.

Lūdzu ievērot, ka šī ir pirmā daļa no mūsu lielu round-up svaigu CSS / JavaScript metodes. Citas metodes (CSS galdi, CSS izkārtojumiem, CSS mobilajām un CSS veidlapas), tiks iekļauti ar gaidāmo rakstu. Tik neaizmirstiet parakstīties uz mūsu RSS barību un sekot mūs par čivināt, lai līdzīgi izstrādājumi un to plūsmu noderīgus resursus. Lūdzu arī paziņojiet mums zina, ko mums vajadzētu mainīt vai uzlabot mūsu nākotnei amatu!

Mēs apzināmies, ka daudzi lasītāji ir noguruši no "saraksts" peldošā pa tīmekli, bet mēs esam pārliecināti, ka lielākā daļa no mūsu apmeklētājiem būs ieguvums no šo ziņu formātā un atrast vismaz dažas metodes, parādot kas šajā amatā noderīga.

Interesantu CSS Techniques

Building New Visual anotācijas /> Tie, ņemiet vērā pārklājumu sastāv no diviem galvenajiem elementiem, pārklāt ar spīdumu un robežu ar pārredzamību. Ļoti interesanti, bet vienkāršu tehnika ZURB Dizaina Aģentūra, dizaineri, kuri ir uzrakstījuši vairāki panti par Smashing Magazine as well.

Anotāciju 45 Powerful CSS / JavaScript Techniques

Sexy Music Album pārklājumu /> Tas, kurai ir pakļauts parāda, kā stila mūziku plūsmām, un tā nodrošina jums dažas grafikas darīt.

Css-112 45 Powerful CSS / JavaScript Techniques

Krāsains ar CSS & jQuery Clock /> Šī apmācība aprakstīts, kā var radīt pulksteni, izmantojot pamata CSS un JavaScript.

Css-086 45 Powerful CSS / JavaScript Techniques

Kā izveidot dziļu un Nice 3D Lentes izmanto tikai CSS3 /> Mēs izmantosim box-shadow izveidot drop-ēna ar RGBA, krāsu modeli, kas ļauj optimizēt kontrasts ar visa veida apstākļiem. RGBA ir standarta RGB modeli (0,0,0 - 255.255.255), un piebilst, pēdējais variants () par dūmainības. Mēs varam izmantot šo modeli arī citas īpašības, un tas strādā ar jauno pārlūku.

Css-197 45 Powerful CSS / JavaScript Techniques

Advanced Notikumu hronika ar PHP, CSS un jQuery /> Tas Advanced Event skala tiek izmantota izmantojot PHP, MySQL, CSS un jQuery. Rezultāts: jauka laika līniju ar klikšķināmās notikumiem. Pievienojot jaunus gatavojas tik vienkārši, kā ievietot rindu datu bāzē.

Css-195 45 Powerful CSS / JavaScript Techniques

CSS Navigation Izvēlnes

CSS 3D Meninas /> Es esmu ņēmusi klasiskās krāsas Goda Maids (Galminieces) un izveidoja CSS pseido-3D / paralakse efektu. Tas ir tīrs CSS, bez JavaScript vai Flash ir iesaistīti. Tas ir pārbaudīts un strādā 8 Internet Explorer, Firefox 3, Opera 9, Safari 3, hromēts 4 un Konqueror 3,5, un tas apstiprina, too.

Css-006 45 Powerful CSS / JavaScript Techniques

Sproing! - Veikt Elastīgas Thumbnail Menu /> "In pastāvīgi cenšas piedāvāt alternatīvas metodes egle līdz izvēlnes, esmu pieced kopā elastīgs sīktēlu izvēlni. Tā Palielina menu items, ja tie ir hovered vairāk un menu items paplašināt uz augšu.

Css-063 45 Powerful CSS / JavaScript Techniques

Kā izveidot vienkāršu un efektīvu Starpsumma neto aktīvu vērtību ar Definīciju saraksti /> "Kad mums ir vajadzīgas vienkāršas un efektīvas uz lapas navigācija, vai nu pāriet uz saturu lapā vai uzsist uz citu skatu, mēs izmantojam dl elementu. Tās apakšprogrammām elementi, dt un dd, padara to ļoti viegli mūs radīt iekļautās saites ar skaidru marķējumu. Šeit mēs spēsim dalīties ar jums ātrs, viegls veids, lai kā mēs izmantosim CSS to izdarīt. "

Css-072 45 Powerful CSS / JavaScript Techniques

Lipīgs SideNav izkārtojums ar CSS /> Uzziniet, kā izveidot noteiktu sidenav izkārtojumu jūsu emuāram vai tīmekļa vietne. Kam noteikta sidenav nāk parocīgs, strādājot ar bloga stilu mājas lapas, kur saturs ir ļoti augsts un ir laba summa, ritinot nepieciešams. Noteikts navigācija ļauj lietotājam kruīza pa saturu bez ritināšanas atpakaļ līdz augšpusē, lai pārvietotos pa pārējo vietā.

CSS-056 45 Powerful CSS / JavaScript Techniques

Neuzbāzīgs Nolaižamajā Page Changer /> Ar <select> nolaižamo izvēlni, lai izveidotu navigācija nav tik kopējo tā vienreiz bija, bet tā vēl joprojām ir apkārt. Un tas bija izvilkts par diezgan laba, ir pieejama / uzbāzīgs. Tiešām daudz skriptus jūs uzzināsiet tur izveidot izvēlnes, piemēram, tam ir šādā veidā. Bummer. Let's make vienu, kas darbojas ar vai bez JavaScript.

Css-015 45 Powerful CSS / JavaScript Techniques

CSS Navigation: Nav JavaScript, jQuery vai attēlu Required, Free CSS navigācijas / pagination ar Tooltip /> CSS-navigācijas / pagination joslā bez JavaScript. Ir uz hover Tooltip par 'iepriekšējais' un 'nākamais' lapas lodēm, kas padara navigācijas vieglāku.

Css-170 45 Powerful CSS / JavaScript Techniques

Kā ar Kodeksu dublēšanās Tabbed Main Menu /> Main navigation menu ir, ka daļa no mājas lapas dizains, kas padara visu vietni izskatās dzīva un pilnīgs. Bet visizplatītākajā navigācijas izvēlni stils joprojām tiek izmantota partiju tabbed navigācijas izvēlnē. Te ir pamācību par to, kā kods pārklājas cilnes izvēlni.

Css-187 45 Powerful CSS / JavaScript Techniques

Risinājums ļoti garš nolaižamajā Izvēlnes /> "Man patīk būt pārliecinātiem, ar amata nosaukumiem, bet šajā gadījumā patiesībā nav iespējams risinājums, ļoti ilgi dropdowns. Ar gariem dropdowns problēma ir tā, ka nolaižamajā pats var iet zem "reizes" ir mājas lapā. Tas ir, zemāk redzamā laukuma pārlūkprogrammas logā. Tātad, lai piekļūtu šiem menu items zemāk, nepieciešams, lai ritinātu Jūsu pārlūka logā. Tiem, kas no mums ritiniet riteņiem kādu no mūsu pelēm (Peles?), Tas nav liels darījumu. Attiecībā uz tiem nav, tie zemāki menu items ir pilnībā nepieejami, jo lietot pārlūku ritjoslu līdzekļi mousing off menu (un, iespējams, kam ir tuvu). "

Css-052 45 Powerful CSS / JavaScript Techniques

Mega Drop Down Menu w / CSS & jQuery /> Ja lieto pareizi, mega nolaižamās izvēlnes var būt diezgan efektīvs, lai liela mēroga tīmekļa vietnēs. Let's eksperimentēt ar dažādiem veidiem, kā īstenot šo metodi. Tutorial by SOH Tanaka, Smashing Magazine kārtējās autors.

Css-053 45 Powerful CSS / JavaScript Techniques

CSS Tipogrāfija un ķermeņa kopija

Kā izveidot Anaglyphic Text Effect Cool ar CSS /> Anaglyphs ir tie, amazing 3D attēlus, kas ir izveidotas ar ieskaitu, divi sarkano, zaļo un zilo kanālu, un tiek skatīti ar nerdy meklējat 3D brilles ar dažādu krāsu lēcas. Es nezinu, vai šis efekts darbojas reāla, jo man diemžēl nepareizi manu 3D specs, bet tas ir diezgan foršs teksts efekts tomēr! Let's to apskatīt, kā līdzīgu stilu, var tikt radīti sprucing jūsu web dizainu, vienlaikus ņemot vērā semantika un izvairīties no atkārtošanās, veicot jebkuras atzīmes.

Css-193 45 Powerful CSS / JavaScript Techniques

Tipogrāfisks darba plānotājs /> Ievadiet, nedaudz HTML / CSS tipogrāfijas darbu plānotājs. Izmantojot dažas super-semantiskās HTML un domuzīme CSS varat kuģis skaists meklē vēl neticami vienkāršu darbu plānotājam jums un jūsu darbiniekiem.

Css-199 45 Powerful CSS / JavaScript Techniques

Retināšana Teksts WebKit (Safari) /> Safari ir ne tik jaukā veidā šķirošanas veido tekstu, izmantojot sub-pixel rendering. Uz iepriekšējām versijām Safari, tas tika noteikts ar tekstu ēnu deklarāciju, bet kopš Snow Leopard šīs metodes vairs nedarbojas. Par laimi, ir alternatīva.

Css-196 45 Powerful CSS / JavaScript Techniques

Pseudo Drop Caps /> Viņi ir pazīstams jau, bet tagad parādās žurnālos, drukas un tagad internetā. Dizaineri un izstrādātāji gan ir eksperimentējuši ar vairākiem workarounds izmantot inline stilus, izmantojot attēla nomaiņu, bet gan ar šo risinājumu ir problēmas. Piemēram, kas notiek, kad jūs atjaunotu savu vietu un izlemt, ka jūs vairs nevēlaties augšupielādēt piliens vāciņu attēlus, jūs tagad gatavojas kreisi ar šķelto attēlu sākumā katru dienests, kas jums agrāk izveidots, tas ir protams, pieņemot, ka jūs neesat izmantojis teksta ievilkumā. Ja jūs izlēmu iet uz leju inline stils ceļu tad Jums ir tikai slikti, tikai ļoti slikti.

Css-081 45 Powerful CSS / JavaScript Techniques

Kā izveidot Perfect Pre Tags /> Ja jūs darbojas tīmekļa vietne, iezīmes daudz koda piemērus, jūs zināt, cik svarīgi ir pavadīt dažas kvalitātes laika stilu &tl; pre> elements. Ja kreisā unstyled, savvaļas <pre> tagi būs rullēt jūsu sākotnēji formatētas saturu un iznīcināt jūsu vietnes izkārtojumu. Dažādi pārlūki apstrādāt <pre> tag diezgan atšķirīgi, ievērojami atšķiras to default apstrādei font-izmēriem, ritjoslu, kas padara, un vārdu iesaiņojuma. Patiešām, kļūst jūsu sākotnēji formatētas koda meklēt konsekventu, lietošanu un stilīgs pāri pārlūkiem nav viegls uzdevums, bet tas noteikti var izdarīt. Šajā rakstā ir viss nepieciešamais, lai izveidotu pareizu <pre> tagus.

Css-090 45 Powerful CSS / JavaScript Techniques

Uzlabot savu tīmekļa tipogrāfija ar sākotnējo maiņu /> Sākuma ir neredzams, no kura visu veidu rakstzīmes sēdēt, lai gan, protams, dažas rakstu zīmes (ieskaitot "j", "p", "g" un "y") ir descenders kas karājas zem sākotnējā. Izejas maiņa saistīta ar kustīgu rakstzīmes augšu vai uz leju attiecībā pret bāzes līniju un izmanto to efektīvi var sniegt milzīgu atšķirību profesionālu izskatu jūsu veidu. Kaut gan izejas maiņa tradicionāli ir bijusi daļa izmantot rīkus, piemēram, InDesign vai Quark, ir veidi, lai veiktu tādu pašu rezultātu, izmantojot CSS.

Css-109 45 Powerful CSS / JavaScript Techniques

Typograph - Scale & Rhythm /> Šī lapa ir gan eseja, un rīks. Tas ir paredzēts izpētīt to, kā divas, savstarpēji saistītu jēdzienu kopums, kas bieži vien rotaļīgas bet dažreiz bezkaunīgs, var veicināt dejot web lapas. Velciet krāsainu kastes pa skalu, lai mest šos vārdus no jauna. Par lielāko daļu, šis teksts ir tikai libreta par rezultātiem jūs gatavojaties spēlēt uz tās.

Css-085 45 Powerful CSS / JavaScript Techniques

Fancy Citāti Ar jQuery, AJAX & CSS /> Uzziniet, kā izveidot iedomātā citātu reitingu sistēma, kas būs redzams skaitu slavens quotes un ļaus Lapas apmeklētāju novērtēt savu izlasei.

Css-156 45 Powerful CSS / JavaScript Techniques

Kā radīt vienkāršus, stilīgu un swap Image paraksti /> Visvairāk attēla aprakstu risinājumiem vajadzīga daudz pārmērīgas HTML, ir grūti pārstrādāt vai nav skaidri sazināties, ka tie pieder attēlu. Let's redzēt, ko mēs varam darīt, lai risinātu šīs problēmas.

Css-189 45 Powerful CSS / JavaScript Techniques

Stils foto parakstus ar CSS /> Protams, dažas fotogrāfijas ir pašsaprotami, bet lielākā daļa fotogrāfijas vislabāk ar tekstu parakstus. Tā ir taisnība tradicionālajiem plašsaziņas līdzekļiem, piemēram, avīzes un žurnālus, un tieši tāpat kā tas attiecas blog posts un web izstrādājumiem. Šeit ir ātrs gals par lietojot foto parakstus un stila tos lieliski ar maģiju CSS.

Css-183 45 Powerful CSS / JavaScript Techniques

Attēlu parakstus Web lapas /> Šis dokuments ierosina trīs veidus, kā pasniegt attēlu ar parakstu HTML. Styling in CSS ir apspriesti.

Css-176 45 Powerful CSS / JavaScript Techniques

Styling Post Nozares Tas Stick Out /> "Pēdējā laikā, es esmu ievērojis tendenci in blog post pozīcijās, kur tas spieķi no tā pamatnes izkārtojumu. Es vēlētos dalīties ar šo tehniku, lai tiem, kas vēlas dot savu amatu pozīcijām jaunu stilu. Viens gals paturēt prātā, veidojot šo ir panākt, lai pārliecinātos, vai tā atbilst jūsu mērķa auditorijas ekrāna izšķirtspējai. Ievērojiet, ka šo metodi var mainīties atkarībā no Jūsu dizainu. Mans mērķis ir, lai jūs saprastu galvenā koncepcija ar šo pamācību, lai jūs varētu eksperimentēt un izmantot to savu projektus. "

Izmantojot daudzpunkti ar HTML un CSS /> Ja teksts ir pārāk plašs, lai ievietot konteinerā, jauku risinājumu var būt daudzpunkti, lai pierādītu, ka ir vairāk pieejamo informāciju. Kaut arī šobrīd nav daļa no oficiālās HTML specifikācijas, ir iespējams iegūt daudzpunkti noteikti CSS un tas darbojas uz Internet Explorer, Safari, Chrome, un Opera. Tas nedarbojas Firefox, bet tur ir risinājums, ko var izdarīt ar jQuery.

5 Ziņojuma aiļu Style sūtīt paziņojumus ar CSS /> Šajā rakstā bez paziņojuma aiļu izmantošana / pielāgot, kā arī ļoti vienkāršu paņēmienu, lai izveidotu savu tie, kas aizgūts no šīs Roundup.

CSS Lists

Izveidot Microsoft Word-Style Struktūrskats ar CSS /> Kā jūs redzat, pārlūkā nav apnikt mainīt atkāpi stils daudz, vai mainītu saraksta tipu no romiešu cipariem alfabēta rakstzīmēm, un tā tālāk ... visas lietas, ko mēs esam tik izmanto redzēt, jo Microsoft Word un citi rakstīšanas programmas darīt tos pēc noklusējuma. So let's izmantot mazliet CSS atjautība, lai Microsoft Word viltus kontūru, izmantojot pasūtīts sarakstus!

Css-188 45 Powerful CSS / JavaScript Techniques

Pure CSS Timeline /> Es gribēju veidot CSS grafiks "Par" sadaļu manā vietā, vienlaikus izmantojot tīrus un vienkārši atzīmes. Es gribēju izvairīties no attēliem, cik vien iespējams, lai es pavadīju pāris minūtes prototipēšana dažas iespējas un nāca klajā ar šķīdumu, izmantojot Nenumurēts sarakstus. Rezultāts ir vienkārša un tīra meklējat grafiku ar ļoti taisni uz priekšu atzīmes. Šajā rakstā es jums daļa mana pieeja, lai izveidotu grafiku no CSS un HTML, kuru rezultātā nice looking, vienkārši laika. "

Css-106 45 Powerful CSS / JavaScript Techniques

Automātiskā numurēšana ar CSS Skaitītāji /> Rakstot dokumentus, bieži ir lietderīgi uz numuru sadaļu un ir satura rādītājs. Jūs varat numurs šiem ar roku, tieši atzīmes, bet tas var būt laikietilpīga, ja rīkojums izmaiņas un jums rediģēt visus numurus. CSS2.1 dod mums automātiskā veidā, lai radītu skaitļiem, izmantojot CSS skaitītājus, un šis raksts būs staigāt jūs ar to, kā tos izmantot. Vienu vārdu, ņemiet vērā, pirms sākam, ka CSS letes vēl nav īstenoti IE, lai gan tie ir par ceļvedi IE8.

Css-116 45 Powerful CSS / JavaScript Techniques

CSS trikiem, lai pielāgotu aizzīmju

Css-129 45 Powerful CSS / JavaScript Techniques

Elastic Calendar Styling ar CSS /> Tradicionālās kalendārs ir numurētas kastes tīkla lapā. Kā web dizainers, tu varētu iet pa labi uz galda, un es nebūtu vaina jums par to. Galdi, tomēr, dažkārt var būt sarežģīta, lai muskuļu apaļu formu. CSS pūrists manī izpaužas pissed kad es noteikt platumu tabula (vai šūnu) un nolemj tā zina labāk un aug vai samazinās pēc saviem ieskatiem. /> Varat risināt kalendārs stils ar tīru CSS, un es uzskatu, tas padara tikpat liela nozīme semantiski kā galda dara. Kas ir kalendārs, ja ne Numurēts saraksts dienu? Izmantojot CSS, mēs varam arī darīt dažas labas lietas, piemēram, darīt visu, kas mūsu lieluma ar EMS tik mūsu kalendāra izkārtojums būs elastīgs. Tas ir augt gan platumā un augstumā, ja teksts ir mainīti pārlūkprogrammās, vienlaikus ievērojami palielinot pieejamību.

Css-030 45 Powerful CSS / JavaScript Techniques

Stils sarakstu One Pixel /> Viena pikseļa fona attēlu var diezgan daudzpusīga lieta. Ar repeat-x var būt horizontāla līnija, atkārtojiet-y rada vertikālu līniju, un atkārtot padara to aizpildījuma krāsu. Tāpat kā mazliet jautri koncepcijas mēs varam izmantot, ka, lai radītu dziļuma-chart meklē Nenumurēts saraksts.

Css-017 45 Powerful CSS / JavaScript Techniques

Style Your Numurēts saraksts /> Pēc noklusējuma, vairums pārlūkprogrammu displejs Numurēts saraksts numurus tāda paša fonta stilu kā pamattekstu. Šeit ir ātrs CSS apmācība par to, kā jūs varat izmantot Numurēts saraksts (OL) punktu un (p) elementu konstrukcijas stilīgs numurētu sarakstu.

Css-029 45 Powerful CSS / JavaScript Techniques

Imitē tabula Izmantojot Nenumurēts saraksts /> Jūsu pirmo jautājumu uzreiz varētu būt, "kāpēc es gribētu, lai modelētu tabulu sarakstu, kāpēc ne tikai izmantot galda?" Ar izvirzīt popularitāti AJAX sortable saraksta elementus, izmantojot saraksta elementu, kas pārstāv vairāku kolonnu datus tabulu var ļaut, lai viegli šķirošanu dažādu vairāk "tabley" informācija. So let's get started.

Css-031 45 Powerful CSS / JavaScript Techniques

8 dažādi veidi, kā skaisti stils HTML sarakstiem ar CSS /> "Izmantot HTML sarakstiem (<ol> par Numurēts saraksts, <ul> par Nenumurēts saraksts) ir ļoti bieži šajās dienās. Šodien mēs gatavojamies skatīties mazliet tālāk, nekā izveidot regulāru saraksti, parādot 8 dažādus veidus, kā skaisti stils HTML sarakstiem ar CSS. Mēs izmantosim dažu tīrs CSS paņēmienus, lai garlaicīgi saraksts izskatās lieliski (un pat ir dažas papildus funkcionalitāti). "

Css-042 45 Powerful CSS / JavaScript Techniques

Quick Tip - Vienkāršot saraksts Margins ar CSS /> Vai esat kādreiz noteikt noklusējuma starpība izkārtojumu, un tam nācās atgriezties un manuāli pielāgot visus savus sarakstus? Pēc noklusējuma saraksta vienuma marķieri ir negatīva pozicionēšanu attiecības ar saraksta elementu pati. Tas nozīmē, ka nulles ing no starpības automātiski noved pie pārplūdes ja saraksts ir iekļauts iekšpusē kaut kas cits. Vai nebūtu vienkāršāk īstenot saraksta vienumu marķieris pie paša sākuma, kā citus elementus vietā? Lucky mums, tur ir stils, lai palīdzētu darīt tieši to. Let's redzēt, ko var izdarīt ar list-style-position īpašumu.

Css-068 45 Powerful CSS / JavaScript Techniques

Sexy HTML List triki /> Redzi visuresoša saraksta elementus, <ul> un <ol>. Šie divi sexy elementi palīdz miljonu mājas lapu displejs informācijas saraksti, kas nepiesārņo vidi, semantiskā veidā. Bez tām mēs būtu indeksēšanu apmēram tāpat netīrs cavemen, ēšanas netīrumiem un gaudošana uz mēness. Bet šie saraksti elementi nav tikai sexy, tās ir arī ļoti elastīga, ļaujot mums pazemīgs dizaineriem izveidot spēcīgu sarakstu konfigurācijas, kas ir semantiski daudzpusīgi un ļoti pielāgojama.

Css-091 45 Powerful CSS / JavaScript Techniques

Klikšķināmi <li> /> Es sākotnēji kodē uzcenojums ir galda, bet atklāta problēma, kad es centos darīt visu rindu klikšķināšanai. Man tas beidzās ar sarakstu rakstus vietā.

Css-061 45 Powerful CSS / JavaScript Techniques

CSS Buttons

Vienkārši pogas v2 /> Šī metode sniedz pogas lieluma, kas vienmēr atbilst saturam. Ir 3 states: neaktīvs, aktīva un lidināties. Metode darbojas visās lielākajās pārlūkprogrammās un nav nepieciešams JavaScript.

Css-099 45 Powerful CSS / JavaScript Techniques

Kā veikt sexy pogas ar CSS /> Šī apmācība Jums iemācīs, kā izveidot diezgan meklē teksta pogas (ar alternatīvu nospiesta valsts), izmantojot CSS. Dynamic pogas ietaupīt kaudzes laiku citādi pavadīts veidojot grafiku un būtībā jums laimīgāki personai beigu dienā.

Css-173 45 Powerful CSS / JavaScript Techniques

Šķidrums Krāsa Regulējama CSS Buttons /> Ja strādā ar lielu vietu ar vairākām pogām, to var diezgan garlaicīgs, lai visas pogas Photoshop. Turpmākā korekcijas liekvārdība un krāsas var būt laikietilpīga. Ar kuru dinamiskā pogas, šis scenārijs ir daudz vieglāk strādāt, un kam ir šķidruma un krāsu regulējams pogas ar CSS, mēs nespēsim mainīties liekvārdība un krāsas zibspuldzi.

Css-175 45 Powerful CSS / JavaScript Techniques

Izveidot pogu ar Hover un aktīvas, kuras izmanto CSS Sprites /> Pārāk daudzi dizaineri nolaidība uz valsts active īpašuma in CSS) ar web dizainu, vai nu tāpēc, ka viņi nezināja par to, nepietiekami novērtēt, cik svarīgi ir tas, vai ir vienkārši slinks. Tas ir vienkārši sekas, kas uzlabo izmantojamību, sniedzot lietotājam dažas atsauksmes par to, ko viņi ir noklikšķinājis uz, bet var arī pievienot dziļums dizainu.

Css-159 45 Powerful CSS / JavaScript Techniques

Atjaunošanās poga /> "Es domāju, ka būtu interesanti, lai nodrošinātu daļu fonā, pogas šeit, un pārrunāt dažas iterāciju mēs esam ar tik tālu nokļūt pašreizējā stāvoklī."

Css-134 45 Powerful CSS / JavaScript Techniques

Noapaļotas formas pogas

Css-101 45 Powerful CSS / JavaScript Techniques

Google Imageless Buttons /> Interesantas diskusijas par dažādiem pogas dizaina metodes rekonstruēt Google imageless pogas.

Stay tuned!

Šī ir pirmā daļa no mūsu lielu round-up svaigu CSS / JavaScript metodes. Neaizmirstiet parakstīties uz mūsu RSS barību un sekot mūs par čivināt, lai līdzīgi izstrādājumi un to plūsmu noderīgus resursus. Lūdzu arī paziņojiet mums zina, ko mums vajadzētu mainīt vai uzlabot mūsu nākotnei amatu!

/> Vai jūs gribētu redzēt vairāk līdzinās tvarstīt uz Smashing Magazine nākotnē? (Atbildes) />

/>

© Smashing Redakcija uz Smashing Magazine, 2010. | Permalink | 52 komentāri | Add to del.icio.us | Digg this | paklupt StumbleUpon! | Tweet to! | Submit to Reddit | Forums Smashing Magazine
Post tags:

45 Powerful CSS / JavaScript Techniques

Birkas:

0 Komentāri

Jūs varat būt pirmais atstāt komentāru.

Leave Comment





XHTML: Jūs varat izmantot šos tagus:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>