Generell struktur for et HTML-dokument. Grunnleggende HTML for nybegynnere i klarspråk

Http://www.webuchebnik.ru/samouchitel_html/fone_images.php

http://stafox.ru/category/html-2/lekcii/

Hva er strukturen til et HTML-dokument

STRUKTUR av HTML-DOKUMENTET:

Slik ser koden for den enkleste html-siden ut:

  1. Min første side


For å lage din egen HTML-side, må du lime inn koden ovenfor i notisblokk, trykk Fil → Lagre som ... I "filnavn"-feltet, spesifiser din_side_navn.html, og spesifiser i "filtype"-feltet Alle filer... trykk Lagre.

stikkord informerer om at strukturen til html-dokumentet starter, - hva ender.

Mellom tagger det meste av informasjonen lagres for nettleseren og søkemotorene.

I tagger inneholder tittelen på siden vår.

Nå skal jeg forklare litt. Alle tagger ( tag - et element i hypertekst-markeringsspråket) er delt inn i to typer "single" og "closing". I tillegg er tagger omsluttet av følgende tegn < og > , det er de som skiller taggen fra ren tekst html... La oss se på noen av de enkleste «single»-taggene:




- en tag som er ansvarlig for å pakke til en ny linje, på stedet der denne taggen er installert. La oss ta en titt på koden som bruker denne taggen.

  1. Min første side
  2. Hei alle sammen!
    Og dette er min første side.



er en merkelapp som tegner en horisontal linje. Denne taggen refererer til blokkelementer, linjen starter alltid på en ny linje. Har 5 attributter:

  • align - Bestemmer justeringen av linjen. Kan settes til venstre, senter, høyre.
  • farge – Angir linjefargen.
  • noshade - Tegner en linje uten 3D-effekter.
  • størrelse - Angir tykkelsen på linjen.
  • width - Angir bredden på linjen.

Kode ved hjelp av tag


:

  1. Min første side
  2. Hei alle sammen!
    Og dette er min første side.


En annen "single" tag er ... Denne taggen brukes til å lagre informasjon beregnet på nettlesere og søkemotorer. Søkemotorer ser på metakoder for å få nettstedbeskrivelser, søkeord og andre data. Et ubegrenset antall metakoder er tillatt, alle må være mellom og ... Parametrene til enhver metatag har formen "navn = verdi", som bestemmes av nøkkelord innhold, Navn eller http-equiv... Fordi Metakoder er for maskiner, de gjør ingen visuelle endringer, så jeg vil bare oppgi kildekoden:

Denne linjen indikerer at sideskaperen tror at siden bruker UTF-8-koding. Alt har blitt enklere i HTML5, for å spesifisere kodingen er bare følgende linje nok:

Det er andre enkeltmerker ( , ,
, , , ,


, , , , , , , , , ), men jeg skal introdusere deg for dem litt senere.

La oss nå snakke om å lukke tagger. Selve navnet «lukkingsbrikke» betyr at lappen krever obligatorisk lukking. Dette gjøres for å tydelig begrense den delen av teksten som taggen virker på.

For et illustrerende eksempel, ta en titt på taggen som brukes til å markere tekst, setter den skriften til fet skrift. Tagger og er grensene som definerer tekstens utvalgsområde. Her er koden der den siste linjen glemte å lukke taggen :

  1. Min første side
  2. Hei alle sammen! Og dette er min første side.
  3. Hei alle sammen! Og dette er min første side.


Det neste jeg må snakke om er hvordan jeg setter opp en lenke. Tross alt er et nettsted et sett med koblede sider. Linken settes ved hjelp av en "lukkende"-tag som har 12 attributter:

  • tilgangsnøkkel- aktiverer en kobling ved hjelp av en hurtigtast.
  • tegnsett- indikerer kodingen av teksten som lenken fører til. (avviklet i HTML5)
  • koordinerer- setter koordinatene til det aktive området. (avviklet i HTML5)
  • href- angir adressen til dokumentet som skal gå til.
  • hreflang- identifiserer språket i teksten ved referanse.
  • Navn- setter navnet på ankeret i dokumentet (id skal brukes i HTML5). (avviklet i HTML5)
  • rel- forholdet mellom de refererte og gjeldende dokumentene.
  • rev- forholdet mellom gjeldende og refererte dokumenter. (avviklet i HTML5)
  • form- setter formen på det aktive koblingsområdet for bilder. (avviklet i HTML5)
  • tabindex- bestemmer overgangen mellom lenker når du klikker på knappen .
  • mål- hvilken type vindu nettleseren laster dokumentet i. Kan ta verdier

_blank- laster siden i et nytt nettleservindu.
_selv- laster siden i gjeldende vindu (standard).
_foreldre- laster siden i den overordnede rammen, hvis det ikke er noen rammer, fungerer denne parameteren som _selv.
_topp- kansellerer alle rammer og laster inn siden i et fullstendig nettleservindu, hvis det ikke er noen rammer, fungerer denne parameteren som _selv.

  • tittel- legger til et verktøytips i lenketeksten.

Tenk på koden for en side med en enkel tekstlenke:

  1. Min første side
  2. Hei alle sammen!
    Og dette er min første side med lenker.
  3. Link til eksempel med hr tag.


Som du kan se, er det ikke noe komplisert, nå kan du lage flere koblede sider.

Etiketter for utheving av tekst

Det er flere måter å fremheve tekst på en side. Du kan gjøre dette ved å bruke stiler, eller du kan bruke tagger. Vi er (foreløpig) interessert i det andre alternativet.

Setter skrifttypen til fet skrift.

- setter skriften til kursiv.

- legger til understreking i tekst.

- designet for å fremheve teksten. Nettlesere gjengir slik tekst i kursiv.

- krysser over teksten. Denne taggen er fjernet fra HTML5, det anbefales å bruke den i stedet

- viser tekst i monospaced tekst. Ekskludert fra HTML5.

- viser skriften som hevet skrift. Skriften vises over grunnlinjen til teksten og reduseres i størrelse.

- viser skriften som et abonnent. Samtidig er teksten plassert under grunnlinjen til resten av linjetegnene og den reduserte størrelsen.

- designet for å fremheve teksten. Nettlesere gjengir slik tekst i fet skrift.

- Reduserer skriftstørrelsen med én sammenlignet med vanlig tekst. I HTML måles skriftstørrelsen i konvensjonelle enheter fra 1 til 7, den gjennomsnittlige tekststørrelsen som brukes som standard er 3. Tag reduserer teksten med én konvensjonell enhet. Nestede tagger er tillatt , i dette tilfellet vil skriftstørrelsen være 1 mindre for hvert nestede nivå, men den kan ikke være mindre enn 1.

- øker skriftstørrelsen med én sammenlignet med vanlig tekst. I HTML måles skriftstørrelsen i vilkårlige enheter fra 1 til 7, den gjennomsnittlige tekststørrelsen som brukes som standard er 3. Dermed legger du til en kode øker teksten med én konvensjonell enhet. Nestede tagger er tillatt , vil skriftstørrelsen være større for hvert nivå.

- brukes til å fremheve sitater i teksten. Innholdet i beholderen vises automatisk i anførselstegn i nettleseren.

Designet for å fremheve lange sitater i et dokument. Tekst utpekt med denne taggen vises tradisjonelt som en justert boks med venstre og høyre polstring (omtrent 40 piksler) og polstring øverst og nederst.


- definerer en blokk med forhåndsformatert tekst.  Slik tekst vises vanligvis i en font med monospace og med alle mellomrom mellom ordene.  Som standard vises et hvilket som helst antall mellomrom på rad i koden som én på nettsiden.  stikkord 
Lar deg omgå denne funksjonen og vise teksten som kreves av utvikleren.

- definerer et tekstavsnitt. stikkord

Det er et blokkelement, starter alltid på en ny linje, tekstavsnitt som følger hverandre er atskilt med en utfylling. Mengden polstring kan kontrolleres ved hjelp av stiler. Hvis det ikke er noen sluttkode, anses slutten av avsnittet som begynnelsen på neste blokkelement.

..
..

- HTML tilbyr seks overskrifter på ulike nivåer som viser den relative betydningen av delen etter overskriften. Altså taggen

representerer den viktigste overskriften på første nivå, og taggen

tjener til å betegne en overskrift på sjette nivå og er minst signifikant. Som standard vises overskriften på første nivå med største fet skrift, overskriftene på neste nivå er mindre i størrelse. Tagger

,…,

er blokkelementer, starter de alltid på en ny linje, og etter dem vises andre elementer på neste linje. I tillegg legges det til et mellomrom før og etter tittelen. Taggen har et attributt tilpasse, som bestemmer justeringen av tittelen, kan være venstre- justering av tittelen til venstre, senter- senterjustering, Ikke sant- høyrejustering, rettferdiggjøre- begrunnet justering (både høyre og venstre). Denne verdien fungerer bare for en overskrift som er mer enn én linje lang.

- er en beholder for å endre skriftegenskaper som størrelse, farge og skrifttype. Selv om denne taggen fortsatt støttes av alle nettlesere, er den utdatert og anbefales å droppe til fordel for stiler. Taggen har 3 attributter: farge- setter fargen på teksten, ansikt- definerer skrifttypen, størrelse- setter skriftstørrelsen i konvensjonelle enheter.

- markerer teksten som et sitat eller fotnote til et annet materiale. Dette valget er nyttig for å endre tekststilen gjennom CSS, og er også nyttig for å skille HTML-kode i strukturelle elementer. Nettlesere setter vanligvis tekst inne i en beholder i kursiv.

- indikerer at tegnsekvensen er en forkortelse. Bruk av attributtet tittel dekodingen av forkortelsen er gitt, noe som gjør det mulig å forstå forkortelsen for de som ikke er kjent med den. I tillegg indekserer søkemotorer fulltekstversjonen av forkortelsen, som kan brukes til å forbedre rangeringen av dokumentet.

Som standard er teksten vedlagt i beholderen > understreket med en stiplet linje.

Nedenfor er koden der jeg brukte alle disse taggene:

  1. Min første side
  2. Html og CSS er to av kjerneteknologiene for å bygge nettsider. HTML gir strukturen til siden, CSS den (visuelle og auditive) layouten, for en rekke enheter. Sammen med grafikk og skripting er HTML og CSS grunnlaget for å bygge nettsider og nettapplikasjoner. Lær mer nedenfor om:

  3. Hva er HTML?

  4. HTML er språket for å beskrive strukturen til nettsider. HTML gir forfattere midler til å:

  5. Publiser elektroniske dokumenter med overskrifter, tekst, tabeller, lister, bilder, etc.
  6. Hent informasjon på nettet via hypertekstlenker, ved å klikke på en knapp.
  7. Designe skjemaer for å gjennomføre transaksjoner med eksterne tjenester, til bruk for å søke etter informasjon, gjøre reservasjoner, bestille produkter m.m.
  8. Inkluder regneark, videoklipp, lydklipp og andre applikasjoner direkte i dokumentene sine.
  9. Med HTML beskriver forfattere strukturen til sider ved hjelp av oppmerking. Elementene i språket merker innholdsbiter som f.eks «Avsnitt», «liste», «tabell» og så videre.
  10. Hva er XHTML?

  11. XHTML er en variant av HTML som bruker syntaksen til XML, Extensible Markup Language. XHTML har alle de samme elementene (for avsnitt osv.) som HTML-varianten, men syntaksen er litt annerledes. Fordi XHTML er en XML-applikasjon, kan du bruke annen XML verktøy med det (som XSLT, et språk for å transformere XML-innhold).

  12. Hva er CSS?

  13. CSS er språket for å beskrive presentasjonen av websider, inkludert farger, layout og fonter. Det gjør det mulig å tilpasse presentasjonen til forskjellige typer enheter, for eksempel store skjermer, små skjermer eller skrivere. CSS er uavhengig av HTML og kan brukes med alle XML-baserte markeringer Språk Språk. Separasjonen av HTML fra CSS gjør det enklere å vedlikeholde nettsteder, dele stilark på tvers av sider og skreddersy sider til forskjellige miljøer. Dette omtales som separasjon av struktur (eller: innhold) fra presentasjon.

  14. Hva er WebFonts?

  15. Webfonter er en teknologi som gjør det mulig for folk å bruke fonter på forespørsel over nettet uten å kreve installasjon i operativsystemet. W3C har erfaring med nedlastbare fonter gjennom HTML, CSS2 og SVG... Inntil nylig har nedlastbare fonter ikke vært vanlig på nettet på grunn av mangelen på et interoperabelt skriftformat. WebFonts-innsatsen planlegger å løse dette ved å lage et industristøttet, åpent skriftformat for nettet (kalt "WOFF").


Og her er det visuelle resultatet.

Foredraget har nådd slutten, jeg håper den tilegnete kunnskapen vil være nyttig for deg! I neste foredrag vil jeg fortelle om hva taggen lagrer i seg selv. , vil vi lære å utføre alle slags manipulasjoner med bilder, og bli kjent med tabeller.


Hei kjære lesere. Som jeg lovet i forrige foredrag, skal jeg i dag snakke om taggen , om alle slags manipulasjoner med bilder og om arbeid med tabeller.

Som alle andre programmeringsspråk, innebærer HTML en viss standardisert struktur for å bygge et program, i dette tilfellet et html-dokument. Denne strukturen beskriver sekvensen til en serie obligatoriske blokker som inneholder den faktiske programkoden.

HTML-direktiver kalles "tags" (fra engelsk tag - mark). HTML-tagger er omsluttet av vinkelparenteser, deres syntaks ser generelt ut som <тег> ... Alle gjenstander, ikke omsluttet av vinkelparenteser, oppfatter tolken som tekstelementer ved å vise dem "som de er" på dataskjermen.

