Video: How to link CSS to HTML 2024
Als je net als veel ontwerpers Dreamweaver gebruikt, vind je de onderstreep die automatisch wordt weergegeven onder alle gelinkte tekst in een webpagina waarschijnlijk niet leuk. Het is heel eenvoudig om die onderstreping te verwijderen en de kleur, het lettertype en de grootte van uw links te wijzigen met het dialoogvenster Pagina-eigenschappen van Dreamweaver. U kunt ook andere paginabrede instellingen wijzigen, zoals de achtergrondkleur en paginamarges, in het dialoogvenster Pagina-eigenschappen.
De eenvoudigste manier om al uw linkstijlen tegelijk te wijzigen, is door ze in het dialoogvenster Pagina-eigenschappen te wijzigen. Wanneer u deze optie gebruikt, maakt Dreamweaver automatisch de bijbehorende stijlen voor labelselectie en geeft deze weer in het deelvenster CSS-stijlen. Andere paginabrede instellingen in dit dialoogvenster werken op dezelfde manier en u kunt al deze opties bewerken met behulp van de CSS-hulpmiddelen.
Als u hyperlinks en andere stijlen wilt wijzigen via het dialoogvenster Pagina-eigenschappen, opent u een bestaande pagina of maakt u een nieuwe en voert u de volgende stappen uit:
-
Kies Wijzigen → Pagina-eigenschappen.
U kunt ook op de knop Pagina-eigenschappen in de eigenschappencontrole klikken. Het dialoogvenster Pagina-eigenschappen verschijnt.
-
Selecteer links van het dialoogvenster Pagina-eigenschappen de categorie Koppelingen (CSS).
-
Geef een lettertype en grootte op voor uw links.
Als u dezelfde lettergrootte en hetzelfde gezicht wilt gebruiken voor uw links als u gebruikt in de rest van de tekst op uw pagina, is het het beste om deze opties leeg te laten. Als u vervolgens de tekstinstellingen voor de pagina wijzigt, hoeft u niet te onthouden dat deze ook moeten worden gewijzigd voor uw links.
-
Geef kleuren op voor elke hyperlinkstatus door op de overeenkomende kleur te klikken en een kleur te selecteren in het dialoogvenster Kleur.
U kunt alle linkkleurinstellingen wijzigen. Als u geen linkkleur opgeeft, gebruikt de browser de standaardlinkkleur. Hier volgt een uitleg van elk van de vier koppelingsstatussen:
-
Koppelingskleur: De kleur waarin uw koppelingen worden weergegeven wanneer de pagina voor het eerst wordt geladen en de gekoppelde pagina nog niet door de browser is bezocht. De bijbehorende HTML-tag is.
-
Bezochte koppelingen: de kleur waarnaar uw links worden gewijzigd nadat een browser de gekoppelde pagina al heeft bekeken. De bijbehorende HTML-tag is.
-
Rollover-koppelingen: De kleur waarin een koppeling wordt gewijzigd wanneer een gebruiker een muisaanwijzer over een koppeling verplaatst. De bijbehorende HTML-tag is.
-
Actieve koppelingen: De kleur van een koppeling verandert in een gebruiker die actief op een koppeling klikt. De bijbehorende HTML-tag is.
-
-
Selecteer een stijl in de vervolgkeuzelijst Onderstreepstijl.
Standaard zijn links die worden weergegeven in een webbrowser onderstreept. Veel ontwerpers geven er de voorkeur aan om de onderstreping te verwijderen die automatisch verschijnt onder gekoppelde tekst door Never Underline te kiezen. U kunt bezoekers de visuele keu van de onderstreping geven, maar alleen wanneer ze met een cursor over een link gaan, kiest u dus de optie Alleen onderlijning bij override optie.
-
Klik op OK.
Het dialoogvenster Pagina-eigenschappen wordt gesloten, de stijlinstellingen worden automatisch toegepast op alle links op de pagina en de overeenkomende stijlen worden toegevoegd aan het deelvenster CSS-stijlen.
Als u koppelingsstijlen volledig wilt testen, bekijkt u een voorbeeld van uw pagina in een webbrowser of klikt u op de knop Liveweergave boven aan de werkruimte. Het is een goede gewoonte om koppelingsinstellingen in een browser te testen wanneer u wijzigingen aanbrengt zoals in de vorige oefening. Bekijk hoe uw links worden weergegeven.
Controleer bijvoorbeeld of de actieve en bezochte linkkleuren er goed uitzien tegen de achtergrondkleur van de pagina. Houd er rekening mee dat alle stijlen die u maakt met behulp van het dialoogvenster Pagina-eigenschappen van invloed zijn op alle links op uw pagina, tenzij u specifiek een andere stijl toepast op een individuele link die de geherdefinieerde tagstijl overschrijft.
Als u verschillende linkstijlen in verschillende delen van dezelfde pagina wilt gebruiken, kunt u samengestelde stijlen maken om verschillende linkstijlen te maken.
