Kodeeksempler i kategorien 'CSS' (46 totalt)

Denne artikkelen viser hvordan du designer en komplett nettside uten bruk av tabeller. Her brukes kun <DIV> tagger og CSS! Eksempelet viser en nettside bestående av en topp, en hovedside og en bunn. Siden vil alltid ha minimum 100% høyde uavhengig av innholdet på den, også om toppen eller bunnens høyde forandres! Ønsker du å komme igang med CSS design på en god måte er dette artikkelen for deg!  

Dette kodeeksempelet viser hvordan man kan skreddersy en textboks vhja css. Vi endrer på tykkelsen på rammen (border), farge på ramme og tekst, samt endrer størrelsen på teksten og avstanden mellom tekst og selve rammen på tekstboksen. Vi får en flott og skreddersydd textboks!  

Denne CSS koden viser hvordan du kan få innholdet av en DIV tag til å flyte utover containeren den ligger inne i. I eksempelet har vi et flashelement som skal ligge 20px til venstre for sin container, dvs at flashen vil flyte utenfor sin kolonne med -20px. Det som er spesielt viktig å legge merke til er bruken av "position" og "left".  

Denne koden gjør at containeren "content" aldri er mindre enn 500px høy, men samtidig vil den øke dersom innholdet i containeren overstiger 500px. Dette er nyttig å bruke hvis du feks skal lage en border-right som skal følge contaierens høyde, selv om den blir presset ut av innholdet inni containeren. OBS: "!important" forteller coden at dette elementet er viktig, og aldri må overskrives av andre elementer, derfor har vi også "height" 2 ganger!  

Dette kodeeksempelet viser hvordan man kan midtstille en webside både hotisontalt men også vertikalt ved bruk av CSS. Det er spesielt ofte et vanlig spørsmål hvordan man kan midtstile vertikalt uten bruk av tabeller. Vi viser deg hvor enkelt dette kan gjøres!  

Denne lille kodesnutten viser hvordan du kan lage en scroll rundt et innholdselement på en side. Greit om man ønsker å liste opp en del innhold, men ikke bruke for stor plass.  

Denne koden viser hvordan du kan lage rammeverkt uten bruk av tabeller, kun med CSS20. Container og DIV'er stikkord for denne artikkelen.  

Denne artikkelen viser med flere eksempler hvordan du sette opp layout på en webside ved hjelp av CSS i stedet for tabeller. Dette er en metode som tas mer og mer i bruk, både fordi websiden rendres hurtigere og fordi det gir en bedre kompabilitet med tanke på feks mobile enheter. Det henvises også til andre eksempler innenfor samme tema!  

Her er noen nyttige tips for god stylesheet / CSS bruk!  

Her er et lite eksempel på hvordan man enkelt kan gi en tabell en stiplet ramme i 2px tykkelse og med fargen #cccccc.