no.hideout-lastation.com
Paradis For Designere Og Utviklere


Kopier koder fra nettsteder enkelt med SnappySnippet

Som webutvikler kan vi noen ganger finne noen inspirerende elementer på et nettsted som gjør at du lurer på hvordan de bygde den tingen. Da ville du tenke på å få en kopi av den koden. Chrome Devtools samt Firebug of Firefox har faktisk sendt med funksjonen som gjør det enkelt for oss å kopiere HTML og CSS fra et nettsted.

Disse verktøyene fungerer imidlertid bare for å kopiere kun HTML eller CSS; Du kan ikke bruke disse verktøyene til å kopiere CSS relatert til HTML-elementet du valgte. For eksempel, la oss si at du velger et HTML-element som inneholder et par barnelementer, som følger.

Ved å sende inn er du enig i vår term og betingelse

Hvert av elementet deri har sine egne spesifikke stilregler som ligger i stilarket. Noen HTML-elementer kan ha arvet et par stilregler som ville gjøre kopiering av både HTML og CSS sammen vanskelig . Her er hvor du vil elske et verktøy som SnappySnippets.

Starter

SnappySnippet er en Chrome-utvidelse (få den her), som en gang installert, gir deg en ny kategori med navnet SnappySnippet i Google Chrome DevTools. Det er her vi skal operere SnappySnippet.

For å teste det, har vi utarbeidet en nettside som inneholder et par HTML-elementer som danner et veldig fint, enkelt webloggingsskjema. Hver av disse HTML-elementene arver CSS-koder. Hvis du vil kopiere alle disse kodene på en tradisjonell måte med vanlig funksjonalitet fra nettleseren DevTools, skal du ta litt arbeid.

Med SnappySnippet er alt imidlertid mye enklere.

Først velg hvilket element du vil kopiere, åpne deretter SnappySnippet-fanen og klikk på Opprett en utdrag fra inspisert element- knapp.

Som du ser på skjermbildet nedenfor, er elementet vi valgte kopiert inkuderende barnelementene og plassert i HTML- panelet på venstre side. Alle stilregler som former disse HTML-elementene blir også kopiert og plassert i CSS-panelet.

Innstillingene

SnappySnippet gjør det mulig for oss å angi kodeutgangen. Under de to rutene som brukes til å plassere HTML og CSS, finner du panelet Innstillinger . Du kan angi flere ting, for eksempel å fjerne CSS-egenskapen med -webkit- prefiks fra utdata, legge inn prefiks for ID-en gitt til HTML-elementene og så videre.

Kodedeling

Webutviklere kan være kjent med en kodedelingsplattform som Codepen . Disse nettstedene tillater webutviklere å dele deler av arbeidskodeutdrag . Det er som et sosialt nettverksside, men i stedet for å dele statuser og selfies deler vi koder. Med SnappySnippet kan du sende kodene du har kopiert til Codepen, JSFiddle og JSBin.

For å sende koden, pass på at du har logget på den respektive nettsiden der du skal sende kodene dine. Dette er også for å sikre at kodene umiddelbart blir lagret i din konto. Deretter klikker du bare på en av disse tre deleknappene.

Kodene du kopierer, kommer tilbake akkurat som det du ser på nettstedet.

Endelig tanke

SnappySnippet er et veldig praktisk verktøy for kopieringskoder, men husk å ikke bruke dette som et middel til å plagiere andre utviklerens koder . Uansett hvilken kopiering du gjør, sikte på et læringsformål, med håp om å lære noe nytt av de brukte teknikkene. Blatant kopiering er ikke kondensert, om den er beskyttet av opphavsrett eller ikke. Bruk dette verktøyet godt.

OWC DEC - Docken som gir MacBook Pro mer lagringsplass

OWC DEC - Docken som gir MacBook Pro mer lagringsplass

Mangel på porter til side, en av de hyppigere klagerne om den nye MacBook Pro er manglende evne til å oppgradere notatbokens lagringsplass . Likevel, som portproblemet, har et tredjepartsfirma en løsning for det, og det kommer i form av en dock.Utviklet av OWC-lageren OWC DEC er en dock som leveres med NAND flash-lagringsmoduler . N

(Tekniske og design tips)

Google Settings App - 10 Funksjoner Hver Android-bruker burde vite

Google Settings App - 10 Funksjoner Hver Android-bruker burde vite

Har du lagt merke til en Google Innstillinger-app på Android-enheten din? I fjor lastet Google denne appen stille inn i alle Android-brukerenheter som kjører Googles tjenester. Denne appen er også kjent som Google Play Services, der Google-apper kan koble til Google+. Gjennom denne appen kan du raskt kontrollere de fleste Google-tjenesteinnstillingene i en lett tilgjengelig app.Nå

(Tekniske og design tips)