Frames die rond afbeeldingen of tekst zijn geplaatst, sieren de site en voegen variatie toe aan het ontwerp. Als je tabellen gebruikt om randen te maken, dan neemt de code voor elke rand te veel ruimte in beslag. In dit geval moet u ook de HTML-code voor elk frame herschrijven. Met CSS kunt u eenvoudig een rand van elke gewenste dikte en kleur maken door eenmaal een eenvoudige code te schrijven voor alle elementen die door deze rand worden omgeven. Met deze technologie kan, indien nodig, het type frames op de site in een paar minuten worden gewijzigd.
Het is nodig
- - een eigen website hebben;
- - weet wat CSS is en waar deze stijlen op de site zijn geschreven.
instructies:
Stap 1
Om een rand te maken, schrijft u eerst de volgende code in CSS:
ramka {}
Stap 2
Om de rand de gewenste grootte te geven, gebruikt u de parameter border-width, die de lijnbreedte in pixels instelt. Als de framelijn bijvoorbeeld 3 pixels breed moet zijn, ziet de invoer er als volgt uit:
ramka {grensbreedte: 3px;}
Stap 3
Definieer nu de stijl van de rand met behulp van de parameter border-style. Als u een rand wilt maken waarvan de zijkanten regelmatige ononderbroken lijnen zijn, plaats dan de volgende invoer in de code tussen de accolades - randstijl: vast.
Stap 4
Een gestippelde rand kan worden verkregen door deze als volgt te schrijven: border-style: gestippeld. Randstijl controleren: met streepjes krijgt u een onderbroken rand.
Stap 5
Je kunt van de rand een dubbele ononderbroken lijn maken als volgt: border-style: double. Gebruik border-style: groove of border-style: ridge om tekst of afbeeldingen in frames te kaderen met 3D-bijwerkingen. Het verschil tussen deze twee opties is dat in het eerste geval het frame uit ingesprongen lijnen bestaat, en in het tweede geval convexe.
Stap 6
Gebruik deze code: border-style: inset om het effect te creëren van een inzet met de rand van een site-element. Om de inhoud van de rand, samen met de rand, integendeel, convex te maken, schrijft u border-style: begin.
Stap 7
U kunt de gewenste kleur aan het frame toevoegen met behulp van de parameter border-color, die ook tussen de accolades wordt geplaatst. Als je de rand rood wilt maken, schrijf dan randkleur: rood, blauw - randkleur: blauw, oranje - randkleur: oranje.
Stap 8
De CSS-grenscode, inclusief alle opties, ziet er als volgt uit:
ramka {grensbreedte: 3px; randstijl: solide; randkleur: blauw;}
Stap 9
Schrijf nu in HTML dit:
Frame-inhoud In plaats van de zin "Frame-inhoud", voegt u de tekst of code van de gewenste afbeelding in.
Stap 10
U kunt dus een onbeperkt aantal elementen op de site ontwerpen. Om het uiterlijk van het frame te wijzigen, hoeft u alleen de CSS-code te wijzigen.