Strukturen til et HTML-dokument ser slik ut (Figur 13).

Ris. 13. HTML-dokumentstruktur

HTML har en annen viktig funksjon som skiller den fra andre programmeringsspråk: nesten alle tagger av det gitte språket, med unntak av noen ellers spesifiserte tilfeller, paret. Et slikt par består av en "åpnings"- og "lukkende"-tag, som bare skiller seg fra hverandre ved tilstedeværelse av et "/"-tegn i den siste. Alt mellom åpnings- og avslutningstaggen behandles av tolken i henhold til algoritmen som er tilordnet denne bestemt merkelapp. Generelt ser en HTML-programlinje med åpnings- og lukkekoder slik ut:

<тег>bearbeidet verdi

Denne HTML-egenskapen lar deg bruke prinsippet om å legge én tag i en annen, når den behandlede verdien av én kommando kan være en annen kommando. Her er et enkelt eksempel på å legge to tagger inni hverandre:

<тег1> <тег2>bearbeidet verdi

Når du arbeider med HTML-kode, må du huske én enkel regel: Hvis en åpningskode finnes et sted i programteksten, må det også være en avsluttende kode. Unnlatelse av å overholde denne regelen vil føre til en feil ved behandling av et slikt dokument av nettlesertolken.

Den grunnleggende, globale konstruksjonen av den interne koden til en webside er et HTML-dokument. For å definere denne konstruksjonen er det en spesiell kommando laget for å "forklare" til nettleseren at den har å gjøre med et HTML-dokument, og ikke med en tekst eller for eksempel en grafisk fil. En slik kommando kalles "Tag på øverste nivå" og er skrevet som:

<НТМL>Innhold

Toppnivåtaggen er sammenkoblet, og innholdet er nøyaktig hele HTML-koden som utgjør dokumentet. Åpningskoden skrives som den aller første linjen i html-dokumentet, og den avsluttende taggen skrives som den aller siste.

Det neste elementet er "Dokument tittel"... Overskriften på en webside inneholder omfattende informasjon om selve dokumentet, og noen ganger også spesielle oversetterdirektiver som forteller nettleserens innebygde HTML-tolkeregler for å behandle koden som utgjør siden. Tittelinnhold vises ikke i nettleseren og påvirker ikke utseendet til dokumentet. Dette er serviceinformasjon som er nødvendig for korrekt drift av nettleseren. Syntaksen for header-taggen ser slik ut i generelle termer:



Innhold

Kapittel HODE følger i html-dokumentet rett etter taggen og er den andre nødvendige kommandoen som skal inkluderes i koden til nettsiden.

"Ekstern overskrift" er en nestet tag-kommando ... Den eksterne header-mnemonikken er skrevet som følger:

<ТITLE>Ekstern overskrift

Ekstern overskrift vises i det øverste feltet i nettleseren som navnet på siden når den åpnes... Tag-verdi </b> erstattes som standard i den tilsvarende dialogboksen når brukeren legger til dokumentet i mappen "favoritter".</p> <p>Den siste strukturelle komponenten i nettsidekoden er <b>"Dokumenttekst"</b>... Brødteksten i dokumentet, beskrevet av tagger <b><BODY> </BODY> </b>, inkluderer all hovedsidekode, som bestemmer visningen av html-dokumentet på skjermen. Brødtekst, illustrasjoner, navigasjonselementer og alt annet du ønsker å vise frem til besøkende på nettstedet ditt, plasseres i denne taggen.</p> <p>Dermed ser de nødvendige HTML-dokumentkodeelementene slik ut:</p> <p><b><HTML> </b></p> <p><b><HEAD> </b></p> <p><b><ТITLE>Side tittel

Hvert HTML-dokument må starte med taggen < Html> og avslutte med en tag Html> ... Disse kodene indikerer at linjene mellom dem representerer et enkelt HTML-dokument. I tillegg vil du legge merke til at HTML-filen som helhet er et element i HTML-språket.

HTML-dokumentet må også inneholde elementene HEAD (dokumentinformasjon) og BODY (dokumenttekst).

DokumentdelHODE

HEAD-delen av dokumentet definerer tittelen og inneholder også tilleggsinformasjon om dokumentet for nettleseren. Denne delen er valgfri, men det anbefales at du alltid bruker den i HTML-dokumentene dine, da en velformet overskrift kan være veldig nyttig.

Overskriftsseksjonen begynner med tag < HODE> og følger umiddelbart etter taggen ... Mellom start- og slutttaggene til et HEAD-element er det andre overskriftselementer.

Tittel på dokumenttittelen

For å gi et navn til et HTML-dokument, er taggen ment < TITTEL> ... Dette navnet vil vises i tittellinjen i nettleservinduet. Tittelen er skrevet mellom tagger og og er en tekstlinje. Denne strengen kan ha en hvilken som helst lengde, men det anbefales å ikke ha mer enn 60 tegn. TITLE-elementet skal bare vises i HEAD-delen.

DokumentdelKROPP

Denne delen av dokumentet inneholder informasjonen som vises i nettleservinduet. BODY-delen må begynne med en tag < KROPP> og avslutte med taggen KROPP> , mellom disse er HTML-elementene som utgjør innholdet i dokumentet.

VarespesifikasjonKROPP

stikkord har en rekke attributter som bestemmer utseendet til dokumentet. Følgende er spesifikasjonen for taggen .

TEXT = "tekstfarge"

BGCOLOR = "bakgrunnsfarge"

BACKGROUND = "bakgrunnsbildeadresse"

TEXT-attributtet spesifiserer skriftfargen for hele dokumentet i RGB eller symbolsk notasjon. Som standard (hvis dette attributtet ikke er spesifisert) brukes nettleserinnstillingene.

BGCOLOR-attributtet spesifiserer bakgrunnsfargen til dokumentleservinduet i RGB-format eller symbolsk notasjon. Som standard brukes nettleserinnstillingene.

BACKGROUND-attributtet lar deg spesifisere adressen og navnet på bildet som brukes som bakgrunn. Dette bildet vil bli kopiert og distribuert i bakgrunnen av dokumentet.

LINK-, VLINK- og ALINK-attributtene spesifiserer fargene på hyperkoblinger i RGB eller symbolsk notasjon. Som standard brukes nettleserinnstillingene. Ubesøkt hyperkobling - En hyperkobling som ennå ikke har blitt brukt til å navigere til et annet dokument. Besøkt hyperkobling - En hyperkobling som allerede har blitt brukt til å navigere til et annet dokument. Aktiv hyperkobling - en hyperkobling til dokumentet som overgangen pågår for øyeblikket.

Tips for bruk av BODY Tag-attributtene

 Hvis du spesifiserer minst én farge i BODY-taggen, spesifiser de andre. Dette skyldes det faktum at brukeren kan stille inn fargeinnstillingene til nettleseren sin ettersom det er mer praktisk for ham. Å spesifisere kun én farge kan føre til at for noen brukere vil teksten smelte sammen med bakgrunnsfargen. Som et resultat vil det være vanskelig å se dokumentet.

 Velg en tekstfarge slik at den "fungerer" med bakgrunnsfargen eller primærfargene i bildet. For eksempel kan rødt på grønt forårsake alvorlige problemer for et betydelig antall mennesker.

• I BODY-elementet kan du spesifisere både BGCOLOR og BACKGROUND. I dette tilfellet foretrekker nettleseren BACKGROUND, men hvis bakgrunnsbildet ikke kan lastes, vil BGCOLOR bli brukt. Prøv derfor å sette bakgrunnsfargen til å være lik bakgrunnsfargen, for ikke å forstyrre fargebalansen til dokumentet.

Jeg vil prøve å sende utsendelsen etter prinsippet "fra enkelt til vanskelig". Jeg vil gjennomføre det i dette formatet slik at en person som ønsker å lære det grunnleggende om byggeplass umiddelbart, etter utgivelsen av e-postlisten, i praksis kan utføre materialet som presenteres.

Men med en gang vil jeg ta forbehold om at spesielt HTML-språket er et veldig stort språk som er i stadig utvikling. Og derfor, for å mestre dette språket på et høyt nivå, må du nøye studere det grunnleggende (dvs. postlisteutgavene mine). Og parallelt med dette å øve.

Etter hvert som vi lærer det grunnleggende om HTML-språket, skal vi se på CSS-stiler. Dette betyr at vi også skal lære CSS. Men dette er litt senere. Vi vil også se på javascript for å få hjelp.

For dagens introduksjonsveiledning starter vi med å se på strukturen til et HTML-dokument og grunnleggende HTML-koder.

Gå…

Hvert HTML-dokument starter med en linje:

XHTML

Generelt forteller denne linjen nettleseren som åpner siden vår hvilke standarder den skal basere seg på.

stikkord er svært mangfoldig, og hvordan innholdet vil vises på siden din, avhenger av endringen.

Men hvis du dyktig ordner alle elementene og blokkene på siden og bruker stilen, vil alt fungere like bra i alle nettlesere med ønsket .

Men selv om vi ikke vet hva blokker er, hvilke stiler er og hvordan man bruker denne "abrucadabra", anser jeg det som nødvendig å gå tilbake til en detaljert undersøkelse. , når vi allerede vil være i stand til å gjøre noe og virkelig vil kunne evaluere arbeidet hans.

I mellomtiden beveger vi oss nedover siden.

Forresten, hvorfor begynte jeg å se på HTML-dokumentet fra toppen av siden?

Fordi nettleseren laster inn siden og "leser koden" fra topp til bunn, venstre til høyre. (Men mens vi leser bøker).

Sannsynligvis er ikke ordet tag helt klart?

Generelt sett er en tag en instruksjon som forteller nettleseren hva den skal gjøre på et gitt punkt i dokumentet.

Vi bruker tagger for å lage sidene våre. Alle tagger er innelukket i såkalte "hjørner" ( <тег> ). Og lukking (med skråstrek). For eksempel, miniatyrbilde ... Spesifiserer at teksten mellom de innledende og avsluttende sterke taggene vil være fet.

Jeg håper det er klart hva en tag er.

Jeg foreslår å skrive noe med egne hender.

Så la oss komme i gang.

Start notepad eller wordpad i OC WINOWS. La oss skrive inn følgende linjer:

XHTML

Nettleservinduets tittel

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

"tekst / html; tegnsett = windows-1251" />

"sidebeskrivelse" />

"ord, ord, ord" />

<span>Nettleservinduets tittel</span>



La oss lagre filen under et navn, for eksempel start.html. La oss nå finne ut hva vi skrev.

Mellom tagger og inneholder informasjon som ikke vises på siden.

For eksempel taggen , forresten, det krever ikke en avsluttende kode, det kan indikere kodingen (tegnsett = windows-1251) eller informasjon om forfatteren (navn = "forfatter" innhold = "Fullt navn"), eller ord for en søkemotor , stikkord vil tvinge nettleseren til automatisk å gå til mysite.ru-nettstedet etter 30 sekunder (eksempel).

stikkord </b> definerer teksten i tittelen på nettleservinduet. (Bikken lukkes).</p> <p><img src='https://i2.wp.com/webformyself.com/wp-content/uploads/2009/06/title3.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Også i taggen <b><head> </b> javascript- eller vbscript-skript kan lokaliseres, omsluttet av tagger <b><script> </b>….<b></script> </b>.</p> <p>Og stiler omsluttet av tagger <b><style> </b>….<b></style> </b>.</p> <p>På denne med taggen <b><head> </b> kanskje vi blir ferdige.</p> <p>Dette er faktisk hoveddelen av dokumentet, alt vi ser på siden er plassert her. stikkord <b><body> </b> det er et sett med parametere som vi skal se på, men det anbefales ikke å bruke dem.</p> <p><b>bgcolor</b>- setter bakgrunnsfargen til dokumentet. ( <b><body bgcolor="black"> </b>)</p> <p><b>bakgrunn</b>- peker på url-en til bildet - bakgrunnen til dokumentet.</p> <p><b>tekst</b>- setter fargen på teksten i dokumentet.</p> <p><b>link</b>- setter fargen på hyperkoblinger.</p> <p><b>vlink =</b>- setter fargen på hyperkoblinger du allerede har besøkt ved å bruke en verdi.</p> <p><b>alink =</b>- setter fargen på hyperkoblinger når de klikkes.</p> <p><b>bgproperties = fikset</b>- Bakgrunnsbildet vil ikke rulle. De. teksten vil flytte når PageDown trykkes, men bakgrunnen vil ikke. <br>Dette alternativet støttes kun av Internet Explorer.</p> <p>Disse parameterne kan kombineres, for eksempel bruker denne siden:</p> <p>XHTML</p> <p><BODY bgcolor="black" text="white" link="red" alink="blue"></p> <table class="crayon-table"><tr class="crayon-row"><td class="crayon-nums " data-settings="show"> </td> <td class="crayon-code"><p><BODY bgcolor = "black" text = "white" link = "red" alink = "blue" > </p> </td> </tr></table><p>La oss skrive denne linjen i vårt forrige eksempel.</p> <p>XHTML</p> <p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <meta name="author" content="Ф.И.О." /> <meta name="description" content="sidebeskrivelse" /> <meta name="keywords" content="ord, ord, ord" /> <meta http-equiv=refresh content="30;url=www.mysite.ru" /> <title>Nettleservinduets tittel Teksten som vi vil se i nettleseren vår !!!

Hva er HTML

World Wide Web (WWW) består av nettsider som er laget ved hjelp av det såkalte HyperText Markup Language (HTML). Selv om mange snakker om programmering på dette språket, er HTML slett ikke et programmeringsspråk i tradisjonell forstand. HTML er et merkespråk for et dokument. Når du utvikler et HTML-dokument, utføres markeringen av et tekstdokument på samme måte som en editor gjør med en rød blyant. Disse merkene tjener til å indikere presentasjonsformen for informasjonen i dokumentet.

