En HTML Tutorial av View

October 4

I HTML, en "view" refererer til et virtuelt vindu eller container innenfor hvilket innhold vises. Feltene er mest brukt i Web-design beregnet for mobile enheter eller i hovedsak noen "spesielle" enhet som ikke er en standard LCD-skjerm, for eksempel en iPad. Du kan sikre at nettstedet vises optimalt på disse enhetene ved hjelp av "view" meta tag å kontrollere skala og dimensjon.

Bruksanvisning

1 Åpne nettstedets indeks eller header fil - uansett hvor "<head>" delen av koden er presentert. Hvis du oppretter et nytt nettsted fra grunnen av, opprette et nytt dokument i en tekst eller HTML-editor som heter "index.html" og legge til følgende "DOCTYPE" erklæring til begynnelsen av dokumentet:

<! DOCTYPE html>

Skriv åpningen "head" tag rett under "doctype" tag:

<! DOCTYPE html>

<Head>

2 Legg en metakode under åpningskoden i dokumentet, og deretter lukker header:

<Meta>

</ Head>

Å påvirke synsfeltet, må du gi din meta tag navnet "view:"

Av seg selv, vil denne koden gjør ingenting. Du må finne ut hvordan man best kan størrelse og skalere synsfeltet for å vise det ferdige design og legge til de tilsvarende egenskaper.

3 Tilsett "innhold" attributt til meta tag. Dette attributtet vil ta en bredde, høyde og skalaverdi for å bestemme hvor store synsfeltet er, og hvis det kan skaleres enten brukeren eller enheten. For eksempel, hvis du har opprettet en mobil design som er bare 320 piksler bred for visning på en iPhone, du ideelt sett ønsker det å fylle opp hele skjermen uansett om brukeren er i stående eller liggende format. I tillegg vil du innholdet i skala når de vises på en iPad, som har en standard synlig område av 980 piksler bredt. For å imøtekomme begge enhetene, setter synsfeltet bredde til "320" og gi den en innledende skala fra "1" Synsfeltet vil nå være minst 320 piksler bredt, men skalere riktig hvis de vises på en enhet med en større skjerm.

4 Endre bredde verdien til "enhetsbredde" for å skalere innholdet til bredden av enheten dynamisk.

Dette skiller seg fra den første metoden der "enhetsbredde" verdi gjør at innhold å fylle skjermen på enheten ved å zoome, uansett hvor stor eller liten skjermen er. Sette en bestemt bredde og omfang, som i det første eksemplet, vil utvide synsfeltet selv om enhetens skjermbredden er større enn den innstilte bredden på "view" meta tag, snarere enn å utvide innholdet.

5 Fortsett å legge til din gjenværende HTML-kode eller tilpasninger til filen, og deretter lagre og teste den. Hvis du ikke klarer å teste på flere enheter, kan du bruke en online simulator som iPhone Test Simulator eller iPad Peek.