We hebben gekeken naar een voorbeeld van het maken van een eenvoudige pagina waarop commentaar werd gegeven op enkele html-tags, omdat het mij lijkt dat het beter is om eerst iets te laten zien met een voorbeeld en dan verder te gaan met een meer gedetailleerde beschrijving. Daarom werd het maken van een pagina besproken in de tweede les, en in meer detail in de derde.
Hieronder vindt u beschrijvingen van veelgebruikte HTML-tags die op bijna elke pagina van de site worden gebruikt. Geloof me, er zijn er al genoeg om een hele website te schrijven.
Lijst met HTML-tags 1. HTML-tag (voor paragrafen) - geeft een tekstparagraaf weer (staat stijl-, klasse- en id-attributen toe). De meest voorkomende tag, omdat er meestal tekst in wordt geplaatst (daar is deze echter voor gemaakt).HTML-code bijvoorbeeld:
Tekstparagraaf nummer één
En dit is nog een paragraaf
Tekstparagraaf nummer één
En dit is nog een paragraaf
U kunt ook een stijlparameter aan de tag toevoegen:
Deze verschillende waarden kunnen worden gebruikt om het uiterlijk van het lettertype te bewerken. U kunt over deze parameters lezen in een aparte les: stijlen in html en de eigenschap CSS-lettertype.
U kunt ook de attributen CLASS en ID opgeven. Bijvoorbeeld:
2. HTML-tag en (vetgedrukt)En - twee tags waarmee u het lettertype vetgedrukt kunt maken. Er is geen verschil tussen deze tags.
Laten we een voorbeeld geven. HTML-code:
vetgedrukte tekstConverteert naar het volgende op de pagina:
vetgedrukte tekst
U kunt ook de attributen CLASS en ID opgeven (zoals in het geval van Note
Deze tags hebben weinig invloed op de ranking van documenten in zoekmachines, dus je kunt ze beter niet doelloos gebruiken.
3. HTML-tag (cursief maken)- cursief lettertype (staat stijl-, klasse- en ID-parameters toe)
HTML-code bijvoorbeeld:
cursieve tekstConverteert naar het volgende op de pagina:
4. HTML-tag (onderstreepte tekst)- onderstreept lettertype (staat stijl-, klasse- en ID-parameters toe)
HTML-code bijvoorbeeld:
onderstreepte tekstConverteert naar het volgende op de pagina:
onderstreepte tekst
5. HTML-tag (een hyperlink maken)Creëert een link op de pagina (maakt stijl, klasse en andere parameters mogelijk).
HTML-code bijvoorbeeld:
tekst koppelenConverteert naar het volgende op de pagina:
Alle tagparameters en attributen wordt in een aparte les behandeld: html-tag.
6. HTML-tag (koppen in inhoud),..., - header-tags in de inhoud (staat de stijl, klasse, id-parameter toe). Bovendien geldt: hoe kleiner het getal, hoe groter het gewicht en de omvang (standaard) van de tekst in deze tags.
HTML-code bijvoorbeeld:
Richting h1De tag wordt gebruikt voor de titel van de pagina (en ook voor de titel)
Deze tags mogen alleen worden gebruikt voor het beoogde doel, d.w.z. alleen als het artikel een titel nodig heeft. Dit komt door het feit dat tags,... een grote invloed hebben op zoekmachines. Als u ze correct gebruikt, is de kans dat u in de bovenste regels van de zoekresultaten terechtkomt zeer groot.
7. HTML-tag (uitlijning)- lijnt de inhoud uit in het midden.
HTML-code bijvoorbeeld:
Deze tekst staat in het middenConverteert naar het volgende op de pagina:
Deze tekst staat in het midden
Opmerking- - voor tekst
- ... - voor alles (bijvoorbeeld een afbeelding)
- geeft het subscript-lettertype weer.
HTML-code bijvoorbeeld:
Platte tekst, interlineaire tekstConverteert naar het volgende op de pagina:
Platte tekst, interlineaire tekst
9. HTML-tag (superscripttekst)- geeft superscript-lettertype weer.
HTML-code bijvoorbeeld:
Platte tekst, superscripttekstConverteert naar het volgende op de pagina:
Platte tekst, superscripttekst
10. HTML-tag,, - geeft een lettertype weer dat één pixel groter/kleiner is dan de huidige grootte (toegestaan door de parameter style, class, id).
HTML-code bijvoorbeeld:
Normaal lettertype, dit lettertype is één pixel groterConverteert naar het volgende op de pagina:
Normaal lettertype, dit lettertype is één pixel groter
11. HTML-tag- (lijsten maken)
- En .
- eerste element van de lijst
- tweede element van de lijst
- eerste element van de lijst
- tweede element van de lijst
- lege elementen - , ,
, , , ,, ,
Wordt gebruikt om aanvullende informatie over de pagina op te slaan. Deze informatie wordt door browsers gebruikt om de pagina te verwerken en door zoekmachines om deze te indexeren. Er kunnen meerdere tags in een blok zitten, omdat ze, afhankelijk van de gebruikte attributen, verschillende informatie bevatten. Indicator van metingen in een bepaald bereik. Een sectie van een document met navigatielinks voor de site. Definieert een sectie die geen scripting ondersteunt. Container voor het insluiten van multimedia (bijvoorbeeld audio, video, Java-applets, ActiveX, PDF en Flash). U kunt ook een andere webpagina in het huidige HTML-document invoegen. De tag wordt gebruikt om de parameters van de plug-in door te geven. Bestelde genummerde lijst. De nummering kan numeriek of alfabetisch zijn. Een container met een titel voor een groep elementen. Specificeert een optie/optie om te selecteren in de vervolgkeuzelijst , of . Veld voor het weergeven van het resultaat van een berekening die is berekend met behulp van het script. Paragrafen in de tekst. Definieert parameters voor plug-ins die met het element zijn gebouwd. Een containerelement dat één element bevat en nul of meer elementen. Op zichzelf geeft het niets weer. Hiermee kan de browser de meest geschikte afbeelding selecteren.
Voert tekst uit zonder opmaak, waarbij spaties en teksteinden behouden blijven. Kan worden gebruikt om computercode, e-mailberichten, enz. weer te geven. Een indicator van de voltooiing van een taak van welke aard dan ook. Definieert een kort citaat. Container voor Oost-Aziatische symbolen en hun decodering. Definieert de geneste tekst als basiscomponent van de annotatie. Voegt een korte beschrijving toe boven of onder de tekens in het element, weergegeven in een kleiner lettertype. Markeert ingesloten tekst als aanvullende annotatie. Toont alternatieve tekst als de browser het element niet ondersteunt. Geeft tekst weer die niet actueel is, doorgestreept. Wordt gebruikt om tekst weer te geven die het resultaat weergeeft van het uitvoeren van programmacode of script, evenals systeemberichten. Weergegeven in monospace-lettertype. Wordt gebruikt om een script aan de clientzijde te definiëren (meestal JavaScript). Bevat scripttekst of verwijst naar een extern scriptbestand met behulp van het src-attribuut. Definieert een logisch gebied (sectie) van een pagina, meestal met een koptekst. Een bedieningselement waarmee u waarden uit een voorgestelde set kunt selecteren. Variantwaarden worden geplaatst in . Geeft tekst in een kleinere lettergrootte weer. Specificeert de locatie en het type van alternatieve mediabronnen voor de , , . Container voor inline-elementen. Kan worden gebruikt om tekstpassages op te maken, zoals het markeren van afzonderlijke woorden. Plaatst de nadruk in de tekst en markeert deze vetgedrukt. Inclusief insluitbare stijlbladen. Specificeert het schrijven van symbolen in subscript, bijvoorbeeld de elementindex in chemische formules. Creëert een zichtbare titel voor de tag. Weergegeven met een gevulde driehoek. Als u erop klikt, kunt u de titeldetails bekijken. Specificeert de superscript-spelling van tekens. Tag voor het maken van een tabel. Definieert de hoofdtekst van de tabel. Creëert een tabelcel. Wordt gebruikt om HTML-codefragmenten te declareren die door een script kunnen worden gekloond en in een document kunnen worden ingevoegd. De inhoud van een tag is geen onderliggend element. Creëert grote tekstinvoervelden. Definieert de tabelvoettekst. Creëert een tabelceltitel. Definieert de tabeltitel. Definieert datum/tijd. De titel van een HTML-document dat bovenaan de titelbalk van de browser verschijnt. Kan ook in de zoekresultaten verschijnen, dus hiermee moet rekening worden gehouden bij het opgeven van een titel. Creëert een tabelrij. Voegt ondertitels toe voor elementen en . Markeert een tekstpassage door te onderstrepen, zonder extra nadruk. Creëert een lijst met opsommingstekens. Markeert variabelen uit programma's door ze cursief weer te geven. Voegt videobestanden toe aan de pagina. Ondersteunt 3 videoformaten: MP4, WebM, Ogg. Geeft aan de browser aan waar een lange regel kan breken. De tag voor de lettergrootte in HTML is gewoon sub, sup en strong, waardoor op de een of andere manier de grootte van de letters verandert. Maar html biedt in dit opzicht heel weinig mogelijkheden. Er was natuurlijk een lettertype-tag, maar tegenwoordig is deze al lang achterhaald. Als je echt geïnteresseerd bent in hoe je de lettergrootte flexibeler kunt wijzigen, dan moet je je wenden tot de kracht van CSS.
CSS-eigenschap lettertypegrootteIn CSS kun je elke tekstgrootte instellen, en dit kan niet alleen in pixels, maar ook in andere maateenheden. Meestal wordt het ingesteld in pixels, maar het kan ook anders. Bijvoorbeeld procentueel. Het lettertype van het bovenliggende element wordt op 100% gesteld.
Als we bijvoorbeeld de tekstgrootte als percentage instellen op een alinea en deze in de body-tag ligt, dan is 100% gelijk aan de opgegeven grootte voor de body. Als een tag een lettertype heeft dat is ingesteld op 12 pixels, moet u het volgende schrijven om de alineagrootte in te stellen op 24 pixels:
p(lettergrootte: 200%)
p(lettergrootte: 200%)
Dit is als u percentages gebruikt. Een andere populaire relatieve waarde is em, oftewel de letterhoogte van het bovenliggende element. Het schrijven van relatieve waarden is beter, want als de tekstgrootte verandert, verandert alles proportioneel en wordt het goed weergegeven.
U kunt de grootte ook aanpassen met behulp van de grotere en kleinere trefwoorden, die de tekstgrootte respectievelijk groter of kleiner maken dan het bovenliggende element.
selector (lettergrootte: groter)
selector (lettergrootte: groter)
De tekst in een element met de gewenste selector wordt groter dan het bovenliggende element. Er bestaan HTML-groottetags, maar het wordt nog steeds niet aanbevolen om deze te gebruiken. Dit zijn de grote en kleine tags. Door er tekst in te plaatsen, kunnen de letters iets groter of kleiner zijn dan hun bovenliggende element. Maar tegenwoordig is het beter om CSS te gebruiken als je een waarde moet instellen.
Grootte van de belangrijkste elementen op een webpagina
Wat betreft het instellen van de afmetingen voor andere elementen, alles is hetzelfde: hiervoor moet je css gebruiken, geen html. Over het algemeen kun je attributen zoals breedte en hoogte in een tag instellen, maar dit is onhandig. En het allerbelangrijkste: het voldoet niet aan de normen die bepalen dat uiterlijk en structuur van elkaar gescheiden moeten worden, in aparte bestanden moeten worden geplaatst.
Om deze reden is het gebruikelijk om de CSS-eigenschappen breedte en hoogte te gebruiken om de breedte en hoogte van een element te bepalen.
img( breedte: 50px; hoogte: 50px )
< img width = "50" height = "50" > < ! -- такненужнопрописыватьширинуивысотудляэлемента-- >
HTML plaatst alleen blokken op een webpagina, maar het formaat van deze taal zelf staat niet toe dat het een handig hulpmiddel is voor het specificeren van waarden. Om een blok op de een of andere manier visueel te beïnvloeden, moet je het inlijsten met bepaalde openings- en sluitingstags, wat verre van handig is.
Om vandaag de dag het uiterlijk van elementen in te stellen, moet je CSS-regels gebruiken, want daar zijn ze voor ontworpen. Dat is alles voor vandaag, en vergeet niet om u te abonneren op blogupdates, zodat u veel nuttig materiaal over het bouwen van websites binnen handbereik heeft.
Basis-html-tags vormen de basis waarop vrijwel elke website/blog is gebouwd. Uit dit artikel leer je precies die 20% tags die je altijd nodig zult hebben.
Zoals in elke taal, en zelfs hier, is de Pareto-regel van 20/80 van toepassing (20% van de dingen is voor 80% belangrijk om het gewenste resultaat te bereiken), wat betekent dat het voldoende is om slechts 20% van de codes te kennen om met vertrouwen te bereiken uw doelen bij het bouwen van websites.
HTML is geen programmeertaal, omdat het een hypertext-opmaaktaal is, die voor zichzelf spreekt. Hiermee kunt u blokken op pagina's markeren voor correcte weergave, en tekst voor webpagina's markeren. Het wordt ook gebruikt om links van de ene pagina van de site naar de andere te maken. Alle links op internet worden gemaakt met behulp van het hypertekstgedeelte van de html-code.
- dit is de eenvoudigste taal! Als je besluit het te bestuderen, is het belangrijk om vanaf het begin te begrijpen dat er geen problemen in zitten. We kunnen met vertrouwen zeggen dat kinderen op school het veel moeilijker hebben in de computerwetenschappenlessen.
Dus laten we aan de slag gaan. Het is beter om codes in een notitieblok te schrijven, dat is opgenomen in de standaardprogramma's van het Windows-besturingssysteem, of in het gratis programma "Notepad + +".
Laten we eerst definiëren wat een tag is. Een tag is een cel van de HTML-taal zelf, waaruit deze doorgaans is opgebouwd. Met behulp van tags begrijpen browsers hoe tekst moet worden weergegeven en waar afbeeldingen moeten worden ingevoegd. Tags zijn de markup-elementen zelf.
HTML-tags voor het maken van een websiteframeworkTags kunnen worden gekoppeld of ontkoppeld. Gepaarde openen en sluiten, d.w.z. de sluitende bevatten een backslash “/”.
Het eerste dat in elk HTML-document moet staan bij het maken van een blogpagina is:
Wij raden aan
Wat is Windows-bitdiepte?
Er zijn verschillende eenvoudige manieren om de editie, versie, build en bitness van Windows 10 te achterhalen. Met release bedoelen we varianten van Windows 10, en dit...
Voert een lijst uit (accepteert stijl-, klasse- en id-parameters). Elk nieuw element wordt ertussen geschreven
HTML-code bijvoorbeeld:
Lijst:Converteert naar het volgende op de pagina:
Lijst:
HTML-code bijvoorbeeld:
| 1-regelig 1-element | 1e regel 2e element |
| 2-regelig 1-element | 2-regelig 2-element |
Converteert naar het volgende op de pagina:
Alle tagmogelijkheden