Spesielle HTML-lesere, ofte referert til som nettlesere, tolker HTML-formaterte filer, formaterer dem som nettsider og viser innholdet på en brukers dataskjerm. Det finnes et stort antall nettleserprogrammer utviklet av ulike selskaper, men i dag, av en rekke programmer, skiller to ledende programmer seg tydelig ut - Netscape Communicator og Microsoft Internet Explorer.

Netscape Navigator er utviklet av Netscape Communications Corporation. Som med mange programvareprodukter, finnes det en rekke versjoner av dette programmet. Den siste versjonen av Netscape Communicator når dette skrives er versjon 4.7. Internet Explorer ble utviklet av Microsoft. Den siste versjonen av dette programmet er 5.0.

Andre nettlesere henger betydelig etter i popularitet. For noen år siden var Netscapes nettleser den ledende nettleseren, med mer enn to tredjedeler av brukerne som brukte denne nettleseren. Med lanseringen av nettleseren har Microsoft gått langt for å erobre denne delen av markedet. Media ofte

det har vært rapporter om en krig mellom nettlesere for brukere. Nå er disse to nettleserne sammenlignbare i popularitet. Den økende populariteten til Microsoft-nettleseren tilrettelegges av inkluderingen av nettleseren i Windows 98-operativsystemet, men til slutt forblir valget av nettleseren hos brukeren.

Moderne nettlesere er rike på funksjoner, men det viktigste for dem er tolkningen av dokumenter merket i henhold til reglene for HTML. Denne boken er hovedsakelig viet beskrivelsen av disse reglene. I den første delen vil vi kun dekke de grunnleggende prinsippene for å bygge HTML-dokumenter.

For å forstå hva et merkespråk er, la oss huske de gode gamle dagene, da mange jobbet med tekstredigerere som WordStar. I dem, for å fremheve en setning, for eksempel i fet skrift, ble spesielle merker (/ B og / b) satt på begynnelsen og slutten:

/B Denne teksten vises i fet skrift / b

Når du skriver ut slik tekst til en utskriftsenhet (vi snakker ikke om skjermer ennå, i de fjerne tider eksisterte de enten ikke i det hele tatt, eller det var alfanumeriske skjermer som ikke tillot endring av fonter) ble tegn / inn tvunget til å bruke fet skrift til det vil være / b tegn.

HTML fungerer på samme måte. Hvis det er behov for å markere tekst på skjermen med fet skrift, kan dette gjøres på samme måte:

Denne teksten vises i fet skrift.

Symboler inkludere fet skrift og tegnene skru det av. Slike tegn, som styrer visningen av tekst og samtidig ikke vises på skjermen selv, kalles vanligvis tagger i HTML (fra det engelske ordet tag - en etikett, et tegn).

Alle HTML-tagger er avgrenset med skilletegn (< и >), som identifikatoren (navnet) til taggen er skrevet mellom (i vårt eksempel er dette i), og muligens dens parametere. Det eneste unntaket fra denne regelen er kommentarkoder med mer komplekse skilletegn (). Navnene på tagger, så vel som deres parametere, kan skrives i et hvilket som helst register. For konsistens gjennom hele denne boken er de fleste tagger skrevet med store bokstaver.

De fleste HTML-tagger brukes i par, det vil si for en bestemt tag, la oss kalle det åpningstaggen, dokumentet har en tilsvarende avsluttende tag. I henhold til HTML-reglene skrives den avsluttende taggen på samme måte som åpningstaggen, men med en / (skråstrek) foran tagnavnet. Den eneste grunnleggende forskjellen mellom tag-par er at slutttaggene ikke bruker parametere.

Tagger som trenger tilsvarende slutttagger, kalles containertagger. Alt som skrives mellom de tilsvarende åpnings- og lukketaggene vil bli kalt innholdet i container-taggen. Noen ganger kan sluttkoden utelates. For eksempel for en kode som beskriver data for en tabellcelle , den tilsvarende sluttkoden kan alltid utelates. Slutten av data for en tabellcelle vil bli gjenkjent av utseendet til neste tag eller en tabellrad slutttag.

