Ange CSS-egenskaper

Du kan definiera egenskaper för CSS-regler, till exempel textens typsnitt, bakgrundsbild och färg, mellanrum och layoutegenskaper samt utseendet på listelement. Skapa först en ny regel och ange sedan någon av följande egenskaper.

Här är en beskrivning av några CSS-typegenskaper som du kan ange.

Anger typsnittsfamiljen (eller serien med familjer) för formatet. I webbläsare visas text med det första typsnittet i den serie som har installerats på användarens dator. Om kompatibilitet med Internet Explorer krävs anger du ett Windows-teckensnitt först. Attributet för teckensnitt stöds i båda webbläsarna.

Anger Normal, Italic eller Oblique som typsnittsstil. Standardinställningen är Normal. Attributet för format stöds i båda webbläsarna.

Anger höjden på den rad där texten placeras. Den här inställningen kallas vanligen radavstånd. Välj Normal om du vill att radhöjden för teckenstorleken ska beräknas automatiskt eller ange ett exakt värde och välj en måttenhet. Attributet för radhöjd stöds i båda webbläsarna.

Lägger till en understrykning, överstrykning eller genomstrykning i texten, eller gör så att texten blinkar. Standardinställningen för normal text är None. Standardinställningen för länkar är Underline. När du anger länkinställningen till None kan du ta bort understrykningen från länkar genom att definiera en särskild klass. Attributet för dekoration stöds i båda webbläsarna.

Använder en specifik eller relativ grad av fetstil i typsnittet. Normal motsvarar 400 och fet motsvarar 700. Attributet för bredd stöds i båda webbläsarna.

Anger varianten kapitäler för text. I Dreamweaver visas det här attributet inte i dokumentfönstret. Attributet för variant stöds i Internet Explorer, men inte i Navigator.

Inleder varje ord i markeringen med versal eller anger texten till endast versaler eller endast gemener. Attributet för skiftläge stöds i båda webbläsarna.

Anger textfärgen. Attributet för färg stöds i båda webbläsarna.

Ange textens storlek. Du kan välja en specifik storlek genom att markera värdet och måttenheten eller så kan du välja en relativ storlek. Pixlar fungerar bra för att förhindra att texten förvrängs i webbläsaren. Attributet för storlek stöds i båda webbläsarna.

Definiera bakgrundsegenskaper i CSS-format

Du kan använda bakgrundsegenskaper i alla element på en webbsida. Till exempel kan du skapa ett format som lägger till en bakgrundsfärg eller bakgrundsbild i valfritt sidelement, exempelvis bakom text, i en tabell, på hela sidan och så vidare. Du kan även ange placeringen för en bakgrundsbild.

Här är en beskrivning av några CSS-bakgrundsegenskaper som du kan ange.

Anger bakgrundsbilden för elementet. Attributet för bakgrundsbild stöds i båda webbläsarna.

Anger om och hur bakgrundsbilden upprepas. Attributet för upprepning stöds i båda webbläsarna.

• No-repeat gör att bilden visas en gång i början av elementet.

• Repeat gör att bilden visas sida vid sida och över och under bakom elementet.

• Repeat‑x och repeat‑y gör att ett vågrätt respektive ett lodrätt band med bilder visas. Bilderna klipps av så att de får plats inom elementets gränser.

Obs! Använd egenskapen Repeat om du vill definiera om body-taggen och ange en bakgrundsbild som inte placeras sida vid sida eller upprepas.

Anger huruvida bakgrundsbilden har en fast ursprungsplacering eller skrollar med innehållet. Observera att alternativet Fixed kan behandlas som Scroll i en del webbläsare. Detta stöds i Internet Explorer, men inte i Netscape Navigator.

Ange den inledande placeringen av bakgrundsbilden i förhållande till elementet. Du kan använda detta när du vill centrera en bakgrundsbild till mitten av sidan, både lodrätt (Y) och vågrätt (X). Om egenskapen Attachment är Fixed förhåller sig placeringen till dokumentfönstret, inte elementet.

Anger bakgrundsfärgen för elementet. Attributet för bakgrundsfärg stöds i båda webbläsarna.

Definiera blockegenskaper i CSS-format

Du kan ange mellanrums- och justeringsinställningar för taggar och egenskaper.

Ökar eller minskar avståndet mellan bokstäver eller tecken. Om du vill minska avståndet mellan tecken anger du ett negativt värde, till exempel (‑4). Inställningarna för bokstavsavstånd åsidosätter inställningarna för justerad text. Attributet för bokstavsavstånd stöds i Internet Explorer 4 och senare samt i Netscape Navigator 6.

