Hoe maak je een DIV een CSS- Link maken

Terwijl HTML bepaalt de layout , CSS bepaalt het uiterlijk van webpagina Comstock / Comstock / Getty Images

DIV-tags definieert een rechthoekig gebied binnen HTML-pagina's.CSS (Cascading Style Sheets) zijn tekstbestanden die het ontwerp en het uiterlijk van de HTML-pagina's te controleren.Bijvoorbeeld, "& lt; a & gt;"tag, die wordt gebruikt om links te maken is een inline element, terwijl de DIV tag is een block-level element.Dus technisch DIV-tags kan niet binnen ankermarkeringen wonen.Echter, de oplossing is om het anker tag in de DIV-tag te plaatsen en strek de afmetingen van het anker-tag aan de grootte van de DIV-tag past.

instructies

  1. Open de HTML-bron en het bijgevoegde CSS-code-bestand van de webpagina in verschillende vensters en tabbladen van een eenvoudige HTML-of een teksteditor zoals Kladblok.

  2. Zoek de vereiste DIV binnen de HTML-code.Kennis te nemen van de gedefinieerde id en / of klassen voor het DIV element.

  3. Plaats een anker-tag (link) binnen de DIV-tag.

  4. Scan het CSS-bestand voor het deel dat stijlen de bijz

    ondere DIV tag.Gebruik de div id of klasse namen de code blok te vinden.

  5. Kopieer de CSS-code blok dat stijlen de bijzondere DIV en dupliceren van de code door het enkel onder de oorspronkelijke plakken.

  6. Plaats het enkel karakter "a" tussen de div id / klasse en de opening accolade binnen de gekopieerde code blok.Dit zal de gekopieerde CSS-code blok te vormen van styling het DIV element in styling het anker tag binnen het DIV element.

  7. Steek de CSS-code line "display: block;"in de nieuw aangemaakte code blok voor de anchor tag.

Tips & amp;Waarschuwingen

  • Anker-tags kunnen worden gestyled te verschijnen als block-level of lay-out elementen zoals DIV met "display: block;"code in CSS.Bijgevolg zijn niet noodzakelijk voor de DIV tag zijn indien het doel van de DIV alleen de koppelbare definiĆ«ren.
  • Logisch, DIV-elementen mogen niet worden gemaakt CSS koppelingen.Echter de ankermarkeringen binnen DIV elementen worden uitgerekt tot de verpakkingsgrootte element past.
  • Gebruik CSS grenzen in verschillende kleuren, voor zowel de DIV en het anker tag tijdens het testen.
  • Laat de code blok voor de DIV element leeg om redundante CSS-code in de bron te voorkomen.Maar zorg ervoor dat de juiste code binnen de code blok voor de anchor tag.
  • CSS-code lijnen eindigen met een puntkomma.Het weglaten van deze, behalve op de laatste regel van een code blok, zal leiden tot onverwachte fouten.
  • CSS-code blokken worden begrensd door accolades.Unclosed beugels of extra sluiten accolades mag niet alleen de specifieke code blok, maar ook de hele CSS-bestand in gevaar brengen.

Resources

  • WebKreation: Het maken van een DIV Link;JavaScript versus CSS?
331
0
1
Webontwikkeling