SlideServe
Télécharger Obtenir Pro
Menu
Accueil Pro
Préférences
ApparenceLight Aide et commentaires
© SlideServe · v2026

CSS del 3

azana avatar
azana
11 diapositives · 276 Views · Sep 11, 2014

CSS del 3. Kvarnbrinkx2 2011-12-17. Medietyper. En XHTML-sida kan ha olika CSS-filer för olika medier! Definieras med attributet “media” i link-taggen, t.ex. ‘ media=”screen” ’ all, aural, braille, handheld, print, projection, screen, tty, tv. CSS-signaturer.

CSS del 3 - slide 1
01 / 11CSS del 3
1 / 17

Télécharger la présentation

CSS del 3
Une image / un lien ci-dessous est fourni (tel quel) pour télécharger la présentation

Politique de téléchargement : le contenu du site vous est fourni TEL QUEL pour votre information et votre usage personnel ; il ne peut être vendu, concédé sous licence ni partagé sur d’autres sites sans l’accord de son auteur.Le contenu vous est fourni TEL QUEL, pour votre information et votre usage personnel uniquement. Téléchargez la présentation en cliquant sur ce lien. Lors du téléchargement, si vous ne parvenez pas à télécharger une présentation, l’éditeur a peut-être supprimé le fichier de son serveur.Pendant le téléchargement, si vous ne parvenez pas à obtenir une présentation, le fichier a peut-être été supprimé par l’éditeur.

F I N

Plus de contenu associé

Transcription de la présentation

  1. CSS del 3 • Kvarnbrinkx2 • 2011-12-17

  2. Medietyper • En XHTML-sida kan ha olika CSS-filer för olika medier! • Definieras med attributet “media” i link-taggen, t.ex. ‘media=”screen”’ • all, aural, braille, handheld, print, projection, screen, tty, tv

  3. CSS-signaturer • En och samma CSS-fil kan definiera flera stilar (t.ex. alternativ bakgrund) • Kopplingen görs genom att sätta ett ID-värde på body-taggen • Bra om man t.ex. vill ha lite avvikande förstasida men utan att bolla med olika CSS-filer

  4. Menyer • Görs ofta som ul-li-listor • Stylas och det som är bra att kunna är detta:display: block; sätts på li eller a-taggenlist-style: none; sätts på ul-taggen

  5. Menyer • Bakgrundsbilder kan vara bra att ha, tex. på a-taggen:background: url(css-nav.gif) #fff bottom left repeat-x; (“shorthand”)

  6. Menyer • Bakgrundsbilder kan vara bra att ha, tex. på a-taggen:background: url(css-nav.gif) #fff bottom left repeat-x; (“shorthand”) • Styla upp li-taggen med float:left; • Jag skulle även styla upp a-taggen med float left.

  7. Menyer • Det som bestämmer om det är en horisontell eller vertikal meny blir då bredden och höjden på div:en som omsluter ul-li-listan.

  8. Menyer – lite lyx • Sliding doors. • Styr upp a-taggen:a:link, a:visited, a:hover, a:active • Flytta runt bakgrundsbilden som t.ex. Apple gör.

  9. Sliding doors • Ren CSS-lösning för snygga menyer • Fixar bakgrunden på menyflikar med varierande bredd • Ett grundkrav: Varje <li>-tagg måste innehålla en annan tagg (en meny med länkar uppfyller det kravet)

  10. Bilder • Tänk på semantiken! • Bakgrundsbilder hör till css:en • Innehållsbilder hör till html:sidan • Innehållsbilder måste he an alt-text

  11. Bakgrund/bakgr.bilder – vanlig css-kod • body {background-color:#b0c4de;} • #head {background-color:#b0c4de;} • background-image:url('img_tree.png');background-repeat:no-repeat;background-position:right top; • Shorthand: body {background:#ffffff url('img_tree.png') no-repeat right top;}