зеркало из https://github.com/mozilla/brackets.git
187 строки
9.8 KiB
HTML
187 строки
9.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>KOM GODT I GANG MED BRACKETS</title>
|
|
<meta name="description" content="En interaktiv guide til at komme godt i gang med Brackets.">
|
|
<link rel="stylesheet" href="main.css">
|
|
</head>
|
|
<body>
|
|
|
|
<h1>KOM GODT I GANG MED BRACKETS</h1>
|
|
<h2>Dette er din guide!</h2>
|
|
|
|
<!--
|
|
SKABT MED <3 OG JAVASCRIPT
|
|
-->
|
|
|
|
<p>
|
|
Velkommen til dette tidlige smugkig på Brackets, en ny open-source editor til den næste generation af
|
|
nettet. Vi er stærke tilhængere af standarder og ønsker at skabe bedre værktøjer til JavaScript, HTML, CSS
|
|
og andre åbne web teknologier. Dette er vores ydmyge begyndelse.
|
|
</p>
|
|
|
|
<!--
|
|
HVAD ER BRACKETS?
|
|
-->
|
|
<p>
|
|
<em>Brackets er en anderledes editor.</em>
|
|
En nævneværdig forskel er, at denne editor er skrevet i JavaScript, HTML og CSS.
|
|
Det betyder, at de fleste af jer der bruger Brackets har de nødvendige færdigheder til at ændre og udvide editoren.
|
|
Faktisk bruger vi selv Brackets hver dag for at bygge Brackets. Det har også nogle unikke funktioner såsom Lyn-Redigering,
|
|
Live-Forhåndsvisning og andre som du ikke finder i andre editorer.
|
|
Hvis du vil vide mere om, hvordan du bruger disse funktioner, så læs videre.
|
|
</p>
|
|
|
|
|
|
<h2>Vi afprøver et par nye ting</h2>
|
|
|
|
<!--
|
|
FORHOLDET MELLEM HTML, CSS OG JAVASCRIPT
|
|
-->
|
|
<h3>Lyn-Redigering til CSS og JavaScript</h3>
|
|
<p>
|
|
Slut med at skifte mellem dokumenter og miste fokuset. Når du redigerer HTML, kan du trykke
|
|
<kbd>Cmd/Ctrl + E</kbd> for at åbne en indlejret editor som viser alt det relevante CSS.
|
|
Tilpas dit CSS, tryk <kbd>ESC</kbd> og du ryger tilbage til dit HTML-dokument, eller du kan efterlade
|
|
CSS-reglerne åbne så de bliver en del af din HTML-editor. Hvis du trykker <kbd>ESC</kbd> udenfor
|
|
en Lyn-Redigerings-editor, bliver de alle klappet sammen.
|
|
</p>
|
|
|
|
<samp>
|
|
Vil du se hvordan det virker? Placér markøren på <!-- <samp> --> tagget ovenfor og tryk
|
|
<kbd>Cmd/Ctrl + E</kbd>. Du burde se Lyn-Redigering dukke frem, som viser den CSS-regel som
|
|
anvendes på den. Lyn-Redigering virker også med klasse- og id-attributter.
|
|
|
|
Du kan oprette nye regler på samme måde. Klik i en af <!-- <p> --> tagsne ovenover og tryk
|
|
<kbd>Cmd/Ctrl + E</kbd>. Der er ingen regler til den lige nu, men du kan klikke på "Ny Regel"
|
|
for at oprette en ny regel til <!-- <p> -->.
|
|
</samp>
|
|
|
|
<a href="screenshots/quick-edit.png">
|
|
<img alt="Et skærmbillede der viser CSS-Lyn-Redigering" src="screenshots/quick-edit.png" />
|
|
</a>
|
|
|
|
<p>
|
|
Du kan også bruge den samme genvej til at redigere andre ting--såsom funktioner i JavaScript,
|
|
farver, og timing-funktioner til animationer--og vi føjer mere til hele tiden.
|
|
Indtil videre kan editorerne ikke indlejres i hinanden, så du kan kun bruge Lyn-Redigering så længe markøren
|
|
er i det primære redigerings-felt.
|
|
</p>
|
|
|
|
<!--
|
|
LIVE-FORHÅNDSVISNING
|
|
-->
|
|
<h3>Se ændringer i HTML og CSS live i browseren</h3>
|
|
<p>
|
|
Kender du den "gem/genindlæs"-finte vi har lavet i årevis? Den hvor du laver ændringer i
|
|
din editor, gemmer, skifter over til browseren og så genindlæser for endeligt at se resultatet?
|
|
Med Brackets kan du lægge den finte på hylden.
|
|
</p>
|
|
<p>
|
|
Brackets åbner en <em>direkte forbindelse</em> til din lokale browser og sender HTML og CSS opdateringer imens du
|
|
skriver! Måske gør du allerede noget lignende i dag med browser-baserede værktøjer, men med Brackets
|
|
behøver du ikke kopiere den endelige kode tilbage i editoren. Din kode kører i din browser,
|
|
men bor i din editor!
|
|
</p>
|
|
|
|
<h3>Live fremhævelse af HTML-elementer og CSS-regler</h3>
|
|
<p>
|
|
Brackets gør det nemt at se dine ændringer i HTML og CSS vil påvirke siden. Når markøren
|
|
er på en CSS-regel, vil Brackets fremhæve alle påvirkede elementer i browseren. Ligeledes, når en
|
|
HTML-fil redigeres, vil Brackets fremhæve de tilsvarende HTML-elementer i browseren.
|
|
</p>
|
|
|
|
<samp>
|
|
Hvis du har Google Chrome installeret, kan du prøve det af selv. Klik på lyn-ikonet
|
|
i øverste højre hjørne af Brackets vinduet eller tryk <kbd>Cmd/Ctrl + Alt + P</kbd>. Når
|
|
Live-Forhåndsvisning slåes til på et HTML-dokument, kan alle tilknyttede CSS-dokumenter redigeres i realtid.
|
|
Ikonet skifter fra grå til guld når Brackets har etableret en forbindelse til browseren.
|
|
|
|
Placér nu markøren på <!-- <img> --> tagget ovenover. Bemærk den blå fremhævning der dukker op
|
|
rundt om billedet i Chrome. Tryk derefter på <kbd>Cmd/Ctrl + E</kbd> for at åbne de definerede CSS-regler.
|
|
Prøv at ændre tykkelsen på kanten fra 10px til 20px eller ændre baggrundsfarven
|
|
fra "transparent" til "hotpink". Hvis du har Brackets og browseren til at køre side om side,
|
|
kan du med det samme se dine ændringer blive vist i browseren. Er det ikke sejt?
|
|
</samp>
|
|
|
|
<p class="note">
|
|
I dag understøtter Brackets kun Live-Forhåndsvisning for HTML og CSS. Ændringer til JavaScript-filer
|
|
bliver dog genindlæst automatisk når du gemmer. Vi arbejder i øjeblikket på at Live-Forhåndsvisning
|
|
også understøtter JavaScript. Live-Forhåndsvisning er også kun muligt med Google Chrome, men vi håber på
|
|
at bringe denne funktionalitet ud til alle gængse browsere i fremtiden.
|
|
</p>
|
|
|
|
<h3>Lyn-visning</h3>
|
|
<p>
|
|
For dem af os, som endnu ikke kan alle farvers HEX- eller RGB-kode udenad, gør Brackets
|
|
det hurtigt og nemt at se nøjagtig hvilken farve der er brugt. I enten CSS eller HTML, peger du ganske enkelt på en
|
|
farve-værdi eller gradient og Brackets vil vise et eksempel af den farve/gradient automatisk. Det
|
|
samme gælder for billeder: du peger ganske enkelt på billede-adressen i editoren og der vises en
|
|
miniature-udgave af det billede.
|
|
</p>
|
|
|
|
<samp>
|
|
Du kan afprøve Lyn-Visning ved at placére markøren på <!-- <body> --> tagget øverst i dette
|
|
dokument og trykke <kbd>Cmd/Ctrl + E</kbd> for at åbne CSS-Lyn-Redigering. Her kan du pege på enhver
|
|
farve-værdi i CSS'en og se farven. Du kan også set det i aktion i gradienter ved at åbne Lyn-Redigering
|
|
på <!-- <html> --> tagget og pege på en af værdierne for baggrundsbilledet. For at se et smugkig af billeder,
|
|
peg på adressen til skærmbilledet, som er indsat tidligere i dette dokument.
|
|
</samp>
|
|
|
|
<h3>Har du brug for noget andet? Prøv en udvidelse!</h3>
|
|
<p>
|
|
Som tilføjelse til alle de gode sager der er indbygget i Brackets, har vores store og voksende samfund af
|
|
udviklere skabt over hundrede udvidelser, som tilføjer nyttig funktionalitet. Hvis der er
|
|
noget du har brug for, som Brackets ikke tilbyder, er det ret sandsynligt at nogen har lavet en udvidelse til
|
|
det. For at gennemse eller søge i listen af tilgængelige udvidelser, vælg <strong>Filer > Udvidelses-håndtering</strong>
|
|
og klik på fanen "Udvalg". Når du har fundet en udvidelse du kunne tænke dig, klikker du blot på
|
|
knappen "Installér" ud for den.
|
|
</p>
|
|
|
|
<!--
|
|
GIV DIN MENING TIL KENDE
|
|
-->
|
|
<h2>Bliv involveret</h2>
|
|
<p>
|
|
Brackets er et open-source projekt. Web-udviklere fra hele verden bidrager til at bygge
|
|
en bedre kode-editor. Endnu flere bygger udvidelser der udvider funktionaliteten af Brackets.
|
|
Fortæl os hvad du synes, del dine idéer eller bidrag direkte til projektet.
|
|
</p>
|
|
<ul>
|
|
<li><a href="http://brackets.io">Brackets.io</a></li>
|
|
<li><a href="http://blog.brackets.io">Brackets team-blog</a></li>
|
|
<li><a href="http://github.com/adobe/brackets">Brackets på GitHub</a></li>
|
|
<li><a href="https://brackets-registry.aboutweb.com">Brackets udvidelses-register</a></li>
|
|
<li><a href="http://github.com/adobe/brackets/wiki">Brackets wiki</a></li>
|
|
<li><a href="http://groups.google.com/group/brackets-dev">Brackets mailingliste for udviklere</a></li>
|
|
<li><a href="https://twitter.com/#!/brackets">@brackets på Twitter</a></li>
|
|
<li>Chat med Brackets-udviklere på IRC i #brackets på Freenode</li>
|
|
</ul>
|
|
|
|
</body>
|
|
</html>
|
|
<!--
|
|
|
|
[[[[[[[[[[[[[[[ ]]]]]]]]]]]]]]]
|
|
[:::::::::::::: ::::::::::::::]
|
|
[:::::::::::::: ::::::::::::::]
|
|
[::::::[[[[[[[: :]]]]]]]::::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ CODE THE WEB ]:::::]
|
|
[:::::[ http://brackets.io ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[:::::[ ]:::::]
|
|
[::::::[[[[[[[: :]]]]]]]::::::]
|
|
[:::::::::::::: ::::::::::::::]
|
|
[:::::::::::::: ::::::::::::::]
|
|
[[[[[[[[[[[[[[[ ]]]]]]]]]]]]]]]
|
|
|
|
--> |