CSS3

Fra HTX Arduino
Spring til navigation Spring til søgning

CSS3 kan det samme som CSS2 og CSS1, men i tilgift en del mere, som kan give et bedre og mere lækkert udseende på en webside ved hjælp af enkle midler. Specielt omkring afrunding af hjørner og skygger er der meget at hente.

CSS3 er endnu ikke W3C standard, men de fleste nyere browsere understøtter det alligevel mere eller mindre.

For en komplet oversigt over hvilke ting der understøttes af hvilke browsere, se W3Scools CSS3 Browsersupport.

For at lære CSS3 kan man inde på nemProgrammering.dk finde deres CSS3 kursus der giver en god indføring i emnet.

Anvendelse af CSS3

Der er ikke nogen forskel på at anvende CSS3 og almindelig CSS, så der henvises til CSS placering for en nærmere gennemgang.

Browser detektering

For at sikre af siden gør opmærksom på at den måske ikke understøtter den ønskede visning, så kan man bruge javaScript til at finde ud af hvilken browser og hvilken version man arbejder i.

Man kan selv skrive det, eller man kan anvende dette lille script til at tjekke med.

Det anvendes ved at man lægger det sammen med sin hovedside, og på hovedsiden skriver man:

<script type="text/javascript" src="css3-tjek.js"></script>

Scriptet tjekker for de mest gængse browsere, om de har en version der er tilstrækkelig til at vise CSS3 - dette er dog ingen garanti for at alt fungerer, da CSS3 implementeres gradvist i de forskellige browsere.

Webdesign
CSS Placering - Egenskaber - Class - ID - Height - Width - Centrering - Margin - Border - Padding - Boksmodellen - Position - Text - Font - Farver - Backgruond - Table - List-style - Selectors - CSS3 - Media - Dropdown
HTML <b> - <br> - <em> - <strong> - <i> - <cite> - <q> - <tt> - <code> - <samp> - <kbd> - <var> - <pre> - <sub> - <sup> - <h1> - <h6> - <p> - <br> - <li> - <ol> - <ul> - <a> - <a> på siden - <img> - <map> - <object> - <dd> - <dl> - <dt> - <hr> - <div> - <span> - <html> - HTML5 - <head> - <title> - <body> - <frame> - <frameset> - <iframe> - <style> - <table> - <td> - <tr> - <th> - <tbody> - <thead> - <tfoot> - <form> - <input> - <textarea> - <label> - <select> - <option> - Radio button - Checkbox - Dropdown - Input text - Input password - Submit knap - Billede - Embedding Youtube - Kommentarer - Omdirigere