Det finnes en rekke koder som etterfølgende koder er utelatt av de fleste dokumentforfattere. Et eksempel kan være listeelement-taggen

  • eller avsnittskode

    Moderne nettlesere vil i mange tilfeller formatere dokumenter riktig hvis noen av de etterfølgende taggene utelates, men denne praksisen kan ikke anbefales.

    En rekke tagger trenger i prinsippet ikke etterfølgende tagger. Eksempler inkluderer bildeinnsettingskoden , tvungen linjemating
    , som spesifiserer basisfonten og andre. Ofte fra selve formålet med taggen kan du gjette om den trenger en etterfølgende.

    Det er generelle regler for hvordan nettlesere tolker tagger. I motsetning til programmeringsspråk, der feilaktige utsagn fører til utstedelse av passende meldinger på kompileringsstadiet av programmet og krever redigering, er det ikke vanlig i HTML å svare på feil skriving av tagger. En feil skrevet kode eller dens parameter bør ganske enkelt ignoreres av nettleseren. Dette er en generell regel for alle nettlesere, som ikke bare gjelder feilskrevne tagger, men også tagger som ikke gjenkjennes av denne versjonen av nettleseren. Et eksempel kan være koder foreslått og implementert for en bestemt nettleser og ukjent for en annen. For eksempel tagbeholder , som tjener til å gi alternativ informasjon til nettlesere som ikke gir støtte for rammestrukturer, vil ikke bli gjenkjent av slike nettlesere. En nettleser som støtter rammer når du møter taggen <NOFRAMES>, hopper over all informasjonen den inneholder. Og en nettleser som ikke er kjent med rammer, vil selvfølgelig ikke forstå taggen <NOFRAMES>... Imidlertid, i henhold til regelen ovenfor, vil denne taggen ganske enkelt hoppes over, men all etterfølgende informasjon vil vises.</p> <p>Tagger kan skrives med parametere eller attributter (fra engelsk, attributt). Gjennom denne boken vil vi bruke begrepet parameter oftest. Settene med tillatte parametere er individuelle for hver tag. De generelle reglene for å skrive parametere er som følger. Tagnavnet kan følges av parametere, som er atskilt fra hverandre med mellomrom. Rekkefølgen på tag-parameterne er vilkårlig. Mange parametere krever at verdiene deres spesifiseres, men noen parametere har ingen verdier eller kan skrives uten dem, forutsatt standardverdiene. Hvis en parameter krever en verdi, vises den etter parameternavnet med et likhetstegn. Parameterverdien kan skrives i anførselstegn eller uten dem. Det eneste tilfellet der du ikke kan klare deg uten anførselstegn er tilfellet når det er mellomrom i parameterverdien. I parameterverdier (i motsetning til navnene på tagger og selve parameterne), er skriveregisteret noen ganger viktig. Her er et eksempel på hvordan du skriver en tag med parametere:</p> <p><TABLE BORDER ALIGN="left"> </p> <p>Her for taggen <TABLE>to parametere er gitt. Den første BORDER-parameteren er spesifisert uten verdi. Den andre ALIGN-parameteren er igjen.</p> <p>De påfølgende kapitlene i den første delen av boken vil beskrive formålet med HTML-tagger og deres parametere. Generelt kan tagger ha forskjellige parametere, men det finnes en rekke parametere som er like for nesten alle tagger. Vi vil her nevne de generelle parametrene til tagger, for ikke å snakke om dem lenger når vi beskriver hver tag.</p> <p>Alle tagger som kan brukes i seksjonen <BODY>HTML-dokument kan ha parametere CLASS, ID, LANG, LANGUAGE, STIL og TITLE. Bruken av disse parameterne er nyttig, først og fremst, når du styler dokumenter, som vil bli diskutert i den andre delen av boken.</p> <p>Parameterne CLASS, ID, STYLE støttes av Internet Explorer 3.0 og nyere og Netscape 4.0 og høyere. Disse parameterne er nødvendige når du bruker stiler.</p> <p>LANG, LANGUAGE, TITLE parametere - støttes kun av Internet Explorer, fra og med versjon 4.0. Disse parameterne indikerer henholdsvis språket som brukes (for eksempel for Russland: LANG = ru), skriptspråket (for eksempel LANGUAGE = JavaScript), samt teksten til verktøytipset som vises når musepekeren holder over dette element (TITLE).</p> <p>I moderne HTML, i tillegg til språkkoder og deres innhold, er skriptkoder (javascript eller VBScript) også skrevet i HTML-kildekode. I den første delen av boken er dette praktisk talt ikke nevnt noe sted, men den andre delen er helt viet spørsmålene om bruk av manus.</p> <p>Avslutningsvis en generell oversikt over HTML, merker vi at de enkleste HTML-dokumentene er ren tekstfiler, for visning og redigering som du kan bruke hvilken som helst tekstredigerer. Disse filene har vanligvis utvidelsen HTM eller HTML.</p> <p>HTML-spesifikasjoner</p> <p>HTML ble populær på midten av 90-tallet, takket være den eksponentielle veksten til Internett. På dette tidspunktet var det behov for å standardisere språket, siden ulike selskaper som utviklet programvare for tilgang til Internett tilbød sitt</p> <p>flere og flere varianter av HTML-instruksjoner. Nå er det på tide å komme til en slags felles enighet om bruken av HTML-koder.</p> <p>En organisasjon kalt World Wide Web Consortium (forkortet W3C) tok over HTML-spesifikasjonen. Hennes oppgave var å utarbeide en spesifikasjon som gjenspeiler det nåværende utviklingsnivået for språkets evner, under hensyntagen til de ulike forslagene fra nettleserselskapene. I november 1995 dukket således HTML 2.0-spesifikasjonen opp, designet for å formalisere praksisen med å bruke HTML som hadde utviklet seg mot slutten av 1994.</p> <p>Godkjenningsordningen for spesifikasjoner er som følger. W3C-konsortiet utsteder et utkast til spesifikasjon, etter diskusjon av dette utstedes en såkalt utkastversjon av spesifikasjonen og foreslår den for diskusjon for en viss periode. Etter en periode med overveielse kan et arbeidsutkast til spesifikasjonen bli en anbefaling, det vil si en offisielt anerkjent versjon av HTML-spesifikasjonen.</p> <p>Kort tid etter 2.0-spesifikasjonen ble en fungerende versjon av 3.0-spesifikasjonen utgitt, og diskusjonsperioden gikk ut i september 1995. Denne spesifikasjonen ble aldri akseptert som en formell anbefaling. Det var ment å inkludere et bredt utvalg av tagger og funksjoner spesifikke for individuelle nettlesere, men W3C klarte ikke å utvikle en god spesifikasjon for et så stort antall instruksjoner.</p> <p>Etter mye omtanke ble utkast til HTML 3.2 utgitt i mai 1996. Prosjektet var basert på noen av taggene tilgjengelig i versjon 3.0, som viste stabilitet i arbeidet. I september 1996, etter måneder med diskusjon, ble versjon 3.2 en foreslått spesifikasjon, og i januar 1997 ble den en offisiell anbefaling.</p> <p>I juli 1997 ble den foreslåtte HTML 4.0-spesifikasjonen utgitt, som ble en offisiell anbefaling i desember 1997. Dette er den siste vedtatte spesifikasjonen til dags dato.</p> <p>I denne korte oversikten over historien til utviklingen av HTML-språket er det neppe verdt å beskrive funksjonene til forskjellige spesifikasjoner i detalj, spesielt siden utviklere i det virkelige liv ikke alltid følger konsortiets anbefalinger. Her er bare noen av ideene bak den siste spesifikasjonen.</p> <p>I HTML 4.0-spesifikasjonen var nøkkelideen å skille beskrivelsen av strukturen til dokumentet fra beskrivelsen av presentasjonen på skjermen. Erfaring har vist at å skille struktur og presentasjon av et dokument reduserer kostnadene for å støtte et bredt spekter av plattformer, miljøer og lignende, og gjør det også enklere å korrigere dokumenter. I samsvar med denne ideen bør man i større grad bruke metodene for å beskrive presentasjonen</p> <p>dokument ved hjelp av stilark, i stedet for å spesifisere presentasjonsdata ispedd innholdet i dokumentet. For å implementere denne ideen i HTML 4.0-spesifikasjonen, er en rekke tagger som brukes til å spesifisere presentasjonsformen for HTML-elementer, fjernet. Tagger som er kansellert av denne grunn inkluderer <CENTER>, <FONT>, <BASEFONT>, <S>, <STRIKE>, <U>... Blant andre kansellerte tagger, merker vi <ISINDEX>, <APPLET>, <DIR>, <MENU>... I stedet for de kansellerte taggene, foreslås alternative alternativer for å implementere de tilsvarende egenskapene, som vi understreker i denne boken.</p> <p>Konseptet med en utdatert tag er som følger. Hvis en kode er erklært foreldet i denne språkspesifikasjonen, betyr det at nettlesere bør fortsette å støtte slike tagger inntil videre, men bruken frarådes. I de følgende spesifikasjonene kan disse taggene gjøres foreldet. Utdaterte tagger støttes kanskje ikke lenger av nettlesere. Bare tre tagger er avviklet i HTML 4.0-spesifikasjonen:<ХМР>, <PLAINTEXT>OG <LISTING>... Informasjon om hvilke av brikkene som inngår i spesifikasjonen kan fås fra tabellen i vedlegg A1.</p> <p>Offisiell informasjon om HTML-spesifikasjonen kan alltid fås fra W3C-nettstedet på <b>http://www.w3.org/TR/</b>... 4.0-spesifikasjonen er kl <b>http://www.w3.org/TR/REC-htmI40-971218</b>. </p> <p>Merk at logisk sett bør den offisielle spesifikasjonen spille rollen som en veiledende og styrende kraft, og sikre samme form for presentasjon av informasjon av forskjellige nettlesere. Dette er det ideelle alternativet å strebe etter. I virkeligheten er ting ikke så bra. Nye ideer dukker stadig opp, implementert av utviklingsselskaper i deres nettlesere og promotert av dem. Vellykkede ideer slår rot og blir deretter plukket opp av andre utviklere. Noen av funksjonene forblir spesifikke for en bestemt nettleser. Vellykkede design havner i spesifikasjonen og blir generelt akseptert. Dermed er prosessen med å forbedre funksjonene til nettlesere og avgrense spesifikasjonen en pågående prosess som påvirker hverandre.</p> <p>Dokumentstruktur</p> <p>Den første taggen å begynne å beskrive HTML-dokumenter med er <HTML>... Den skal alltid starte dokumentbeskrivelsen, og avslutte dokumentbeskrivelsen med taggen</HTML>... Disse kodene indikerer at linjene mellom dem representerer et enkelt HTML-dokument. Selve dokumentet er en vanlig ASCII-tekstfil. Uten disse kodene kan det hende at nettleseren eller andre seere ikke kan identifisere dokumentformatet og tolke det riktig.</p> <p>Oftest taggen <HTML>brukes uten parametere. Tidligere versjoner brukte VERSJON-alternativet, som ble avviklet av HTML 4.0-spesifikasjonen. Denne parameteren ble erstattet av taggen<! DOCTYPE>. </p> <p>De fleste moderne nettlesere kan gjenkjenne dokumentet og inneholder ikke tagger <HTML>og</HTML>, men deres bruk er svært ønskelig.</p> <p>Mellom et par tagger <HTML>og</HTML> selve dokumentet er lokalisert. Et dokument kan bestå av to seksjoner - en overskriftsseksjon (som starter med taggen <HEAD>) og delen av innholdsdelen av dokumentet (begynner med taggen <BODY>). For dokumenter som beskriver rammestrukturer, i stedet for BODY-delen, brukes FRAMESET-delen (med taggen <FRAMESET>). Deretter vil vi vurdere reglene for å komponere delene av dokumentet HODE og KROPP. Konstruksjonen av dokumenter som inneholder rammer er omtalt i kapittel 5.</p> <p><b> <span>Del av HEAD-dokumentet</span> </b></p> <p>HEAD-delen av et dokument definerer overskriften og er ikke en obligatorisk kode, men en velskrevet overskrift kan være ganske nyttig. Hensikten med overskriften er å gi nødvendig informasjon for programmet som tolker dokumentet. Tagger som er inne i HEAD-delen (bortsett fra navnet på dokumentet som er beskrevet med taggen <TITLE>) vises ikke på skjermen.</p> <p>Titteldelen åpnes med tag <HEAD>... Vanligvis følger denne taggen umiddelbart etter taggen <HTML>... Slutt-tag</HEAD> viser slutten av denne delen. Mellom taggene som er nevnt er resten av overskriftsseksjonstaggene.</p> <p><b> <span>Dokumentets navn</span> </b></p> <p>Tagbeholder <TITLE>er den eneste nødvendige tittelkoden og brukes til å gi dokumentet en tittel. Det vises vanligvis i overskriften til nettleservinduet. stikkord <TITLE>ikke å forveksle med navnet på dokumentfilen; tvert imot er det en tekststreng helt uavhengig av filnavn og plassering, noe som gjør den ganske nyttig. Navnet på filen er stivt bestemt av operativsystemet til datamaskinen den er lagret på. Du bør også skille navnet på dokumentet (med taggen <TITLE>) fra overskrifter i dokumentet, vanligvis merket <Hx>. </p> <p><i> <b>Merk</b> </i></p> <p><i> <span>Generelt sett har den obligatoriske tittelen på dokumentet karakter av en hasteanbefaling. Umerket dokument <TITLE>vil også vises av nettlesere. I dette tilfellet vil forskjellige nettlesere vise forskjellig informasjon som vindustittel. Dette er hvordan tidlige versjoner av Netscape-nettleseren ville vise linjen "Ingen tittel". Andre nettlesere viser enten ingenting, eller viser URL-en til den nedlastede filen, og gjenspeiler informasjonen i nettleserens plasseringslinje.</span> </i></p> <p>Navnet på dokumentet er skrevet mellom tagger <TITLE>og</TITLE> og er en tekstlinje. I prinsippet kan navnet være av ubegrenset lengde og inneholde alle tegn, bortsett fra noen reserverte. I praksis bør du begrense deg til én linje, med tanke på at tittelen vises i tittellinjen i nettleservinduet. Du bør også huske hva som gjenstår av dokumenttittelen når du minimerer nettleservinduet. Det anbefales å begrense lengden på dokumentnavnet til 60 tegn. Du kan se hvordan tittelen vises i nettleservinduet i et hvilket som helst bilde i denne boken, som gir et eksempel på visning av et dokument.</p> <p>Som standard brukes teksten i tittelen på dokumentet når du oppretter et bokmerke for dokumentet. Derfor, for mer informasjonsinnhold, unngå ansiktsløse navn (hjemmeside, indeks osv.). Slike ord som brukes som navn på et bokmerke er vanligvis helt ubrukelige. Tittelen på dokumentet skal kort beskrive innholdet. Merk at når dokumenter med rammestruktur vises på skjermen, når et separat dokument med eget navn lastes inn i hver av rammene, vil kun navnet på hoveddokumentet være synlig på skjermen. Det anbefales imidlertid også sterkt å navngi de individuelle dokumentene som skal lastes inn i rammer. Kapittel 5 diskuterer dette spørsmålet mer detaljert.</p> <p>Viktigheten av tittelen på dokumentet bestemmes av følgende faktum. Siden taggen <TITLE>er plassert nesten helt i begynnelsen av HTML-filen, så etter starten av innlasting av dokumentet, er det denne filen som vises først. Deretter lastes hovedinnholdet i dokumentet, mens nettleseren begynner å formatere dokumentet i vinduet. Denne prosessen, generelt sett, avhengig av innholdet og strukturen til dokumentet, samt hastigheten på forbindelsen, kan bli forsinket. I ganske lang tid vil brukeren tenke på en tom skjerm, hvor den eneste informative linjen vil være navnet på dokumentet. Ganske ofte (når tilkoblingen er brutt, eller hvis brukeren ikke vil vente på at dokumentet skal fullføres), slutter all informasjon om dokumentet der.</p> <p><b><span>Forholdet til andre dokumenter</span> </b></p> <p>Ofte er HTML-dokumenter koblet, det vil si at de har lenker til hverandre. Koblinger kan enten være absolutte eller relative. Begge har ulemper. Absolutte koblinger kan være for tungvinte og slutte å fungere hvis du flytter et dokument lavere i hierarkiet. Relative lenker er lettere å legge inn og oppdatere, men denne koblingen brytes også hvis det høyeste dokumentet i hierarkiet flyttes. Begge typer koblinger kan brytes når du overfører et dokument fra en datamaskin til en annen.</p> <p>Det hender ofte at en bruker har lastet ned et stort dokument til maskinen sin og koblet fra nettverket for å studere det i detalj. Alle lenker i den lokale kopien av dokumentet slutter å fungere. For å "reanimere" dem, må du igjen referere til originaldokumentet som ligger på den eksterne datamaskinen.</p> <p>Heldigvis forutså HTML-utviklerne dette problemet og la til to tagger, <BASE>og <LINK>, som inngår i overskriften slik at koblingen mellom dokumenter ikke brytes.</p> <p><b>stikkord <BASE> </b> </p> <p>stikkord <BASE>tjener til å spesifisere den fullstendige basis-URLen til dokumentet. Med dens hjelp fortsetter den relative koblingen å fungere hvis dokumentet overføres til en annen katalog eller til og med til en annen datamaskin. stikkord <BASE>fungerer på en lignende måte som MS-DOS-banekommandoen, som lar seeren finne en kobling til dokumentet den leter etter, selv om den er i et eldre dokument som ligger på en annen datamaskin.</p> <p>stikkord <BASE>har én nødvendig parameter, HREF, etterfulgt av hele URL-en til dokumentet. Nedenfor er et eksempel på bruk av taggen <BASE>. </p> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Angi baseadressen</TITLE> </p> <p><BASE HREF="http://www.my_host.ru/~sergeev"> </p> <p></HEAD> </p> <p><BODY> </p> <p><img src='/obshchaya-struktura-html-dokumenta-osnovy-html-dlya-nachinayushchih-na-ponyatnom/' loading=lazy loading=lazy> </p> <p></BODY> </p> <p></HTML> </p> <p>stikkord <BASE>forteller nettleseren hvor den skal lete etter filen. Hvis brukeren arbeider med en lokal kopi av filen og maskinen hans ikke er koblet fra nettverket, vil nyhetsikonbildet bli funnet og vist i nettleservinduet.</p> <p><b>stikkord <LINK> </b></p> <p>Selv om taggen <BASE>lar deg finne en fil, spørsmålet om dokumentforhold forblir åpent. Betydningen av disse relasjonene øker i forhold til kompleksiteten til dokumentene dine. For å opprettholde en logisk forbindelse mellom dem, introduserte HTML taggen <LINK>. </p> <p>stikkord <LINK>indikerer forholdet mellom dokumentet som inneholder denne taggen og et annet dokument eller objekt. Den består av en URL og parametere som konkretiserer dokumentrelasjoner. Dokumenttittelen kan inneholde et hvilket som helst antall tagger <LINK>... Tab. 1.1 beskriver parametrene til taggen <LINK>og deres funksjoner.</p> <p><i> <span><b>Tabell 1.1.</b> Tag-parametere <LINK> </span> </i></p> <p>Her er noen eksempler på taggen <LINK>med parametere:</p> <p><LINK REL="contents" HREF ="../toc.html"> </p> <p><LINK HREF="mailto:sergeev@mail.ifmo.ru" REV="made"> </p> <p>Den første linjen indikerer en lenke til dokumentets innholdsfortegnelsesfil (toc.html - innholdsfortegnelse) med en direkte relasjon til innholdet. Den andre linjen beskriver forholdet til URL-en til forfatteren av dokumentet (med den omvendte relasjonen).</p> <p>Mange forskjellige relasjoner kan eksistere mellom dokumenter. Eksempler på andre verdier for REL-parameteren: bokmerke, opphavsrett, ordliste, hjelp, hjem, indeks, toc, neste, forrige. REV-parameteren kan også ha følgende verdier: forfatter, redaktør, utgiver, eier.</p> <p><b>stikkord <META> </b></p> <p>Utviklingen av nye spesifikasjoner for hypertekst-markeringsspråket tar lang tid, og i løpet av denne tiden klarer selskapene som produserer nettlesere å gi ut flere versjoner av produktene sine. Derfor kan en annen kode legges til titteldelen <META>som lar dokumentforfattere definere ikke-HTML-informasjon.</p> <p>Denne informasjonen brukes av nettleseren for handlinger som ikke dekkes av gjeldende HTML-spesifikasjon. stikkord <META>Du trenger det ikke for å lage dine første HTML-dokumenter, men du vil sikkert trenge det ettersom sidene dine blir mer komplekse.</p> <p>Eksempel:</p> <p><МЕТА HTTP-EQUIV="refresh" CONTENT="60" RL="www.my_host.ru/homepage.html"> </p> <p>Nettleserne Netscape Navigator og Internet Explorer vil tolke denne oppføringen som en instruksjon om å vente 60 sekunder og deretter laste inn et nytt dokument. Denne instruksjonen brukes ofte når du endrer plasseringen av dokumenter. Et lite dokument med en gitt streng kan stå på den gamle plasseringen av dokumentet for automatisk å koble til den nye plasseringen.</p> <p>Neste linje:</p> <p><МЕТА HTTP-EQUIV="refresh" CONTENT="60"> </p> <p>instruerer nettleseren om å laste inn siden på nytt hvert 60. sekund. Dette kan være nyttig hvis dataene på siden oppdateres ofte, for eksempel ved sporing av aksjekurser.</p> <p>Bruken av elementet har blitt veldig populært <META>for noen typiske oppgaver. Et eksempel er indikasjonen av søkeord som brukes av søkemotorer. Denne metoden gjør det mulig å inkludere flere ord i dokumentets indeks, som kanskje ikke er eksplisitt inkludert i innholdet. For å gjøre dette, i taggen <META>navnet på en egenskap er spesifisert som verdien til NAME-parameteren. Og ved å bruke CONTENT-parameteren indikeres verdien av denne egenskapen, for eksempel:</p> <p><МЕТА NAME="author" CONTENT="Александр Сергеев"> </p> <p>HTML-spesifikasjonen definerer ikke noen spesifikke egenskapsnavn skrevet i taggen <META>... Det er imidlertid flere ofte brukte egenskaper, for eksempel beskrivelse, nøkkelord, forfatter, roboter og andre:</p> <p><МЕТА NAME="description" CONTENT="Описание возможностей языка HTML 4.0"> </p> <p><МЕТА NAME="keywords" CONTENT ="тэг, гипертекст, HTML, браузер"> </p> <p>Gitt tagger <META>kunne godt vært indikert for eksempel for den elektroniske versjonen av denne boken.</p> <p>stikkord <META>kan ha parametrene som er angitt i tabellen. 1.2.</p> <p><i> <span><b>Tabell 1.2.</b> Tag-parametere <META> </span> </i></p> <p>En annen viktig bruk av taggen <META>er en indikasjon på tekstkodingen. Så for tekst på russisk i Windows-koding, må du skrive følgende linje:</p> <p><МЕТА HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"> </p> <p><b><span>Andre overskriftselementer</span> </b></p> <p>To flere tagger kan være til stede i titteldelen av dokumentet -<STYLE> и <SCRIPT>. Их назначение связано с использованием таблиц стилей в документе и записью скриптов. Эти вопросы подробно рассматриваются во второй части книги. </p> <p><b> <span> Раздел документа </span> <span>BODY </span> </b></p> <p>В этом разделе документа располагается его содержательная часть. Большинство тэгов, рассматриваемых далее в этой главе и последующих, должно располагаться в данном разделе документа. Здесь мы рассмотрим лишь некоторые общие вопросы. </p> <p>Раздел документа BODY должен начинаться тэгом <BODY> и завершаться тэгом </BODY>, между которыми располагается все содержимое данного раздела. Строго говоря, наличие этих тегов не является обязательным, поскольку браузеры могут определить начало содержательной части документа по контексту. Однако их употребление рекомендуется. </p> <p>Тэг <BODY> имеет ряд параметров, ни один из которых не является обязательным. Перечень параметров приведен в табл. 1.3. </p> <p><i> <span><b>Таблица 1.3. </b> Перечень параметров тега <BODY> </span> </i></p> <table border="1" width="550" height="427"><tr><td width="140" height="33"> <p><b>Параметр </b></p> </td> <td width="400" height="33"> <p><b>Назначение </b></p> </td> </tr><tr><td width="140" height="18" valign="top"> <p>ALINK </p> </td> <td width="400" height="18" valign="top"> </td> </tr><tr><td width="140" height="36" valign="top"> <p>BACKGROUND </p> </td> <td width="400" height="36" valign="top"> <p>Указывает на URL-адрес изображения, которое используется в качестве фонового </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>BOTTOMMARGIN </p> </td> <td width="400" height="36" valign="top"> <p>Устанавливает границу нижнего поля документа в пикселах </p> </td> </tr><tr><td width="140" height="18" valign="top"> <p>BGCOLOR </p> </td> <td width="400" height="18" valign="top"> <p>Определяет цвет фона документа </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>BGPROPERTIES </p> </td> <td width="400" height="36" valign="top"> <p>Если установлено значение FIXED, фоновое изображение не прокручивается </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>LEFTMARGIN </p> </td> <td width="400" height="36" valign="top"> <p>Устанавливает границу левого поля документа в пикселах </p> </td> </tr><tr><td width="140" height="18" valign="top"> <p>LINK </p> </td> <td width="400" height="18" valign="top"> <p>Определяет цвет еще не просмотренной ссылки </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>RIGHTMARGIN </p> </td> <td width="400" height="36" valign="top"> <p>Устанавливает границу правого поля документа в пикселах </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>SCROLL </p> </td> <td width="400" height="36" valign="top"> <p>Устанавливает наличие или отсутствие полос прокрутки окна браузера </p> </td> </tr><tr><td width="140" height="18" valign="top"> <p>TEXT </p> </td> <td width="400" height="18" valign="top"> <p>Определяет цвет текста </p> </td> </tr><tr><td width="140" height="36" valign="top"> <p>TOPMARGIN </p> </td> <td width="400" height="36" valign="top"> <p>Устанавливает границу верхнего поля документа в пикселах </p> </td> </tr><tr><td width="140" height="18" valign="top"> <p>VLINK </p> </td> <td width="400" height="18" valign="top"> <p>Определяет цвет уже просмотренной ссылки </p> </td> </tr></table><p>Использование параметров BACKGROUND и BGCOLOR, определяющих фон документа, подробно рассмотрено в . </p> <p>Параметр BGPROPERTIES, принимающий единственное значение FIXED, поддерживается только браузером Microsoft Internet Explorer. </p> <p>Параметры BOTTOMMARGIN, LEFTMARGIN, RIGHTMARGIN и TOPMARGIN, задающие расстояния в пикселах между краями текста и соответствующими краями окна, а также параметр SCROLL, распознаются только браузером Microsoft Internet Explorer, начиная с версии 4.0. </p> <p>Параметры ALINK, LINK, TEXT и VLINK определяют цвета ссылок и текста документа. </p> <p>В языке HTML цвета определяются цифрами в шестнадцатеричном коде. Цветовая система базируется на трех основных цветах - красном, зеленом и синем - и обозначается RGB. Для каждого цвета задается шестнадцатеричное значение в пределах от 00 до FF, что соответствует диапазону 0-255 в десятичном исчислении. Затем эти значения объединяются в одно число, перед которым ставится символ #. Например, число #800080 обозначает фиолетовый цвет. Чтобы не запоминать совокупности цифр, вместо них можно пользоваться названиями цветов, которые приводятся в приложении П2 . Ранние версии браузеров распознавали только названия 16 стандартных цветов, отмеченных в приложении звездочками. Современные версии браузеров распознают все 140 названий цветов. </p> <p><b><span> Форматирование текста </span> </b></p> <p>В данном разделе будут рассмотрены возможности форматирования отдельных символов текста документа. </p> <p><b> <span> Тэги уровня блока и последовательные тэги </span> </b></p> <p>Некоторые HTML-тэги, которые могут появляться в разделе BODY, называют тэгами уровня блока (block level), в то время как другие последовательными (inline) тэгами или, называя по-другому, тэгами уровня текста (text level), хотя такое разделение тегов по уровням в известной степени условно. </p> <p>Различие уровней HTML-тэгов заключается в следующем: теги уровня блока могут содержать последовательные теги и другие теги уровня блока, тогда как последовательные теги содержат только данные и другие последовательные тэги. Блоковые теги описывают более крупные структуры документов, по сравнению с последовательными тэгами. </p> <p>По умолчанию теги этих видов размещаются в тексте описания различным образом: теги уровня блока начинаются с новой строки, в то время как последовательные - нет. </p> <p><b> <span> Логическое и физическое форматирование </span> </b></p> <p>Для форматирования текста HTML-документов предусмотрена целая группа тэгов, которую можно условно разделить на теги логического и физического форматирования. </p> <p>Тэги логического форматирования обозначают (своими именами) структурные типы своих текстовых фрагментов, такие, например, как программный код (тэг <CODE>), цитата (тэг <CITE>), аббревиатура (тэг <ABBR>) и т. д. (см. описания этих и других подобных тегов в следующем разделе). С помощью тегов <EM> и <STRONG> можно, например, отметить отдельные фрагменты как выделенные, или сильно выделенные. Заметим, что речь идет о структурной разметке, которая не влияет на конкретное экранное представление фрагмента браузером. Поэтому такая разметка и называется логической. Фрагменты с логическим форматированием браузеры отображают на экране определенным образом, заданным по умолчанию. Вид отображения никак не связан со структурным типом фрагмента (т. е. именем тега логического форматирования), но может быть легко переопределен. </p> <p>Тэги физического форматирования определяют формат отображения указанного в них фрагмента текста в окне браузера (согласно предпочтениям автора документа). Например, для отображения фрагмента курсивом можно использовать тег курсива <I>. Этот и другие, часто используемые теги физического форматирования описаны ниже в разделе "Тэги физического форматирования текста"этой главы. </p> <p>Между разработчиками HTML-документов долгое время шли споры о преимуществах и недостатках того или иного подхода. С выходом спецификации HTML 4.0 эти споры завершились в пользу применения логического форматирования, поскольку был провозглашен принцип отделения структуры документа от его представления. Действительно, только на базе логического форматирования можно гибко управлять представлением документа, используя современные методы (основанные на таблицах стилей, динамически изменяющихся документах и т. д.). </p> <p>Тем не менее, на настоящий момент может свободно использоваться и физическое форматирование. В спецификации HTML 4.0 некоторые теги физического форматирования не рекомендуются для применения, однако, пока они все еще поддерживаются всеми браузерами. Заметим, что некоторые теги логического форматирования, призванные заменить отдельные теги физического форматирования, распознаются не всеми браузерами, что делает их применение крайне неудобным. Примером может служить логический тег <DEL>, который рекомендуется использовать вместо физического тега <STRIKE>. </p> <p>Рассматриваемые ниже теги относятся к тэгам уровня текста, т. е. призваны, в основном, размечать небольшие группы символов. Некоторые теги могут задавать разметку и на уровне блока. </p> <p><b> <span> Тэги логического форматирования текста </span> </b></p> <p><b>Тэг <ABBR> </b> </p> <p>Тэг <ABBR> отмечает свой текст как аббревиатуру (ABBReviation). Несмотря на то, что этот тег включен в спецификацию HTML 4.0, он до настоящего времени не поддерживается ни одним браузером. </p> <p><b>Тэг <ACRONYM> </b> </p> <p>Тэг <ACRONYM>. Так же, как и тег <ABBR>, используется для отметки аббревиатур. Этим тэгом рекомендуется отмечать так называемые акронимы, т. е. произносимые слова, состоящие из аббревиатур. Тег <ACRONYM> возможно в будущем станет использоваться для невизуального отображения элементов, например при речевом синтезе. </p> <p>Данный тег удобно использовать в сочетании с параметром TITLE, в качестве значения которого можно указать полную форму записи аббревиатуры. Тогда визуальные браузеры при наведении курсора на текст, размеченный тэгом <ACRONYM>, будут выдавать полное наименование в виде появляющейся подсказки. </p> <p>Заметим, что тег <ACRONYM> распознается только браузером Microsoft Internet Explorer. Пример: </p> <p><ACRONYM TITLE="Санкт-Петербургский государственный институт точной механики и оптики"> СПбГИТМО</ACRONYM> </span><span> - один из ведущих технических вузов Санкт-Петербурга </p> <p><b>Тэг <CITE> </b> </p> <p>Тэг <CITE> используется для отметки цитат или названий книг и статей, ссылок на другие источники и т. д. Браузерами такой текст обычно выводится курсивом. Пример: </p> <p><CITE>Невское время</CITE> является одной из наиболее популярных городских газет Санкт-Петербурга </p> <p><b>Тэг <CODE> </b> </p> <p>Тэг <CODE> отмечает свой текст как небольшой фрагмент программного кода. Как правило, отображается моноширинным шрифтом. Этот тег не следует путать с тэгом <PRE>Являющимся элементом уровня блока, который следует использовать для отметки больших фрагментов (листингов) кода. </p> <p>Например: </p> <p>Пример простейшего оператора языка программирования C:<BR> </p> <p><CODE>puts("Hello, World!");</CODE> </p> <p>Есть еще одно различие в использовании тегов <CODE> и <PRE>В коде программ часто бывает важно наличие нескольких идущих подряд пробелов. Их отображение будет сохранено только при использовании тега <PRE>. </p> <p><b> Тэг <DEL> </b></p> <p>Тэг <DEL> отмечает свой текст как удаленный. Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Тег <DEL> может использоваться как элемент уровня текста и как элемент уровня блока. </p> <p>Тэг имеет два необязательных параметра: CITE и DATETIME. Значение параметра CITE должно представлять собой URL-адрес документа, поясняющего причины удаления данного фрагмента. </p> <p>Параметр DATETIME указывает дату удаления в формате: YYYY-MM-DDThh:mm:ssTZD, определяющем год, месяц, число, часы, минуты и секунды удаления, а также часовой пояс (Time Zone). Например: </p> <p>Последней принятой спецификацией языка разметки HTML является версия <DEL DATETIME=1999-10-29T16:12:53+0.00>3.2</DEL> 4.0 </p> <p>Текст, помеченный тэгом <DEL> обычно отображается перечеркнутым текстом. В спецификации HTML 4.0 этому тэгу отдается предпочтение перед тэгом физического форматирования <STRIKE> или <S>, обозначающих перечеркнутый текст. Однако тег <DEL> </p> <p><b>Тэг <DFN> </b> </p> <p>Тэг <DFN> отмечает свой текстовый фрагмент как определение (DeFinitioN). Например, этим тэгом можно отметить какой-либо термин, когда он встречается в тексте в первый раз. Пример: </p> <p><DFN>Internet Explorer</DFN> - это популярный Web-браузер </p> <p>Тэг <DFN> поддерживается только браузером Microsoft Internet Explorer. Отображается по умолчанию курсивом. </p> <p><b> Тэг <INS> </b></p> <p>Тэг <INS> отмечает свой текст как вставку (INSertion). Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Тег <INS> может использоваться как элемент уровня текста и как элемент уровня блока. </p> <p>Тэг имеет два необязательных параметра: CITE и DATETIME. Значение параметра CITE должно представлять собой URL-адрес документа, поясняющего подробности внесенных дополнений. </p> <p>Параметр DATETIME указывает дату вставки в формате: YYYY-MM-DDThh:mm:ssTZD, определяющем год, месяц, число, часы, минуты и секунды вставки, а также часовой пояс (Time Zone). </p> <p>Текст, помеченный тэгом <INS>, обычно отображается подчеркнутым текстом. Тег <INS> в настоящее время распознается только браузером Microsoft Internet Explorer. </p> <p><b> Тэг <EM> </b></p> <p>Тэг <EM> (EMphasis - выделение, подчеркивание) используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст курсивом. Пример: </p> <p>Пример выделения <EM>отдельных слов</EM> текста </p> <p> <I>. </p> <p><b> Тэг <KBD> </b></p> <p>Тэг <KBD> отмечает текст как вводимый пользователем с клавиатуры. Обычно отображается моноширинным шрифтом, например: </p> <p>Чтобы запустить текстовый редактор, напечатайте: <KBD>notepad</KBD> </p> <p>Применение данного тега предпочтительнее применения тега физического форматирования <TT>. </p> <p><b> Тэг <Q> </b></p> <p>Тэг <Q> отмечает короткие цитаты в строке текста. В отличие от тега уровня блока <BLOCKQUOTE> при отображении не выполняется отделение размеченного текста пустыми строками. Обычно отображается курсивом. Тег <Q> (в отличие от <BLOCKQUOTE>) в настоящее время распознается только браузером Microsoft Internet Explorer. </p> <p>Тэг имеет параметр CITE, в качестве значения которого можно указать источник цитаты. </p> <p><b> Тэг <SAMP> </b></p> <p>Тэг <SAMP> отмечает текст как образец (SAMPle). Обычное использование этого тега - отметка текста, выдаваемого программами (sample output). Используется также для выделения нескольких символов моноширинным шрифтом. </p> <p>Применение данного тега предпочтительнее применения тега физического форматирования <TT>. Например: </p> <p>В результате работы программы будет напечатано: <SAMP>Hello, World!</SAMP> </span>. </p> <p><b> Тэг <STRONG> </b></p> <p>Тэг <STRONG>, как правило, используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст полужирным шрифтом. Пример: </p> <p>Санкт-Петербург расположен в самой восточной оконечности <STRONG>Финского залива</STRONG> в устье реки <STRONG>Невы< /STRONG> </p> <p>Применение данного тега предпочтительнее применения тега физического форматирования <B>. Тегом <STRONG> обычно размечают более важные фрагменты текста, чем те, что размечены тэгом <EM>. </p> <p><b> Тэг <VAR> </b></p> <p>Тэг <VAR> отмечает имена переменных программ. Обычно такой текст отображается курсивом. Пример: </p> <p>Задайте значение переменной <VAR>N</VAR> </p> <p>Отображение некоторых из примеров, приведенных при описании тегов логического форматирования текста, показано на рис. 1.1. На рисунке видно, как при наведении указателя мыши на текст, отмеченный тэгом <ACRONYM>, выдается подсказка. </p> <p><i><b>Рис. 1.1. </b> </i> <i>Примеры форматирования текста </i> </p> <p>Вы, наверное, обратили внимание на то, что некоторые элементы дают одинаковый результат. Более того, часть элементов может никак не изменять представление фрагмента текста на экране. Может возникнуть законный вопрос: для чего создано такое разнообразие элементов форматирования? </p> <p>Ответ - в названии этой группы элементов. Они предназначены для расстановки логических ударений, выделения логических частей и подчеркивания сути высказываний. Их использование весьма актуально, поскольку, вероятно, в ближайшем будущем возможности браузеров возрастут, например, станет возможен поиск цитат на Web-пространстве, а может быть следующее поколение браузеров научится читать документы вслух. Кроме того, авторам документов ничто не мешает уже сегодня, применяя таблицы стилей, задать желаемое отображение для любого из тэгов, переопределив значения по умолчанию. </p> <p> <b> <span>Тэги физического форматирования текста </span> </b></p> <p>Приведем описание тегов физического форматирования. Часть из них не рекомендуется к использованию спецификацией HTML 4.0 по приведенным выше причинам. Некоторые теги отменены (deprecate) спецификацией HTML 4.0, однако они продолжают поддерживаться браузерами. </p> <p><b> Тэг </p> <p>Тэг <B> отображает текст полужирным шрифтом. В большинстве случаев рекомендуется вместо тега <B> использовать тег логического форматирования <STRONG>. Например: </p> <p>Это <B>полужирный</B> шрифт. </p> <span> <img src='https://i0.wp.com/webnav.ru/books/html4/html_rules/02.gif' height="435" width="401" loading=lazy loading=lazy></span> <p><i><b>Рис. 1.2. </b> Примеры физического форматирования текста (браузером Netscape) </i> </p> <p><b> Тэг <<span>I > </span> </b></p> <p>Тэг <I> отображает текст курсивом. Для большинства случаев вместо этого тега рекомендуется использовать теги <EM>, <DFN>, <VAR> или <CITE>, поскольку последние лучше отражают назначение выделяемого текста. Например: </p> <p>Выделение <I>курсивом</I> </p> <p><b> Тэг <TT> </b></p> <p>Тэг <TT> отображает текст моноширинным шрифтом. Для большинства случаев вместо этого тега лучше использовать теги <CODE>, <SAMP> или <KBD>. Пример: </p> <p>Это <TT>моноширинный</TT> шрифт </span>. </p> <p><b> Тэг <U> </b></p> <p>Тэг <U> отображает текст подчеркнутым. Отмененный тэг. Вместо него рекомендуется использовать теги <STRONG> или <CITE>. Например: </p> <p>Пример <U>подчеркивания</U> текста </span>. </p> <p><b>Тэги <STRIKE> и <S> </b> </p> <p>Тэги <STRIKE> и <S> отображают текст, перечеркнутый горизонтальной линией. Отмененный тэг. Вместо него следует использовать тег <DEL>. Например: </p> <p>Пример <STRIKE>зачеркнутого</STRIKE> текста </span>. </p> <p>В настоящее время тег <DEL> поддерживается не всеми браузерами, поэтому пока рекомендуется использовать <DEL> в сочетании с тэгом <STRIKE>. А именно, внутрь тэга-контейнера <DEL> можно вложить пару тегов </p> <p><STRIKE>...</STRIKE> . </p> <p><b>Тэг <BIG> </b> </p> <p>Тэг <BIG> выводит текст шрифтом большего (чем непомеченная часть текста) размера. Вместо данного элемента лучше использовать <STRONG> или теги заголовков, например, <H3> <BIG></p> <p>Шрифт <BIG>большего</BIG> размера </span>. </p> <p><b> Тэг <SMALL> </b></p> <p>Тэг <SMALL> выводит текст шрифтом меньшего размера. Поскольку в HTML нет тэга, противоположного по действию тэгу <EM>, то для этих целей можно применять тег <SMALL>. Большинство браузеров поддерживают вложенные теги <SMALL>, однако использовать такой подход не рекомендуется. Например: </p> <p>Шрифт <SMALL>меньшего</SMALL> размера </span>. </p> <p><b>Тэг <SUB> </b> </p> <p>Тэг <SUB> сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например: </p> <p>Пример шрифта для <SUB>нижнего</SUB> индекса </span>. </p> <p><b> Тэг <SUP> </b></p> <p>Тэг <SUP> сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например: </p> <p>Пример шрифта для <SUP>верхнего</SUP> индекса </span>. </p> <p><b> Тэг <BLINK> </b></p> <p>Тэг <BLINK> отображает мигающий текст. Этот тег не входит в спецификацию HTML и поддерживается только браузером Netscape. Опытные разработчики крайне редко прибегают к использованию этого тэга, поскольку наличие на странице мигающих символов раздражает многих пользователей. </p> <p><b> <span>Тэг </b></p> <p>Тэг-контейнер <SPAN> является аналогом тега уровня блока <DIV>. Может использоваться в тех случаях, когда требуется отметить фрагмент текста для задания его свойств, и при этом не удается использовать никакой другой структурный тег форматирования. </p> <p>Браузер Microsoft Internet Explorer дополнительно разрешает использование следующих параметров тэга: DIR, DATAFLD, DATAFORMATAS, DATASRC. Описание параметров можно найти во второй части книги. </p> <span> <img src='https://i0.wp.com/webnav.ru/books/html4/html_rules/03.gif' height="240" width="353" loading=lazy loading=lazy></span> <p><i><b>Рис. 1.3. </b> Использование вложенных тегов форматирования текста </i> </p> <p>Тэги форматирования могут быть вложенными друг в друга. При этом нужно внимательно следить, чтобы один контейнер находился целиком в другом контейнере. На рис. 1.3 показан пример использования вложения элемента курсива в элемент полужирного шрифта. Использован следующий фрагмент HTML-кода: </p> <p>Это <B>полужирный</B> шрифт. </p> <p> <p>Это <I>курсив</I>. </p> <p> <p>А здесь текст <B><I>полужирный и курсивный</I></В> </p> <p><b> Тэг <FONT> </b></p> <p>Тэг <FONT> указывает параметры шрифта. Он относится к тэгам физического форматирования уровня текста. </p> <p>Назначение параметров шрифта непосредственно в тексте документа нарушает основную идею разделения содержательной части документа и описания формы представления документа. Поэтому в спецификации HTML 4.0 данный тэг, а также тег <BASEFONT> отнесены к отмененным. Их дальнейшее применение не рекомендуется. </p> <p>Несмотря на эти грозные предупреждения, видимо, для самых простых документов физическое форматирование можно считать допустимым. Кроме того, начинать обучение основам форматирования проще всего именно с правил непосредственного указания форматов элементов. До стилевого оформления начинающий разработчик должен еще дорасти. </p> <p>Тэг <FONT> относится к последовательным элементам, поэтому не может включать в себя элементы уровня блока, например, <P>Или <TABLE>. </p> <p>Для тега могут задаваться следующие параметры: FACE, SIZE и COLOR. Заметим, что браузер Netscape допускает также использование двух дополнительных параметров: POINT-SIZE и WEIGHT, описание которых опускаем. </p> <ul><p>FACE </p> <p>Параметр FACE служит для указания типа шрифта, которым программа просмотра пользователя будет выводить текст (если такой шрифт имеется на компьютере). Значением данного параметра служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющего у пользователя. Если такого шрифта не будет найдено, то данное указание будет проигнорировано и будет использован шрифт, установленный по умолчанию. </p> <p>Можно указать как один, так и несколько названий шрифтов, разделяя их запятыми. Это весьма полезное свойство, так как в разных системах могут быть почти идентичные шрифты, называющиеся по-разному. Другим важным качеством является задание предпочтения использования шрифтов. Список шрифтов просматривается слева направо. Если на компьютере пользователя нет шрифта, указанного в списке первым, то делается попытка найти следующий шрифт и т. д. </p> <p>Приведем пример использования параметра FACE: </p> <p><HTML> <HEAD> </p> <p><TITLE>Назначение шрифтов</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p><BR> </p> <p><FONT FACE="Verdana", "Arial", "Helvetica"> </p> <p>Пример задания названия шрифта. </p> <p></FONT> </p> <p></BODY> </p> <p></HTML> </p> <p>На рис. 1.4 показано отображение примера браузером Netscape. В примере в качестве предпочитаемого указывается шрифт Verdana, при его отсутствии будет использован шрифт Arial и т. д. </p> </ul><p><img src='https://i2.wp.com/webnav.ru/books/html4/html_rules/04.gif' height="222" width="369" loading=lazy loading=lazy></p> <p><i><b>Рис. 1.4. </b> Отображение примера браузером Netscape </i> </p> <ul><p>SIZE </p> <p>Этот параметр служит для указания размеров шрифта в условных единицах от 1 до 7. Конкретный размер шрифта зависит от используемой программы просмотра. Принято считать, что размер "нормального" шрифта соответствует значению 3. </p> </ul><p>Настройки размеров шрифта, используемых по умолчанию, а также величины абсолютного изменения размеров шрифта, зависят от браузеров. На рис. 1.5 показано окно настройки браузера Netscape, в котором задаются шрифты, используемые по умолчанию. </p> <p>Размер шрифта указывается как абсолютной величиной (SIZE=2), так и относительной (SIZE=+1). Последний способ часто используется в сочетании с заданием базового размера шрифта с помощью тега <BASEFONT>. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>При указании размеров шрифтов записи типа "2" и "+2" (в отличие от большинства языков программирования, в которых унарный знак "+" можно опускать) дают принципиально разный результат. </span> </i></p> <p>Приведем пример, в котором использованы различные способы назначения размеров шрифтов. Отображение примера показано на рис. 1.6. </p> <p><br><img src='https://i2.wp.com/webnav.ru/books/html4/html_rules/05.gif' width="100%" loading=lazy loading=lazy></p> <p><i><b>Рис. 1.5. </b> Окно настройки параметров шрифтов браузера Netscape </i> </p> <p><br><img src='https://i0.wp.com/webnav.ru/books/html4/html_rules/06.gif' width="100%" loading=lazy loading=lazy></p> <p><i><b>Рис. 1.6. </b> Назначение размеров шрифтов </i> </p> <blockquote> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Назначение размеров шрифтов</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p><FONT SIZE=1>Шрифт размера 1</FONT><BR> </p> <p><FONT SIZE=-1>Шрифт размера 2</FONT><BR> </p> <p><FONT SIZE=3>Шрифт размера 3</FONT><BR> </p> <p><FONT SIZE=4>Шрифт размера 4</FONT><BR> </p> <p><FONT SIZE=5>Шрифт размера 5</FONT><BR> </p> <p><FONT SIZE=+3>Шрифт размера 6</FONT><BR> </p> <p><FONT SIZE=7>Шрифт размера 7</FONT><BR> </p> <p></BODY> </p> <p></HTML> </p> </blockquote> <ul><p>COLOR </p> <p>Этот параметр устанавливает цвет шрифта, который может задаваться с помощью стандартных имен или в формате #RRGGBB. Приведем пример документа с разноцветным текстом. </p> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Выбор цвета шрифта</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p><FONT COLOR=green>Текст зеленого цвета</FONT><BR> </p> <p><FONT COLOR=#FF0000>Текст красного цвета</FONT><BR> </p> <p></BODY> </p> <p></HTML> </p> </ul><p><b> Тэг <BASEFONT> </b></p> <p>Тэг <BASEFONT> используется для указания размера, типа и цвета шрифта, используемого в документе по умолчанию. Эти значения обязательны для всего документа, однако могут в нужных местах переопределяться с помощью тега <FONT>. После закрывающего тега </FONT> действие тега <BASEFONT> восстанавливается. Значения параметров шрифтов, используемых по умолчанию, могут неоднократно переопределяться в документе, т. е. тег <BASEFONT> может появляться в документе любое количество раз. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Тэг <BASEFONT> может появляться также и в разделе <HEAD> документа. </span> </i></p> <p>Заметим, что для тега <BASEFONT> не существует закрывающего тэга. </p> <p>В качестве параметров могут использоваться точно такие же параметры, что и для тега <FONT>, а именно: FACE, SIZE и COLOR. Назначение и правила записи параметров аналогичны. </p> <p><i> <b><span>Примечание </b> </span> </i></p> <p><i> <span>Браузер Netscape не допускает применение параметра FACE тега <BASEFONT>. </span> </i></p> <p>Приведем пример использования тега <BASEFONT>. </p> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Назначение размеров шрифтов</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p>Текст, записанный шрифтом по умолчанию. </p> <p><BASEFONT SIZE=2> <p>Шрифт размера 2. </p> <p><BASEFONT SIZE=4> </p> <p> <p>Шрифт размера 4. </p> <p> <p> <TABLE BORDER=1> </p> <p> <TR> </p> <p> <TD>Текст внутри ячейки таблицы</TD> </p> <p> </TR> </p> <p> </TABLE> </p> <p><P>Текст после таблицы </p> <p></BODY> </p> <p></HTML> </p> <p>В приведенном примере дважды переопределяется размер шрифта, используемого по умолчанию. Изначально он равен 3 (по умолчанию). Затем устанавливается равным 2, далее - 4. Обратите внимание на отображение данного примера (рис. 1.7). Видно, что для таблиц назначение тега <BASEFONT> не действует. Это характерно для многих браузеров, хотя формально нарушает идею применения тэга. </p> <span> <br><img src='https://i2.wp.com/webnav.ru/books/html4/html_rules/07.gif' width="100%" loading=lazy loading=lazy></span> <p><i><b>Рис. 1.7. </b> Отображение примера С ТЭГОМ <BASEFONT> (браузером Netscape) </i> </p> <p><b> <span> Форматирование HTML-документа </span> </b></p> <p><b> <span> Разделение на абзацы </span> </b></p> <p>Любые тексты, будь то школьное сочинение, заметка в газете или техническое описание устройства имеют определенную структуру. Элементами такой структуры являются заголовки, подзаголовки, таблицы, абзацы и др. </p> <p>Одним из первых правил составления практически любых документов является разбиение его текста на отдельные абзацы, выражающие законченную мысль. HTML-документы не являются исключением из этого правила. При создании документов с помощью текстовых редакторов разбиение на абзацы выполняется вводом символа перевода строки. Большинство редакторов реализует это при нажатии клавиши <Enter>. В HTML-документах символы перевода строки не приводят к образованию нового абзаца. </p> <p>Язык HTML предполагает, что автор документа ничего не знает о компьютере своего читателя. Читатель вправе установить любой размер окна и пользоваться любым из имеющихся у него шрифтов. Это означает, что место переноса в строке определяется только программой просмотра и установками конечного пользователя. Поскольку символы перевода строки оригинального документа игнорируются, то текст, отлично смотревшийся в окне редактора автора документа, может превратиться в сплошной неудобочитаемый текст в окне программы просмотра. </p> <p>Избежать этой неприятности позволяет применение специального тега разделения на абзацы <P>Перед началом каждого абзаца текста следует поместить тег <P>Закрывающий тег </P> не обязателен. Браузеры обычно отделяют абзацы друг от друга пустой строкой. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Браузеры обычно интерпретируют несколько стоящих подряд тегов абзаца <P>Как один. То же самое относится и к тэгу перевода строки <BR>. Поэтому создать несколько пустых строк при помощи этих тегов не удается. </span> </i></p> <p>Тэг <P>Может задаваться с параметром горизонтального выравнивания ALIGN. Возможные значения параметра приведены в табл. 1.4. По умолчанию выполняется выравнивание по левому краю. </p> <p><i> <span><b>Таблица 1.4. </b>Значения параметра ALIGN </span> </i></p> <table border="1" width="550"><tr><td width="185"> <p><b><span>Значение параметра ALIGN </span> </b></p> </td> <td width="355"> <p><b>Действие </b></p> </td> </tr><tr><td width="185" valign="top"> <p>LEFT </p> </td> <td width="355" valign="top"> <p>Выравнивание текста по левой границе окна браузера </p> </td> </tr><tr><td width="185" valign="top"> <p>CENTER </p> </td> <td width="355" valign="top"> <p>Выравнивание по центру окна браузера </p> </td> </tr><tr><td width="185" valign="top"> <p>RIGHT </p> </td> <td width="355" valign="top"> <p>Выравнивание по правой границе окна браузера </p> </td> </tr><tr><td width="185" valign="top"> <p>JUSTIFY </p> </td> <td width="355" valign="top"> <p>Выравнивание по ширине (по двум сторонам) </p> </td> </tr></table><p>Заметим, что выравнивание по ширине (ALIGN = JUSTIFY) долгое время не поддерживалось браузерами. Во многих описаниях языка HTML для значений параметра выравнивания указывается только три варианта (LEFT, CENTER и RIGHT). В настоящее время все популярные браузеры умеют выполнять выравнивание по ширине. Некоторые проблемы создания документов с выравниванием по ширине рассмотрены также в главе 8. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Отсутствие выравнивания по ширине в настоящее время кажется удивительным. Этот режим применяется очень часто для печатных изданий. Достаточно взять в руки любую газету или внимательно присмотреться к абзацам данной книги - все они выровнены по ширине. Однако для HTML-документов до последнего времени выравнивание по ширине не допускалось. Всего лишь пару лет назад ни один браузер не имел такого режима. Так, читатели, до сих пор использующие браузер Netscape версии 3.x, не смогут увидеть ровные строчки в документе. Можно попытаться предугадать, какие же еще возможности появятся в будущем у браузеров, сравнив возможности мощных текстовых редакторов и современных браузеров. Примером не реализованных пока возможностей может являться автоматическая расстановка переносов и пр. </span> </i></p> <p><b> Перевод строки </b></p> <p>При отображении текстовых документов в браузере место переноса строки в пределах абзаца определяется автоматически в зависимости от размера шрифтов и размера окна просмотра. Перенос строки может осуществляться только по символам-разделителям слов (например, пробелам). Иногда в документах требуется задать принудительный перевод строки, реализующийся независимо от параметров настроек браузера. Для этого служит тег принудительного перевода строки <BR>, который не имеет соответствующего закрывающего тэга. Включение тега <BR> в текст документа обеспечит размещение последующего текста с начала новой строки. Например, такой подход может использоваться для создания структур типа списков без использования специальных тегов разметки списка. Или, например, без данного тега не обойтись для отображения стихотворений и т. п. </p> <p>Приведем пример использования принудительного перевода строки (рис. 1.8): </p> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Использование принудительного перевода строки</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p>Над омраченным Петроградом<BR> </p> <p>Дышал ноябрь осенним хладом.<BR> </p> <p>Плеская шумною волной<BR> </p> <p>В края своей ограды стройной,<BR> </p> <p>Нева металась, как больной<BR> </p> <p>В своей постеле беспокойной. </p> <p> <p><CITE>А.С.Пушкин. Медный всадник</CITE> </p> <p></BODY> </p> <p></HTML> </p> <span> <br><img src='https://i1.wp.com/webnav.ru/books/html4/html_rules/08.gif' width="100%" loading=lazy loading=lazy></span> <p><i><b>Рис. 1.8. </b> Тег <BR> можно использовать для принудительного перевода строки </i> </p> <p>В отличие от тега абзаца <P>При использовании тега <BR> не будет образована пустая строка. </p> <p>Использование тега <BR> требует осторожности - возможна ситуация, когда браузер уже сделал перевод строки за одно-два слова до того, как встретил ваш тег <BR>. Это бывает в случае, если ширина окна программы просмотра читателя меньше, чем тот же параметр программы, с помощью которой вы тестировали ваш документ. При этом может получиться, что в строке посреди абзаца останется только одно слово, нарушая тем самым красоту компоновки документа. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>При использовании тега <BR> для разбивки текста, обтекающего изображения или таблицы, можно задавать параметр CLEAR, прекращающий обтекание текста. Об этом можно прочитать в главах 3 и 4. </span> </i></p> <p><b> Тэги <NOBR>u <WBR> </b></p> <p>Бывают ситуации, когда требуется выполнить операцию противоположного назначения - запретить перевод строки. Для этого существует тэг-контейнер <NOBR>. Текст, размеченный этим тэгом, будет гарантированно располагаться в одной строке, независимо от ее длины. Если при этом получающаяся строка будет выходить за пределы окна просмотра браузера, то появится горизонтальная полоса прокрутки. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Для обеспечения неразрывности текста, располагаемого в ячейках таблиц, существует специальный параметр NOWRAP тега <TD>. Об этом можно узнать в главе 4. </span> </i></p> <p>Размечая текст с помощью тега неразрывной строки <NOBR> можно получить очень длинные строки. Чтобы этого избежать, можно указать браузеру читателя место возможного перевода строки, что будет выполнено только при необходимости (так называемый "мягкий" перевод строки). Это можно осуществить, поставив в нужном месте текста тег <WBR> (Word BReak), который так же, как и тег <BR>, не нуждается в закрывающем тэге. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Тэг <WBR> вообще не поддерживается браузером Netscape. Браузер Microsoft Internet Explorer распознает этот тег только в тексте, размеченном тэгами <NOBR>. </span> </i></p> <p><b> <span> Заголовки внутри HTML-документа </span> </b></p> <p>Наряду с названием всего документа, на Web-странице могут использоваться заголовки для отдельных частей документа. Эти заголовки могут иметь шесть различных уровней (размеров) и представляют собой фрагменты текста, которые выделяются на экране при отображении страницы браузером. </p> <p>Для разметки заголовков используются теги <HI>, <H2>, <H3>, <H4>, <H5> и <H6>. Эти теги требуют соответствующего закрывающего тэга. Заголовок с номером 1 является самым крупным (заголовок верхнего уровня), а с номером 6 - самым мелким. Теги заголовка являются элементами уровня блока, поэтому с помощью них нельзя размечать отдельные слова текста для увеличения их размера. При использовании тегов заголовков осуществляется вставка пустой строки до и после заголовка, поэтому тегов абзаца или перевода строки здесь не требуется. </p> <p>Тэги заголовков могут задаваться с параметром горизонтального выравнивания ALIGN. Возможные значения параметра совпадают с параметрами выравнивания тега абзаца <P> (см. табл. 1.4). </p> <p>Пример использования заголовков разного уровня с различным выравниванием (рис. 1.9): </p> <p><HTML> </p> <p><HEAD> </p> <p><TITLE>Примеры заголовков</TITLE> </p> <p></HEAD> </p> <p><BODY> </p> <p><H1>Заголовок размера 1</H1> </p> <p><H2>Заголовок размера 2</H2> </p> <p><H3 ALIGN=CENTER>Заголовок размера 3</H3> </p> <p><H4 ALIGN=RIGHT>Заголовок размера 4</H4> </p> <p><H5>Заголовок размера 5</H5> </p> <p><H6>Заголовок размера 6</H6> </p> <p>Основной текст документа </p> <p></BODY> </p> <p></HTML> </p> <span> <br><img src='https://i2.wp.com/webnav.ru/books/html4/html_rules/09.gif' width="100%" loading=lazy loading=lazy></span> <p><i><b>Рис. 1.9. </b> Отображение заголовков различного размера </i> </p> <p><b> <span> Горизонтальные линии </span> </b></p> <p>Другим методом разделения документа на части является проведение горизонтальных линий. Они визуально подчеркивают законченность той или иной области страницы. Сейчас часто используют рельефную, вдавленную линию, чтобы обозначить "объемность" документа. </p> <p>Тэг <HR> позволяет провести рельефную горизонтальную линию в окне большинства программ просмотра. Этот тег не является контейнером, поэтому не требует закрывающего тэга. До и после линии автоматически вставляется пустая строка. Параметры тега <HR> представлены в табл. 1.5. </p> <p><i> <span><b>Таблица 1.5. </b> Параметры тега <HR> </span> </i></p> <p>Пример: </p> <p><HR ALIGN=CENTER WIDTH=50% NOSHADE> </p> <p>В этом примере задается горизонтальная линия, которая занимает половину ширину окна просмотра и располагается посередине окна. Заметим, что параметры выравнивания имеют смысл только тогда, когда линия занимает не всю ширину окна. </p> <p><i><b> Примечание </b> </i></p> <p><i> <span>Браузер Netscape не позволяет использовать параметр COLOR тега <HR>. </span> </i></p> <p>Использование предварительно отформатированного текста </p> <p>Как видно в приведенных выше разделах, для разбивки текста по абзацам и обеспечения принудительного перевода строки следует пользоваться специальными тэгами. Однако бывают случаи, когда в HTML-документ необходимо включить текст, уже имеющий форматирование, выполненное традиционным способом при помощи символов перевода строки, необходимого количества пробелов, символов табуляции и т. д. Для решения таких задач предусмотрен специальный тэг-контейнер <PRE>Определяющий предварительно форматированный (п реформатированный) текст. </p> <p>Текст, размеченный тэгом <PRE>Будет отображаться в таком виде, как он выглядит в обычном текстовом редакторе. Для отображения всегда будет использоваться моноширинный шрифт. При этом вы сможете в большей степени контролировать вывод документа программой просмотра, правда, за счет некоторой потери в гибкости. </p> <p>Одним из вариантов использования этого тега являются таблицы, построенные без применения специальных тегов разметки таблиц. Другим важным </p> <p>применением является вывод на экран больших блоков программного кода (Java, C++ и т. п.), не позволяющий браузеру переформатировать их. </p> <p>Текст внутри контейнера <PRE>Может содержать элементы форматирования уровня текста, кроме следующих: <IMG>, <OBJECT>, <APPLET>, <BIG>, <SMALL>, <SUB>, <SUP>, <FONT>, <BASEFONT>. Недопустимо внутри преформатированного текста задавать элементы форматирования уровня блока, например, теги заголовков. Тег абзаца по логике вещей также не должен встречаться внутри преформатированного текста, однако если встречается, то будет реализовывать переход на новую строку (без образования пустой). </p> <p><i> <b> Примечание </b> </i></p> <p><i> <span>Тэг <PRE>Имеет необязательный параметр WIDTH, назначение которого - указывать браузеру максимальную длину строки преформатированного текста. В зависимости от этого значения браузер мог бы подобрать нужный шрифт и/или отступ для оптимального отображения преформатированного текста. В качестве значения по умолчанию предлагалось использовать 80. Другими рекомендованными значениями являются 40 и 132. Заметим, что читателям, имеющим значительный опыт работы со средствами вычислительной техники, эти числа говорят о многом. На деле же современные браузеры игнорируют значение параметра WIDTH. </span> </i></p> <p>Существуют еще несколько тэгов, решающих близкую по смыслу задачу. К ним относятся теги <ХМР>, <PLAINTEXT>И <LISTING>.Все три упомянутых тега в спецификации HTML 4.0 отмечены как устаревшие. Это означает, что в будущих версиях браузеры прекратят их поддержку. Вместо этих тегов рекомендуется использовать тег <PRE>. </p> <p><b> Тэг<<span>DIV > </span> </b></p> <p>Тэг-контейнер <DIV> является элементом уровня блока, служащим для выделения фрагмента документа. Целью этого выделения является управление параметрами данного фрагмента, которое обычно выполняется с помощью назначения стилей. Приведем пример: </p> <p><DIV STYLE="color: green"> </p> <p>(Фрагмент документа) </p> <p></DIV> </p> <p>В этом примере фрагмент HTML-документа обрамляется тэгами <DIV> и </DIV> для задания некоторых его свойств. В данном случае все текстовые элементы выделенного фрагмента будут отображаться зеленым (green) цветом. Аналогом тега <DIV> уровня текста является элемент . </p> <p>Заметим, что непосредственное назначение стилевых свойств отдельного фрагмента так, как это сделано в примере, использовать не желательно в соответствии с концепцией разделения структуры документа и его представления. Следует использовать таблицы стилей, речь о которых пойдет во второй части книги. </p> <p><b> Тэг <CENTER> </b></p> <p>Тэг-контейнер <CENTER> предназначен для горизонтального выравнивания всех элементов посередине окна просмотра браузера. Он имеет уровень блока и его полезно использовать для центрирования таких элементов, как, например, таблиц, так как они не могут быть центрированы назначением </p> <p>ALIGN=CENTER тега <TABLE>. </p> <p>По существу тег <CENTER> является краткой формой следующей записи: <DIV ALIGN=CENTER>. Дальнейшее использование тега <CENTER> по причинам, отмеченным в предыдущем разделе, также нежелательно. </p> <p><b> <span> Включение комментариев в документ </span> </b></p> <p>В HTML-документ можно включать комментарии, которые не будут видны читателю. Они могут состоять из произвольного числа строк и должны начинаться тэгом <!-- и заканчиваться тэгом -->. Все, что заключено внутри этих тэгов, при просмотре страницы не будет отображаться на экране. </p> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> <div class="clear"></div> </div> </article> <div class='yarpp-related'> <section id="related_posts"> <div class="block-head"> <span>Больше информации по теме</span> <div class="stripe-line"></div> </div> <div class="post-listing"> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/6d530784f99ff60ef54e6ea282b18c93.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Отслеживание посылок по tracking number" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/sweden-post---nacionalnaya-pochta-shvecii-otslezhivanie-posylok-po/">Отслеживание посылок по tracking number</a></div> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/6e93681d4b4c58554ca85e500973548e.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Приложения для родительского контроля на андроид" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/roditelskii-kontrol-na-android-s-zashchitoi-udaleniya-prilozheniya-dlya/">Приложения для родительского контроля на андроид</a></div> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/0229028f98d687355052b922043805c5.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Какой фоторедактор для Андроид лучше и какой можно скачать бесплатно и легально?" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/luchshie-fotoredaktory-makiyazh-na-android-kakoi-fotoredaktor-dlya-android-luchshe/">Какой фоторедактор для Андроид лучше и какой можно скачать бесплатно и легально?</a></div> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/07a965cde5d8c692b50aa680350a3457.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Лучшие бесплатные фоторедакторы для компьютера" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/skachat-prilozhenie-dlya-fotografii-luchshie-besplatnye-fotoredaktory-dlya-kompyutera/">Лучшие бесплатные фоторедакторы для компьютера</a></div> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/f44aa07171ae4480896e118e30c44254.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Графические программы для андроид Наш Андроид Маркет – Ваш правильный выбор" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/luchshie-fotoredaktory-dlya-android-graficheskie-programmy-dlya-android-nash-android/">Графические программы для андроид Наш Андроид Маркет – Ваш правильный выбор</a></div> <div class="related-item"> <div class="post-thumbnail tie-appear replacemy" data="post_7839"> <img width="195" height="110" src="/uploads/d5a002118d59b07a11ab8355dde6f904.jpg" class="attachment-tie-related size-tie-related wp-post-image" alt="Обслуживание с помощью компьютера" / loading=lazy loading=lazy></div> <a class="post_7839" href="https://qzoreteam.ru/no/programma-sony-xperia-z3-svyaz-s-kompyuterom-obsluzhivanie-s-pomoshchyu/">Обслуживание с помощью компьютера</a></div> </div> </section> </div> <div id="comments"> <ol class="commentlist"> <div class='rreekk' rel='15'> <div id="smartrotator_ad_4" onclick="yaCounter40492595.reachGoal ('tizercommentbefore1'); return true;"></div> </div> </ol> <div class="clear"></div> <div id="respond" class="comment-respond"> </div> </div> </div> <aside id="sidebar"> <div class="theiaStickySidebar"> <div class="execphpwidget"> <div id="text-4" class="widget widget_text"> <div class="widget-top"> <span>Полезное</span> <div class="stripe-line"></div> </div> <div class="widget-container"> <div class="textwidget"> <style> .wpp-list li img { -webkit-border-radius: 65px; -moz-border-radius: 65px; border-radius: 65px; } .wpp-list li .post-views { display: block; margin-left: 70px; color: #828283; font-size: 12px; } .wpp-list li .post-views i { font-size: 13px; } .wpp-list li { line-height: 22px !important; } .replacemy { cursor: pointer; } } </style> <ul class="wpp-list"> <li> <div class="replacemy"><img src="/uploads/af72807776c7ef644bcaf87f6872025a.jpg" width="65" height="65" title="Vårblomster levende bakgrunnsbilde for Android" alt="Vårblomster levende bakgrunnsbilde for Android" class="wpp-thumbnail wpp_cached_thumb wpp_featured" / loading=lazy loading=lazy></div><a href="https://qzoreteam.ru/no/oboi-na-telefon-android-vesna-vertikalnye-vesennie-cvety/" class=""><br>Vårblomster levende bakgrunnsbilde for Android</a></li> <li> <div class="replacemy"><img src="/uploads/577c7b81c2712c7e92533d8fc2ddb5c0.jpg" width="65" height="65" title=""Barnemodus" i Xiaomi: hvordan komme ut av det For de minste - blokkering i applikasjonen" alt=""Barnemodus" i Xiaomi: hvordan komme ut av det For de minste - blokkering i applikasjonen" class="wpp-thumbnail wpp_cached_thumb wpp_featured" / loading=lazy loading=lazy></div><a href="https://qzoreteam.ru/no/poleznyi-rezhim-dlya-detei-i-ih-roditelei-detskii-rezhim-v-syaomi-kak-iz-nego-vyiti/" class=""><br>"Barnemodus" i Xiaomi: hvordan komme ut av det For de minste - blokkering i applikasjonen</a></li> <li> <div class="replacemy"><img src="/uploads/e1a8b83e4f57cc5e203a15d1f576e3ed.jpg" width="65" height="65" title="Vårblomster levende bakgrunnsbilde for Android Last ned friske blomster på smarttelefonen din" alt="Vårblomster levende bakgrunnsbilde for Android Last ned friske blomster på smarttelefonen din" class="wpp-thumbnail wpp_cached_thumb wpp_featured" / loading=lazy loading=lazy></div><a href="https://qzoreteam.ru/no/cvety-zhivye-oboi-vesennie-cvety-zhivye-oboi-dlya-android-skachat-na/" class=""><br>Vårblomster levende bakgrunnsbilde for Android Last ned friske blomster på smarttelefonen din</a></li> <li> <div class="replacemy"><img src="/uploads/1b31258831bd9344ce328a337a2da316.jpg" width="65" height="65" title="Last ned nyttår og jul levende bakgrunnsbilde for Android Animert bakgrunnsbilde for telefonen vinter" alt="Last ned nyttår og jul levende bakgrunnsbilde for Android Animert bakgrunnsbilde for telefonen vinter" class="wpp-thumbnail wpp_cached_thumb wpp_featured" / loading=lazy loading=lazy></div><a href="https://qzoreteam.ru/no/skachat-novogodnie-zhivye-oboi-na-android-skachat-novogodnie-i-rozhdestvenskie-zhivye-oboi-dlya-android/" class=""><br>Last ned nyttår og jul levende bakgrunnsbilde for Android Animert bakgrunnsbilde for telefonen vinter</a></li> <li> <div class="replacemy"><img src="/uploads/874007be3148f9d1311c0172a91b2e77.jpg" width="65" height="65" title="Mint - nyheter fra vkontakte" alt="Mint - nyheter fra vkontakte" class="wpp-thumbnail wpp_cached_thumb wpp_featured" / loading=lazy loading=lazy></div><a href="https://qzoreteam.ru/no/kak-otkryt-izbrannoe-myata-na-drugom-ustroistve-myata---novosti-iz/" class=""><br>Mint - nyheter fra vkontakte</a></li> </ul> </div> </div> </div> </div> </div> <div> </div> </aside> <div class="clear"></div> </div> <footer id="theme-footer"> <div id="footer-widget-area" class="wide-narrow-2c"><div id="footer-first" class="footer-widgets-box"><div id="text-2" class="footer-widget widget_text"><div class="footer-widget-top"></div><div class="footer-widget-container"><div class="textwidget"> <p>Alt om moderne teknologi. Feil. Spill. Sammenbrudd. Teknikk. Internett <p></p> </div></div></div></div><div id="footer-second" class="footer-widgets-box"><div id="text-3" class="footer-widget widget_text"> <div class="footer-widget-top"></div> <div class="footer-widget-container"> <div class="textwidget"><a href="https://qzoreteam.ru/no/sitemap.xml">kart over nettstedet</a></div> </div> </div><div id="text-7" class="footer-widget widget_text"><div class="footer-widget-top"></div><div class="footer-widget-container"><div class="textwidget"><br> <a href="">Tilbakemelding</a> </div></div></div></div></div><div class="clear"></div> </footer> <div class="clear"></div> <div class="footer-bottom"> <div class="container"> <div class="alignright"></div> <div class="alignleft">© Copyright 2017, https://qzoreteam.ru</div> <div class="clear"></div> </div> </div> </div> </div> </div> <div id="topcontrol" class="fa fa-angle-up" title="Gå til toppen av siden"></div> <div id="fb-root"></div> <script type="text/javascript"> jQuery(function($) { $(document).on("click", ".pseudo-link", function() { window.open($(this).data("uri")); }); }); </script> <script type='text/javascript'> /* */ var tocplus = { "smooth_scroll": "1", "visibility_show": "\u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c", "visibility_hide": "\u0441\u043a\u0440\u044b\u0442\u044c", "width": "310px" }; /* */ </script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/plugins/table-of-contents-plus/front.min.js'></script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/plugins/wp-polls/polls-js.js'></script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/plugins/wp-postratings/js/postratings-js.js'></script> <script type='text/javascript'> /* */ var tie = { "mobile_menu_active": "true", "mobile_menu_top": "", "lightbox_all": "", "lightbox_gallery": "", "woocommerce_lightbox": "", "lightbox_skin": "dark", "lightbox_thumb": "vertical", "lightbox_arrows": "true", "sticky_sidebar": "", "is_singular": "1", "SmothScroll": "true", "reading_indicator": "", "lang_no_results": "\u041d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043d\u0430\u0448\u043b\u043e\u0441\u044c", "lang_results_found": "\u041d\u0430\u0439\u0434\u0435\u043d\u043d\u044b\u0435 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b" }; /* */ </script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/themes/pochk/js/tie-scripts.js'></script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/themes/pochk/js/ilightbox.packed.js'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js'></script> <script type='text/javascript'> /* */ var gglcptch_pre = { "messages": { "in_progress": "\u041f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430, \u0434\u043e\u0436\u0434\u0438\u0442\u0435\u0441\u044c \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 Google reCAPTCHA.", "timeout": "\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c Google reCAPTCHA. \u041f\u0440\u043e\u0432\u0435\u0440\u044c\u0442\u0435 \u0412\u0430\u0448\u0435 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a \u0441\u0435\u0442\u0438 \u0418\u043d\u0442\u0435\u0440\u043d\u0435\u0442 \u0438 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u044d\u0442\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443." } }; /* */ </script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/plugins/google-captcha/js/pre-api-script.js'></script> <script type='text/javascript' data-cfasync="false" async="async" defer="defer" src='https://www.google.com/recaptcha/api.js?onload=gglcptch_onload_callback&#038;render=explicit'></script> <script type='text/javascript' src='https://qzoreteam.ru/wp-content/plugins/google-captcha/js/script.js'></script> <script type="text/javascript" src="https://qzoreteam.ru/wp-content/themes/pochk/my/my.js"></script> <script type="text/javascript" src="https://qzoreteam.ru/wp-content/themes/pochk/my/etimer.js"></script> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body> </html>