Anger hur stort indraget för den första textraden är. Ett negativt värde kan användas för att skapa ett negativt indrag, men hur det visas beror på webbläsaren. I Dreamweaver visas det här attributet endast i dokumentfönstret när taggen används för blocknivåelement. Attributet för textindrag stöds i båda webbläsarna.

Anger den lodräta justeringen för det element det används i. I Dreamweaver visas det här attributet endast i dokumentfönstret när det tillämpas på <img>-taggen.

Anger hur text justeras inom elementet. Attributet för textjustering stöds i båda webbläsarna.

Anger hur mellanrum inom elementet hanteras. Välj mellan tre alternativ: Med Normal komprimeras mellanrummet; Med Pre hanteras det som om texten var omgiven av pre-taggar (det vill säga att allt mellanrum respekteras, inklusive blanksteg, tabbar och vagnreturer); Med nowrap radbryts texten endast när en br-tagg påträffas. I Dreamweaver visas det här attributet inte i dokumentfönstret. Attributet whitespace stöds i Netscape Navigator och Internet Explorer 5.5.

Anger huruvida ett element visas och i så fall hur det visas. Ingen gör att visningen av det element som detta har angetts för inaktiveras.

Anger mellanrummet mellan ord. Om du vill ange ett specifikt värde väljer du Value på snabbmenyn och anger sedan ett numeriskt värde. I den andra snabbmenyn väljer du en måttenhet (pixel, punkter och så vidare).

Obs! Du kan ange negativa värden, men hur de visas beror på webbläsaren. I Dreamweaver visas det här attributet inte i dokumentfönstret.

Definiera rutegenskaper i CSS-format

Använd kategorin Ruta i dialogrutan CSS-regeldefinition när du vill ange inställningar för taggar och egenskaper som styr placeringen av element på sidan.

Du kan använda inställningar på enstaka sidor av ett element när du använder inställningar för utfyllnad och marginaler eller använda inställningen Samma för alla om du vill använda samma inställning på alla sidor av ett element.

Anger sidan som övriga element flödar runt det flytande elementet. Det flytande elementet är fixerat på den flytande sidan och övrigt innehåll flödar runt det på motsatt sida.

En högerflytande bild är till exempel fixerad till höger och innehåll som du lägger till vid ett senare tillfälle flödar till vänster om bilden.

Mer information finns på http://css-tricks.com/all-about-floats/

Anger sidorna på ett element som inte tillåter andra flytande element.

Anger mängden utrymme mellan innehållet i ett element och elementets kant (eller marginal om det inte finns någon kant). Avmarkera alternativet Same for all om du vill ange utfyllnaden för enstaka sidor av elementet.

Anger samma utfyllnadsegenskaper för överkanten, högerkanten, nederkanten och vänsterkanten av det element som alternativet används för.

Anger mängden utrymme mellan kanten på ett element (eller utfyllnaden om det inte finns någon kant) och ett annat element. I Dreamweaver visas det här attributet endast i dokumentfönstret när det används för blocknivåelement (stycken, rubriker, listor och så vidare). Avmarkera Same for all om du vill ange marginalen för enstaka sidor av elementet.

Anger bredd och höjd på elementet.

Definiera kantegenskaper i CSS-format

Använd kategorin Kant i dialogrutan CSS-regeldefinition när du vill ange inställningar som bredd, färg och format för kanterna kring element.

Anger tjockleken på elementets kant. Attributet Width stöds i båda webbläsarna. Avmarkera Same for all om du vill ange kantbredden för enstaka sidor av elementet.

Anger samma kantstilsegenskaper för överkanten, högerkanten, nederkanten och vänsterkanten av det element som alternativet används för.

Anger färgen på kanten. Du kan ange färgen för varje enskild sida, men hur detta visas beror på webbläsaren. Avmarkera Same for all om du vill ange kantfärgen för enstaka sidor av elementet.

Anger kantens stil. Stilens utseende beror på webbläsaren. Avmarkera Same for all om du vill ange kantstil för enstaka sidor av elementet.

Definiera listegenskaper i CSS-format

I kategorin Lista i dialogrutan CSS-regeldefinition anges listinställningar, som punktstorlek och punkttyp, för listtaggar.

Anger utseendet på punkter eller nummer. Typ stöds i båda webbläsarna.

Anger om text i listposter radbryts och dras in (utsida) eller om texten radbryts i vänstermarginalen (insida).

Gör att du kan ange en anpassad bild för punkter. Klicka på Bläddra (Windows) eller Välj (Macintosh) om du vill bläddra till en bild, eller ange bildens sökväg.

