June 18
file Scalable Vector Graphic (SVG) sono un metodo alternativo di visualizzazione di elementi grafici all'interno di un browser web. SVG viene utilizzato per visualizzare gli elementi grafici che non perdono la loro qualità quando ingrandita o ridimensionata o visualizzato su display con risoluzioni diverse. Di alta qualità del sito web loghi, banner e le icone possono essere creati e visualizzati utilizzando la tecnologia SVG.
1 Fai clic destro sul desktop del sistema operativo. Dal menu a comparsa, selezionare "Nuova cartella" o "Crea nuova cartella" dalla lista di opzioni.
2 Inserire il nome "cartella Test SVG" nel campo di testo che è stato messo a fuoco nel passaggio precedente.
3 Fare clic su un'area al di fuori del campo di testo per salvare il nome della cartella appena creata. Una cartella con il nome "cartella Test SVG" è ora presente sul desktop.
4 Avviare l'applicazione editor di testo nativa che viene fornito con il sistema operativo. Per Windows, avviare "Blocco note", e su Mac OSX, usare "TextEdit". Per le distribuzioni di Linux, scegliere tra una "Gedit." "Pico", "vi" o "Emacs".
5 Individuare il nuovo documento, vuoto che è stato creato con l'applicazione nativa editor di testo. Se non è stato creato automaticamente, individuate "File" e selezionare "Nuovo" o "Nuovo documento" dalla lista di opzioni che appare.
6 Fare clic all'interno della finestra di inserimento del testo nel nuovo documento.
7 Evidenziare il seguente codice (tra cui "Inizia qui" e "finisce qui"):
<! - Inizia qui ->
<Html>
<head>
& Lt; title> Usare SVG all'interno HTML & lt; / title>
& Lt; style>
body {
margin: 50px 0px; padding: 0px;
text-align: center;
}
div # content {
width: 500px;
margin: 0px auto;
text-align: center;
padding: 15px;
border: 1px #ccc solido;
background-color: #fafafa;
}
incorporare # S {
margin: 10px 10px 75px 0px;
}
& Lt; / style>
& Lt; / head>
& Lt; body>
& Lt; div id = 'content'>
& Lt; h1> Uso SVG all'interno HTML & lt; / h1>
& Lt; embed id = "S" e "C" simultaneamente per copiare il codice evidenziato negli appunti del sistema operativo. Se si utilizza Mac OS X, premere "Cmd" e "C" contemporaneamente invece di "Ctrl" e "C" Questa azione alternativa anche copia il codice evidenziato negli appunti del sistema operativo.
9 Fai clic su "File" -> "Salva con nome".
10 Accedere al desktop utilizzando la finestra di Explorer nella finestra di dialogo che appare.
11 Individuare e selezionare "Cartella test SVG" utilizzando la finestra di esplorazione file che contiene l'elenco dei file che si trovano sul desktop.
12 Individuare il campo di testo "Salva con nome" e immettere "SVG.html."
13 Premere il tasto "OK" quando completa. Un nuovo documento chiamato "SVG.html" dovrebbe essere situato nella "cartella Test SVG", che si trova sul desktop.
14 Verificare che il "Salva con nome" finestra di dialogo è scomparso.
15 Fare clic sulla finestra editor di testo nativa per rendere la domanda di nuovo a fuoco.
16 Passare a "File". Selezionare "Nuovo" o "nuovo documento" dall'elenco delle opzioni visualizzate.
17 Evidenziare il seguente codice (tra cui "Inizia qui" e "finisce qui"):
<! - Inizia qui ->
<? Xml version = "1.0" standalone = "no"?>
<! DOCTYPE svg PUBLIC "- // W3C // DTD SVG 1.1 // EN"
"Http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<Svg width = "100%" height = versione "100%" = "1.1"
xmlns = "http://www.w3.org/2000/svg">
<Circle cx = "100" cy = "50" r = corsa "40" = "nero"
stroke-width = "2" fill = "blu" />
</ Svg>
<! - Fine qui ->
18 Premere il tasto "Ctrl" e "C" simultaneamente per copiare il codice evidenziato negli appunti del sistema operativo. Se si utilizza Mac OS X, premere "Cmd" e "C" contemporaneamente invece di "Ctrl" e "C" Questa azione alternativa anche copia il codice evidenziato negli appunti del sistema operativo.
19 Fai clic su "File" -> "Salva con nome".
20 Accedere al desktop utilizzando la finestra Esplora file nella finestra di dialogo che appare.
21 Individuare e selezionare "Cartella test SVG" utilizzando la finestra di esplorazione file che contiene l'elenco dei file che si trovano sul desktop.
22 Individuare il campo di testo "Salva con nome" e immettere "circles.svg."
23 Premere il tasto "OK" quando completa per commettere il salvataggio. Un nuovo documento chiamato "circles.svg" si trova ora nella cartella Test SVG, che si trova sul desktop.
24 Verificare che il "Salva con nome" finestra di dialogo è scomparso.
25 Ridurre al minimo i due documenti aperti, "circles.svg" e "SVG.html," in modo che il desktop è chiaramente visibile.
26 Fare doppio clic sulla cartella "cartella di prova SVG." Viene visualizzata una nuova finestra di file explorer.
27 Fai clic destro sul file denominato "SVG.html" e passare alla "Apri con". Selezionare un browser SVG-compatibile dall'elenco delle applicazioni che appaiono. Consultare la sezione "Tips" di questo how-to per ulteriori informazioni.
28 Attendere che il browser web compatibile con SVG per avviare e rendere "SVG.html." Viene visualizzata una nuova finestra del browser.
29 Verificare che un cerchio blu con un contorno nero viene visualizzato al centro della finestra del browser. Questo indica che il compito è stato completato con successo.