Definiera placeringsegenskaper i CSS-format

Formategenskaperna för placering anger hur innehåll relaterat till det markerade CSS-formatet placeras på sidan.

Om någon eller några av följande egenskaper inte är viktiga för formatet lämnar du dem tomma:

Anger hur det markerade elementet ska placeras i webbläsaren enligt följande:

• Absolute placerar innehållet med hjälp av de koordinater som anges i rutorna för Placement, i förhållande till närmaste absolut eller relativt positionerade överordnade. Om ingen absolut eller relativt positionerad överordnad finns, placeras innehållet i sidans övre, vänstra hörn.

• Relative placerar innehållsblocket med hjälp av de koordinater som anges i rutorna för Placement, i förhållande till blockets placering i dokumentets textflöde. Om ett element exempelvis ges en relativ placering och koordinater för över- och vänsterkant som båda anges till 20 px, flyttas elementet 20 px åt höger och 20 px nedåt från dess normala placering i flödet. Det går också att placera element relativt, med eller utan koordinater för över-, vänster-, höger- eller nederkanten, för att upprätta en kontext för absolut positionerade underordnade.

• Fixed placerar innehållet med hjälp av de koordinater som anges i rutorna för Placement, i förhållande till webbläsarens övre, vänstra hörn. Den här placeringen för innehållet förblir fast när användaren skrollar på sidan.

• Static placerar innehållet på dess plats i textflödet. Det här är standardplaceringen för alla HTML-element som går att placera.

Anger innehållets staplingsordning. Element med ett högre z-index visas över element med ett lägre z-index (eller utan z-index). Värdena kan vara positiva eller negativa. (Om innehållet är absolut positionerat är det lättare att ändra staplingsordningen med hjälp av panelen AP-element).

Anger vad som händer om innehållet i en behållare (till exempel DIV eller P) överskrider behållarens storlek. Dessa egenskaper styr utökningen enligt följande:

• Visible ökar behållarens storlek så att allt innehåll blir synligt. Behållaren utökas nedåt och åt höger.

• Hidden behåller behållarens storlek och klipper av allt innehåll som inte får plats. Inga rullningslister läggs till.

• Scroll lägger till rullningslister i behållaren oavsett om innehållet överskrider behållarens storlek eller inte. Genom att specifikt lägga till rullningslister undviker du den förvirring som kan uppstå när rullningslister visas och döljs i en dynamisk miljö. Det här alternativet visas inte i dokumentfönstret.

• Auto gör att rullningslister endast visas när behållarens innehåll överskrider gränserna. Det här alternativet visas inte i dokumentfönstret.

Anger den del av innehållet som är synlig. Om du anger ett urklippsområde kan du komma åt det via ett skriptspråk som JavaScript och redigera egenskaperna för att skapa specialeffekter som svep. De här svepen kan konfigureras med hjälp av funktionen Ändra egenskap.

Anger plats och storlek för innehållsblocket. Hur platsen tolkas i webbläsaren beror på inställningen för Typ. Storleksvärdena åsidosätts om innehållsblocket överskrider den angivna storleken.

Standardenhet för plats och storlek är pixel. Du kan också ange följande enheter: pc (pica), pt (punkter), in (tum), mm (millimeter), cm (centimeter), (ems), (exs) eller % (procentandel av värdet för överordnad). Förkortningarna måste följa värdet utan blanksteg, till exempel: 3mm.

Anger innehållets inledande visningstillstånd. Om du inte anger en synlighetsegenskap ärver innehållet som standard den överordnade taggens värde. Standardsynligheten för body-taggen är synlig. Markera något av följande synlighetsalternativ:

• Inherit ärver synlighetsegenskapen hos innehållets överordnade.

• Visible visar innehållet, oavsett värdet för den överordnade.

• Hidden döljer innehållet, oavsett värdet för den överordnade.

Definiera tilläggsegenskaper i CSS-format

Formategenskaper för tillägg inkluderar alternativ för filter, sidbrytningar och pekare.

Ändrar pekarbilden när pekaren befinner sig över det objekt som styrs av formatet. Markera det alternativ du vill ange på snabbmenyn. Det finns stöd för det här attributet i Internet Explorer 4.0 och senare samt i Netscape Navigator 6.

Använder specialeffekter i det objekt som styrs av formatet, inklusive oskärpa och invertering. Välj en effekt på snabbmenyn.

Framtvingar en sidbrytning vid utskrift, antingen före eller efter det objekt som styrs av formatet. Markera det alternativ du vill ange på snabbmenyn. Det här alternativet stöds inte i någon webbläsare av version 4.0, men kan komma att stödjas i senare versioner.