TDDD52 CSS. Färger. Färger 1/3/13
|
|
- Kristina Lundberg
- för 2 år sedan
- Visningar:
Transkript
1 Jag önskar göra det lä0are för användarna genom a0 markera vissa delar med en annan färg? HTML är bra, men det är inte så snyggt? TDDD52 - CSS CSS regler och selectors gör a0 jag kan styla min HTML precis som jag vill Jag skulle vilja a0 alla länkar blev oranga istället för blå? TDDD52 CSS Föreläsning 1 IntrodukMon Mll TDDD52 Internet, klient, server, IP- adress HTML grunder Validering Specialtecken SökmotorsopMmering HTML4, XHTML, HTML5 Föreläsning 2 Färger Enheter Boxmodell CSS Syntax för CSS SeparaMon av innehåll och presentamon Validering av CSS CSS3 På webben används s k additamv färgblandning Man blandar färgerna Röd, Grön och Blå (RGB) Hexadecimala A B C D E F # eller #000 = Svart #FFFFFF eller #FFF = Vit #FF0000 eller #F00 = Röd Färger Man kommer givetvis inte ihåg alla dessa färger, utan använder en lista eller program för a0 få fram den färg man vill ha. Kolla länkar för laboramon 2 för exempel på webbaserade verktyg för a0 hi0a färger. Färger 1
2 Boxmodell Boxmodell padding height Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitamon ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. height Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitamon ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. width width border Boxmodell border Boxmodell padding padding height Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitamon ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. height Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitamon ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. width width margin Den fakmska bredden är = width + padding + border + margin 2
3 HTML - Uppdatering HTML - Uppdatering class id Markera a0 elementet på något sä0 är vikmgt eller av en viss typ. HTML dokumentet får innehålla flera element med samma class värde. <div class= ingress >Detta är text</div> <a class= external href=... >External</a> Markera e0 unikt element i HTML koden. HTML dokumentet får bara innhålla e0 element med e0 visst id värde. <button id= send >Send</button> <a id= googlelink href=... >Google</a> <span> När jag vill markera något i en flytande text t ex a0 <span class= red >de6a ska vara rö6</span> men a0 texten annars ska flyta på... Används för a0 gruppera inline element i e0 dokument. Denna grupp kan man sedan ändra med CSS eller Javascript (senare föreläsning). <button class= image-button ></button> <div id= leftcontent >...</div> När jag vill markera något i en flytande text t ex a0 de0a ska vara rö0 men a0 texten annars ska flyta på... Element kan ha både class och id definierade HTML - Uppdatering CSS <div> Används för a0 gruppera block element i e0 dokument. Cascading Style Sheet E0 oerhört vikmgt och kranfullt verktyg för a0 få webbplatser användbara När jag vill gruppera block element <div class= green- border > <ul> <li>item 1</li1> <li>item 2</li1> <li>item 3</li1> <li>item 4</li1> </ul> </div> Man kan tänka a0 block element är radbrytande element. Item 1 Item 2 Item 3 Item 4 Hur innehåll skall presenteras Cascade tolkar vi som ärver och skriver över Regler som appliceras sist gäller de som är före Kan förändra färger, storlekar, placeringar etc Tolkas utav webbläsare, vilket kan leda Mll lite olika resultat beroende på val av läsare 3
4 CSS - Selector CSS - ProperMes En selector är e0 syntax som avgör vilka element som skall påverkas av vilka regler. Selector h1.ingress #sendbu0on div.ingress div h1 div.ingress h1 Förklaring En visst typ av element, t ex alla h1 element Alla element med a0ributet class sa0 Mll något värde, t ex class= ingress Elementet med e0 visst id, t ex id= sendbu0on Alla div element med class= ingress Nestlade selectorer, t ex alla h1 som ligger innum div Alla kombinamoner fungerar, de0a innebär a0 man väljer alla h1 taggar som ligger innum div taggar som har class= ingress En property avgör vilka egenskaper som skall ändras och value avgör vad den skall ändras Mll. Property color width border border- style Value RGB färgkod, sä0er texten i det valda elementet Mll denna färg. Sä0er bredden av e0 element, använder enheter som px, % etc value kan vara 5px solid red som ger en 5px tjock solid kant med röd färg Sä0er kanten Mll en annan typ, t ex do0ed, dashed, double, groove, ridge, solid etc Det finns en uppsjö olika property- value man kan använda. CSS - Exempel CSS Hover selector CSS a { color: #F00; div h1 { font- size: 12px; border: 1px solid #CCC; div.ingress { font- weight: bold; img { cursor: pointer; UCall Alla länkar blir nu röda istället för standard blå Alla h1 taggar som ligger nestlade under div taggar får en mindre font storlek och en grå kant Alla div taggar som har class=ingress får fet sml Alla bilder gör nu om muspekaren Mll en hand istället för vanlig pekare när man håller musen över bilden. a:hover { background-color: yellow; En unik selector som först applicerar sina regler när musen förs över elementet Kolla denna länk när ni använder :hover i era webbplatser, det finns några saker man måste tänka på h0p://w3schools.com/cssref/sel_hover.asp om man använder den i kombinamon med a elementet. 4
5 1/3/13 CSS Float & Clear Antag a0 vi har fyra div taggar ener varandra. När webbläsaren ser nästa div tagg kommer den a0 göra en radbrytning och sedan rendera hela div taggen. CSS Float & Clear Om vi på den blå div taggen sä0er float: le); så placeras den så långt Mll vänster som möjligt. Enerkommande element hamnar sedan direkt ener. Den röda div taggen har inte float, så den gröna hamnar på nästa rad. 5
6 CSS Float & Clear CSS Float & Clear DIV DIV DIV DIV Om vi även på den röda sä0er float: le); så kommer den gröna direkt ener. Kan även använda float: right; och clear: right; DIV DIV DIV DIV Om vi vill undvika a0 det nästkommande elementet hamnar direkt ener den röda, så sä0er vi clear: le); på det gröna elementet. A0 kunna sä0a float på element möjliggör a0 man kan skapa andra layouter. Med float kan vi placera element på andra sä0 än med ren HTML h0p://jigsaw.w3.org/css- validator/ Validering CSS Demo TDDD52 Som med HTML, är korrekt CSS nödvändig för a0 webbläsaren skall slippa gissa vad som menas med koden. Om man skriver stora stylehsheets är det smart a0 validera ona. En mänsklig validering som kollar a0 webbplatsen ser ut som det är tänkt på alla större webbläsare är foryarande nödvändig. CongratulaMons! No Error Found. 6
7 1/3/13 SeparaMon av innehåll och presentamon Enklare a0 skapa, underhålla och återanvända När man bygger dynamiska webbsidor är de0a oumbärligt Går a0 skapa olika design beroende på webbläsare HTML CSS CSS CSS Man kan skapa helt olika utseenden vid behov för samma HTML innehåll. Ti0a på: h0p://www.csszengarden.com/ 7
8 1/3/13 8
9 1/3/13 9
10 Länkat CSS i HTML dokument... <head> <link rel= stylesheet type= text/css href= style.css /> </head>... TDDD52 godkänd metod Inline <body> CSS i HTML dokument <div style= font-weight: bold; > This text will be bold </div> </body> Header style... <head> <style type= text/css > a { color: #F00; div.ingress { font-weight: bold; </style> </head>... De0a är ibland OK i andra sammanhang, men inte denna kurs. De0a är aldrig ok, inte i denna kurs och inte någon annan stans heller. Om ni får för er a0 göra såhär, tänk på hur det hade påverkat Zen Garden om de gjorde så. CSS3 LaboraMon 1 Steg 2 En ny standard för CSS Innehåller specifikamoner för rundade kanter, gradients, skuggor, roteringar etc. Endast nya webbläsare kan hantera dessa. Äldre webbläsare hanterar inte CSS3 I denna kurs använder vi inte CSS3, utan endast funkmoner från CSS2 CSS SeperaMon av innehåll och presentamon Krav på selectorer och regler som skall användas Krav på ändring av befintlig layout Vidareutveckla eran företagshemsida, ge den e0 bra och passande utseende och en ny layout genom a0 endast använda CSS 10
Du kan själv följa med i denna steg-för-steg guide i din texteditor.
Grundläggande HTML HTML Steg-för-steg Du kan själv följa med i denna steg-för-steg guide i din texteditor. doctype Linköpings universitet I textdokument som används på internet finns på första raden information
On-line produktion TDDC61
On-line produktion TDDC61 Hej! Jakob Bandelin jakob.bandelin@liu.se Kognitionsvetenskap, interaktionsdesign, webbdesign On-line produktion (GDK), Elektronisk publicering (MT), Webbprogrammering (SVP),
Nya samlade läroplaner
Nya samlade läroplaner Nya kursplaner Ämnesforum Samråd Samråd Samråd Samråd Samordnings grupp Ämnesarbets grupper Referensgrupper Kursplan Kursplan utkast Referensgrupper Remiss W E B B Kursplane -förslag
Objektorienterad Programkonstruktion. Föreläsning 8 30 nov 2015
Objektorienterad Programkonstruktion Föreläsning 8 30 nov 2015 Projektuppgift (LAB2) IM, skickar meddelanden mellan datorer En lite större labbuppgift, egen planering Basuppgift för E, välj till extrauppgifter
Chefer och Ledare grafisk manual
FÖRENINGEN FÖR CHEFER & LEDARE Chefer och Ledare grafisk manual Version 1.1 (121107) 2 GRAFISK PROFIL Föreningen för Chefer och Ledare Föreningen för Chefer och Ledare beslöt om att under våren/ sommaren
Kursplanerna i svenska och svenska som andraspråk Göteborg 18 oktober 2011
Kursplanerna i svenska och svenska som andraspråk Göteborg 18 oktober 2011 Bikupa Varför finns svenska och svenska som andraspråk som skolämnen? Utgångspunkter Samma språk Olika förutsättningar Rätten
GRAFISK Profil. inl4_lisen_a_grafisk_profil_me106a.indd 1 2015-05-17 10:29
GRAFISK Profil inl4_lisen_a_grafisk_profil_me106a.indd 1 2015-05-17 10:29 Logotyp Logotypen är grunden för min verksamhets identitet och dess syfte är att skapa en tydlig avsändare. Jag har arbetat fram
Grafisk manual version 2015-02-10
Grafisk manual version 2015-02-10 Innehåll 1. Inledning...3 2. Varumärkesfärger...4 2.1 Definitioner...4 3. Carriers logotyp...5 3.1 Logotypens uppbyggnad...5 3.2 Logotypens frizoner...6 3.3 Alternativa
våra grafiska riktlinjer
Grafisk manual för distrikt & föreningar våra grafiska riktlinjer 2014-12-11 Version 1.0 Innehåll Förord 3 1. Logotyp 1.1 Primär logotyp 4 1.2 Sekundär logotyp 5 1.3 Friyta och placering 6 1.4 Välj rätt
LGR 11 bygger på samma kunskapssyn och värdegrund som Lpo 94
LGR 11 bygger på samma kunskapssyn och värdegrund som Lpo 94 Kursplan Läroplan Kunskapskrav Bedömning Läroplan Den nya samlade läroplanen 1. Skolans värdegrund och uppdrag 2. Övergripande mål och riktlinjer
LGR 11 bygger påsamma kunskapssyn och värdegrund som Lpo94
LGR 11 bygger påsamma kunskapssyn och värdegrund som Lpo94 Kursplan Läroplan Kunskapskrav Bedömning Läroplan Den nya samlade läroplanen 1. Skolans värdegrund och uppdrag 2. Övergripande mål och riktlinjer
Att berätta med webb + En introduktion till HTML
Att berätta med webb + En introduktion till HTML Vad är en bra historia? Uppbyggnad En serie handlingar/händelser som tillsammans bildar en enhet Budskap Produkt Bra, användarvänlig, lättförståelig, etc.
GRAFISKA RIKTLINJER FÖR ÅRSMÖTEN AUGUSTI 2015
GRAFISKA RIKTLINJER FÖR ÅRSMÖTEN AUGUSTI 2015 INNEHÅLLSFÖRTECKNING INLEDNING Inledning 3 Bakgrund 4 Inspiration 5 Idé 6 Lokalavdelning och distrikt 7 Större idé 8 Samtliga logotyper 9 Grafiskt material
Planera smidiga utskick. Guide för planering av maskinsorterbara försändelser
Planera smidiga utskick Guide för planering av maskinsorterbara försändelser Väl planerat är hälften skickat Kom ihåg att beakta Postis krav på maskinell hantering när du planerar en försändelse, till
guide till centerpartiets nya profilering
guide till centerpartiets nya profilering ett hållbart val Varför finns Centerpartiet? För oss som är aktiva inom partiet är svaret förstås självklart. Men för många väljare är det tyvärr inte det. Inte
Arbetsintegrerande Kooperativ
Hedemora 2014 01 30 4 Arbetsintegrerande Kooperativ - Medlemsägda Företag som har som ändamål att skapa arbete för personer med svårigheter att ta sig in på arbetsmarknaden. - Självständiga och fristående
Grafisk manual Märke, typografi, färger Stockholm konst. stockholmkonst.se/grafisk-profil
Grafisk manual Märke, typografi, färger Stockholm konst stockholmkonst.se/grafisk-profil Stockholm konsts uppgift är att ge stadens invånare den allra bästa konsten. Vi tar hand om hela processen som leder
Kommunikativ plattform
Grafisk profil Kommunikativ plattform Vad är ett varumärke? Ett varumärke är summan av allt som ett företag eller en organisation är, gör och säger. Vansbro kommuns varumärke är resultatet av alla invånares
ScandiRec. Läs mer: Nya Volvo V90 Cross Country SID 23. ScandiRec.se - Skandinavisk Rekrytering Sverige
ANNONSBILAGA I DAGENS INDUSTRI FRÅN SCANDIREC Sid. 29 Rekrytering inom Chefspositioner, Ledare & Specialister - Sverige se - Skandinavisk Rekrytering Sverige Issu e I Ve r.ta b l oi d Sv e ri ge Rekrytering
INNEHÅLL 1. LOGOTYP 2.TYPSNITT 3. FÄRGER 1.1 KONCEPT 1.2 STORLEKAR 1.3 FÄRGSÄTTNING 1.4 FRIZON & PLACERING 1.5 EXEMPEL 1.
GRAFISK PROFIL INNEHÅLL 1. LOGOTYP 1.1 KONCEPT 1.2 STORLEKAR 1.3 FÄRGSÄTTNING 1.4 FRIZON & PLACERING 1.5 EXEMPEL 1.6 ANVÄNDNING 2.TYPSNITT 2.1 VAL AV TYPSNITT 2.2 TRYCK & EP 2.3 WEB 3. FÄRGER 3.1 PRIMÄR
Schildts & Söderströms LOGOTYP
Brand manual Schildts & Söderströms LOGOTYP SAFE AREA 8x x x LOGOTYPENS FÄRG VARIATIONER Logotypen används främst i en av dessa fyra varianter. Logotypens namndel är alltid svart eller negativ. Märket
Lektion 2 - CSS. CSS - Fortsätt så här
Lektion 2 - CSS I den här lektionen behandlas HTML och CSS. Det förutsätts att lektion 1 är gjord, eller att du har tillräckliga kunskaper i grundläggande HTML för att klara den här lektionen. CSS - Fortsätt
DESIGN HANDBOKEN. 15.09.28, Version 2
DESIGN HANDBOKEN 15.09.28, Version 2 INNEHÅLLSFÖRTECKNING Inledning... 3 Organisationsbeskrivning... 4 Färger... 5 Typografi... 6 Vår logotyp... 7 Visitkort... 8-9 Brevmallar... 10-11 Rapportmall... 12
FÖRSÄKRINGSBOLAGSDAGEN 2016
VÄLKOMMEN! FÖRSÄKRINGSBOLAGSDAGEN 2016 PLATS FÖR BILD, ANVÄND GÄRNA UTFALLANDE BILDER. Information /utrymning Toaletter Fika & lunch & bensträckare PROGRAM 09.00 Inledning - moderator Cecilia Uneram 09.30
Föreläsning 4. CSS Stilmallar för webben
Föreläsning 4 CSS Stilmallar för webben Innehåll 1. CSS, vad är det? 2. Repetition av HTML-element 3. CSS, hur, var, när? 4. CSS & arv? CSS Cascading Style Sheet Same, same, but different Samma innehåll
WINDOWSPROGRAMMERING LEKTION 2
WINDOWSPROGRAMMERING LEKTION 2 Mahmud Al Hakim mahmud@alhakim.se www.alhakim.se 1 GRID Grid är en rutnätslayout med rader och kolumner. 2 1 GRID DEFINIERA RADER
Sweden AB. Stilmall & presentation av grafisk profil
Stilmall & presentation av grafisk profil CMYK 0 / 0 / 0 / 0 RGB 255 / 255 / 255 HEX #FFFFFF HSV 0 / 0 / 0 Logotyp & färgschema En grafisk profil måste tydligt visa verksamhetens art och prägel. Logotypen
Förkunskaper: Tim Berners Lees vision webbläsarkriget W3C strukturtagg layout-tagg
CSS { } Anne Diedrichs Medieteknik Södertörns Högskola Förkunskaper: Tim Berners Lees vision webbläsarkriget W3C strukturtagg layout-tagg Kurslitteratur: Niederst Robbins, Learning
Seminarium Riktade hälsosamtal/ hälsoundersökningar. Digitaliseringsprocess
Seminarium Riktade hälsosamtal/ hälsoundersökningar Digitaliseringsprocess Digitala situationer En enhet med formfaktor som en platta skulle förmodligen verka minst påträngande under samtalet. Hem enhet
12/9/2010 REGLER WEBBPRODUKTION WEBBDESIGN CASCADING STYLE SHEETS CSS LOKALA STILMALLAR GLOBALA STILMALLAR. Selektor. Deklaration
REGLER Selektor Deklaration Body { font-family:verdana WEBBPRODUKTION WEBBDESIGN CASCADING STYLE SHEETS CSS Ulrik Söderström Ulrik.soderstrom@tfe.umu.se h1,h2 { font-color:red; font-size:10pt; Egenskap
GRAFISK MANUAL 6/2012
GRAFISK MANUAL 6/2012 2 Innehållsförteckning Innehållsförteckning 01 Baselement Svenska folkpartiets logotyp Vår logo: dimensioner och skyddsområde Logoversioner och minimistorlek Logons användning Applikationer
Grafisk manual - Kulturcentrum, Kulturskolan, Folkbiblioteket och Konsthallen
Grafisk manual - Kulturcentrum, Kulturskolan, Folkbiblioteket och Konsthallen Logotype Kulturcentrum Logotypen är ett återbruk. Min första tanke och det jag kommer ihåg från föregångaren Äntligen! är utropstecknet.
21/01/2016. Stilmallar. styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. recept.html frukt.html grönsaker.html
Stilmallar styra utseendet av webbplatsen DEL 1 Karin Fahlquist index.html recept.html frukt.html grönsaker.html 1 Samma kod olika utseende Olika exempel om layout: http://www.csszengarden.com/ Stilmallar
Luleå gymnasieskola. Rapportens namn. [Dokumentets underrubrik] Författare [Datum]
Luleå gymnasieskola Rapportens namn [Dokumentets underrubrik] Författare [Datum] Sammanfattning Sammanfattningen skall ge en översikt över rapportens viktigaste delar, och skapa ett intresse att läsa den.
AGENDA WINDOWS PRESENTATION FOUNDATION LEKTION 2. Mer om Kontroller. Mer om Paneler Grid Stack Panel Wrap Panel Dock Panel
WINDOWS PRESENTATION FOUNDATION LEKTION 2 Mahmud Al Hakim mahmud@alhakim.se www.alhakim.se COPYRIGHT 2015 MAHMUD AL HAKIM WWW.WEBACADEMY.SE 1 AGENDA Mer om Paneler Grid Stack Panel Wrap Panel Dock Panel
DESIGN. Juni 2016, Version 3
DESIGN HANDBOKEN Juni 2016, Version 3 INNEHÅLLSFÖRTECKNING Inledning... 3 Organisationsbeskrivning... 4 Färger... 5 Typografi... 6 Vår logotyp... 7 Visitkort... 8-9 Gemensam mailavsändare... 10 Brevmallar...
VÅR KAMPANJ. Kampanjhandledning
VÅR KAMPANJ Kampanjhandledning VÅRKAMPANJ 2010: RÄTTVISA OM KAMPANJEN I och med vårkampanjen smygstartar vi valrörelsen. Under våren kommer det att finnas ett stort behov av att höja vår profil och mobilisera
Näringslivsprogram 2020 bästa näringslivsklimatet
Näringslivsprogram 2020 bästa näringslivsklimatet En del av utvecklingsstrategin Vellinge.se 2015-01-09 2 (21) Innehåll SAMMANFATTNING... 3 INLEDNING... 4 NULÄGESANALYS... 5 Näringslivet... 5 Företagens
En stiligare portal Laboration 3
Laborationsanvisning En stiligare portal Laboration 3 Författare: Johan Leitet Version: 1 Datum: 2011-09-09 Inledning Vi har hittills koncentrerat oss på att strukturera upp vår information på ett så semantiskt
F07 Stilmallar Dagens agenda
F07 Stilmallar Dagens agenda CSS, Stilmallar Lokala, interna, externa Selektorer - Taggselektorer - Klasselektorer - ID-selektorer Egenskapsarv Pseudo-klasser och element Kombinatorer Specificitet Stilmallar
ORDLISTA WEBBDESIGN 100P
ORDLISTA WEBBDESIGN 100P HTML- TAGGAR M.M. (DE BLÅFÄRGADE ORDEN ÄR OLIKA ATTRIBUT SOM HÖR TILL DE OLIKA TAGGARNA.) HTML Står för Hyper Text Markup Language och är en uppsättning markeringskoder.
Inför prov 1 i webbdesign
Inför prov 1 i webbdesign Skapa ett grundläggande HTML-dokument sidtitel övriga instruktioner Grundläggande märken, samt hur de används startmärke
IKT - Plan. Centralskolan
IKT - Plan Centralskolan Kapitel 1 Vision och mål Om skolan Centralskolan är belägen i centrala Märsta. Skolan är en av de äldsta i kommunen och ska vid årsskiftet 2017-2018 flytta in i nybyggda lokaler.
Dagens pass. Lgr, Lpo??? Lgr 11 Läroplanens innehåll och struktur
Dagens pass Lgr 11 Läroplanens innehåll och struktur Annika Mindedal 150902 1. Lgr 11 - struktur och innehåll, ca 70 inkl. bensträckare (i lokalen) 2. Kursplanen i svenska ämnesfilmen, 18 Mer om kursplaner
Som man sår får man skörda...
Som man sår får man skörda... Grafiska anvisningar för Raps Egen identitet i den stora floran En upp till 1,5 meter hög ört med blågröna blad och gula blommor i toppställda klasar. Brassica napus, om man
Repetition. Hypertext. Internet HTTP. Server och klient Text försedd med länkar till andra texter. Många sammankopplade nät
Repetition Internet Hypertext Server och klient Föreläsning 2 HTTP HTML Internet Hypertext Många sammankopplade nät Text försedd med länkar till andra texter Gemensamma adresser T ex 10.10.0.1 Gemensamma
Unga Aktiesparares varumärke
VARUMÄRKE Varumärke 1:1 Unga Aktiesparares varumärke Unga Aktiesparares varumärke är företagets signatur och igenkänningstecken. Därför är det väldigt viktigt att det används på ett riktigt sätt. Varumärket
Grafiska regler för jubileumssymbolen
Grafiska regler för jubileumssymbolen Landskrona gör vågen År 2013 fyller Landskrona stad 600 år. För att skapa så positiv uppmärksamhet som möjligt både kring staden och själva jubileet har vi tagit fram
De naturorienterande ämnena i Lgr11 Göteborg 2011-11-29
De naturorienterande ämnena i Lgr11 Göteborg 2011-11-29 Den nya samlade läroplanen Skolans värdegrund och uppdrag Kursplaner Syfte Övergripande mål och riktlinjer Normer och värden Kunskaper Elevernas
För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara:
Hemsida CSS Introduktion till Cascading Style Sheets (CSS) Detta är en mycket kort genomgång av CSS med exempel på hur sådan kod ska läsas och hur den kan användas på IdrottOnline-sidor. Är man ute efter
Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011)
Laboration 1: Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011) Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet
Lorem ipsum dolor sit aut VISUELL PLATTFORM
VISUELL PLATTFORM Det finns många som vill dela storyn om Skåne. Med denna visuella plattform vill vi göra det lite enklare och roligare att kommunicera kring Skåne. Vår vision är att sätta Skåne på världskartan
GRAFISK PROFIL FÖR KUNGÄLVS KOMMUN
GRAFISK PROFIL FÖR KUNGÄLVS KOMMUN GRAFISK PROFIL FÖR KUNGÄLVS KOMMUN SID 2 Varför en grafisk profil? Den grafiska profilen är en del av varumärket Kungälvs Kommun. Mot bakgrund av den varumärkesplattform
/*formatering för html och body elementen - elementens höjd sträcker sig över hela webbläsarfönstrets höjd*/ html, body { height: 100%; }
/*CSS document*/ /* nollställer margin för alla element*/ * { margin: 0; /*formatering för html och body elementen - elementens höjd sträcker sig över hela webbläsarfönstrets höjd*/ html, body { height:
Labora&on 4 CSS och validering övningar/uppgi9er
Labora&on 4 CSS och validering övningar/uppgi9er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument och skapa en mapp för U2 Till övningarna i denna
Att styla webbsidor. Nivå. Uppgiften
Nivå 2 Att styla webbsidor All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club.
Valutec Grafisk manual. Grafisk manual
Grafisk manual 1 INNEHÅLLSFÖRTECKNING Logotyp...3 Färger...5 Typografi...6 Brevpapper...7 Mailsignatur...8 Fax...9 Kuvert...10 Powerpoint... 11 Varseljackor...12 2 LOGOTYP Grundversioner Version 1 är den
Receptfria Läkemedel Grafisk Manual
Receptfria Läkemedel Grafisk Manual VERSION 2.0 FEBRUARI 2016 Förord Sedan 2009 kan man köpa utvalda receptfria läkemedel i dagligvaruhandeln. Denna ökade tillgänglighet är naturligtvis en stor fördel
On-line produktion TDDC61
On-line produktion TDDC61 Förra veckan Kursupplägg HTML FTP Validering Laboration 1. Deadlines Laborationer: 12/10, kl 08 Lämna in efterhand ni blir färdiga Vi rättar inom 4 arbetsdagar Portfolio, tillfälle
HTML och CSS. Eric Elfving Institutionen för datavetenskap. 18 augusti 2015
. HTML och CSS Eric Elfving Institutionen för datavetenskap 18 augusti 2015 Översikt 2/17 Introduktion HTML Syntax Vanliga element CSS Syntax Selektorer Kombinera HTML och CSS Webserver Introduktion 3/17
CSS-övningar. 1. Grunder
CSS-övningar 1. Grunder CSS Testa stilmallar Klasser Elementen div och span Ärvda egenskaper Mer om typsnitt, marginaler och mått Textdekor Fristående CSS -fil Attributet style Prioritetsordning hos stilelement
F02 HTML. Föreläsning 2, HT2013 HTML. Kurser: Klientbaserad Webbutveckling 1DV435. Johan Leitet
Föreläsning 2, HT2013 HTML F02 HTML Kurser: Klientbaserad Webbutveckling 1DV435 Johan Leitet F02 HTML Dagens agenda doctype taggar, element, attribut, värden teckenkodning HTML/XHTML
Internet och WWW Laboration 3 VT10 Högskolan Dalarna Hans Rosendahl. Laboration 3 CSS del 2. 1 av 20
Laboration 3 CSS del 2 1 av 20 Vad kommer jag att lära mig på laboration 3? 1. Skriva en stilmall Boxegenskaper o border o margin o padding o width o float o clear Färger och bakgrundsbilder Positionering
Landstinget Kronobergs grafiska profil
Landstinget Kronobergs grafiska profil 1 2 Bilden av Landstinget Kronoberg Syftet med den grafiska profilen är att stärka vårt varumärke. Det ska inte vara något tvivel om vem som är avsändare och Landstinget
Cascading Style Sheets (CSS) An Introduction. Nayeb Maleki
Cascading Style Sheets (CSS) An Introduction Nayeb Maleki CSS CSS utvecklades under mitten av 90-talet för att kunna separera stilformatering och formateringsinformation från innehåll i HTML sidor. Fungerar
EXPO XTRA MARKNADSFÖRINGSYTOR OCH REKLAMPLATSER PÅ KISTAMÄSSAN
7-9 FEBRUARI 2017 EXPO XTRA MARKNADSFÖRINGSYTOR OCH REKLAMPLATSER PÅ KISTAMÄSSAN KISTAMÄSSAN - MÖJLIGHETERNAS ARENA På Kistamässan anstränger vi oss för att skapa bästa möjliga förutsättningar för det
Västervik Framåt. Grafisk profil 1.0
Västervik Framåt Grafisk profil 1.0 Logotype: Västervik Framåt Logotypen består av ordbilden Västervik Framåt där V och A tillsammans bildar två pilar som pekar mot varandra. Pilarna symboliserar kärnkompetens
Uppdaterad i november 2012. Grafisk manual
Uppdaterad i november 2012 Grafisk manual Innehåll 03 Avstamp 04 Logotyp 06 Kommunvapnet 07 Färger 08 Bildspråk 09 Särprofilering 10 Typografi 11 Kontorstryck 13 Faktablad 14 PowerPoint 15 Informationsmaterial
Krav på lösenordet? Inloggning i communityt Formulär för att registrera sig. ABFs community. Registrera dig som medlem i ABFs community
Formulär för att registrera sig Registrera Registrera dig som medlem i Det är gratis att bli medlem i. För att registrera dig måste du fylla i formuläret nedan. Fält markerade med * är obligatoriska att
Laboration 2: Xhtml och CSS.
Laboration 2: Xhtml och CSS. Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet kommer att bli en webbplats med layout, bakgrundsbilder, minst en meny och
F10 Mer CSS Dagens agenda
F10 Mer CSS Dagens agenda Stila formulär CSS-genererat innehåll Mediatyper Utskrift Negativa marginaler Sprites Gridbaserade layouter Ramverk Formulär Prydliga formulär #cform { width: 500px;} #cform
Övning (X)HTML 2. Sidan 1 av 7 2010-11-11
Sidan 1 av 7 2010-11-11 Övning (X)HTML 2 Innan du börjar med laborationen ska du se till så att du har öppnat din editor (till exempel Notepad++). I denna editor ska du skriva (X)HTML-kod som du sedan
Grafisk profil RIKTLINJER OCH STÖD I VÅRT KOMMUNIKATIONSARBETE. osthammar.se
Grafisk profil RIKTLINJER OCH STÖD I VÅRT KOMMUNIKATIONSARBETE Tillsammans förmedlar vi bilden av Östhammars kommun Vårt varumärke Den bild vi förmedlar av oss själva är betydelsefull idag kanske mer än
Labora&on 6 CSS och responsiv webbdesign övningar/uppgi:er
Labora&on 6 CSS och responsiv webbdesign övningar/uppgi:er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument Till övningarna i denna labora&on
En grundkurs i hemsidor och hur de är uppbyggda
En grundkurs i hemsidor och hur de är uppbyggda Den här artikeln tänkte väldigt grundligt gå igenom koncepten kring en hemsida och hur den är uppbyggt, för att ge dig grundkunskap att bygga vidare på och
Webbteknik för ingenjörer
Institutionen för 2015-01-22 Tillämpad fysik och elektronik Karin Fahlquist Webbteknik för ingenjörer HTML5 & CSS laboration Målsättning Att skapa en webbplats utifrån en Lo-fi prototyp och implementera
Programmeringteknik. Planering 2014-05-12 MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen
MÅL Programmeringteknik Webbdelen Efter webbmomentet ska du: kunna använda ett tiotal kommandon i: HTML (göra webbsidor) CSS (webbsidans utseende) Javascript (programmering - klienten) PHP (programmering
BROMÖLLAKOMMUN VARUMÄRKET VARUMÄRKESMANUAL FÖR BROMÖLLA KOMMUN
VARUMÄRKET BROMÖLLAKOMMUN VARUMÄRKESMANUAL FÖR BROMÖLLA KOMMUN VARFÖR VARUMÄRKE? Bromölla kommun har en bred och omfattande verksamhet. Därför är det viktigt att kommunens organisation enkelt känns igen
Copyright Mahmud Al Hakim, mahmud@dynamicos.se, 2014. Copyright Mahmud Al Hakim, mahmud@dynamicos.se, 2014 NÅGRA EXEMPEL WWW.CSSZENGARDEN.
CSS CASCADING STYLE SHEETS GRUNDKURS Introduktion till stilmallar, CSS CSS står för Cascading Style Sheets CSS är ett språk som används för att få bättre kontroll över utseendet (formatering och layout)
Vår grafiska profil en viktig del i hur vi uppfattas.
1 2 Vår grafiska profil en viktig del i hur vi uppfattas. Vår framtoning är egentligen inte bara en grafisk fråga. Det är främst resultatet av det dagliga och konsekventa arbete som vi alla lägger ned
WWW.ME-FA.SE. Vi ger 12 års garanti mot genomrostning på alla modeller. MEFA har funnits sedan 1969 och naturligtvis är det inte utan stolthet som vi
MEFA har funnits sedan 1969 och naturligtvis är det inte utan stolthet som vi idag kan skryta med att vara ledande på marknaden och till och med störst i Norden. ME-FA designar och tillverkar postlådor
Frågor och svar om vårdval/hälsoval
Frågor och svar om vårdval/hälsoval För att det ska vara lättare att förstå hur Hälsoval Kalmar län fungerar har vi här samlat vanliga frågor och svar. Är det något du ändå undrar över är du välkommen
Receptfria Läkemedel Grafisk Manual
Receptfria Läkemedel Grafisk Manual VERSION 2.0 NOVEMBER 2014 Förord Sedan 2009 kan man köpa utvalda receptfria läkemedel i dagligvaruhandeln. Denna ökade tillgänglighet är naturligtvis en stor fördel
CSS-WORKSHOP. Nätverksträff för it-bibliotekarier, 7 mars 2013 Sara Britta Jadelius Trollhättans Stadsbibliotek
CSS-WORKSHOP Nätverksträff för it-bibliotekarier, 7 mars 2013 Sara Britta Jadelius Trollhättans Stadsbibliotek sarabritta.jadelius@trollhattan.se 0520-49 76 65 HTML strukturerar innehåll det här är
Labora&on 8 Formulär övningar/uppgi6er
Labora&on 8 Formulär övningar/uppgi6er 1M321 Webbteknik 1, 7,5hp Medieteknik 2015 Rune Körnefors rune.kornefors@lnu.se 1a. Ladda ner arbetsdokument Till övningarna i denna labora&on finns det en par dokument
Tillämpad fysik och elektronik Per Kvarnbrink m.fl. Laboration 2: HTML och CSS.
Laboration 2: HTML och CSS. Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet kommer att bli en enkel webbplats med layout, bakgrundsbilder, minst en meny
Grafiskt profilprogram för Rättviks kommun 2014-02-03 1 2014-02-03
Grafiskt profilprogram för Rättviks kommun 1 2 Innehållsförteckning Kommunstyrelsens beslut och delegationsbeslut 4 Tydlighet, enhetlighet och trovärdighet Annette Riesbeck, kommunalråd 5 Logotyp och kommunvapen
Grafisk manual för Karlskoga kommun
Grafisk manual för Karlskoga kommun Grafisk manual för Grafisk Karlskoga manual kommun för Karlskoga Innehåll kommun 2 Därför har vi en grafisk profil Karlskoga kommuns grafiska profil är en del av vårt
Logotyp. Norra Skogsägarnas logotyp är den främsta identitetsbäraren för föreningen. Grundform. Logotypen finns i fyra varianter: Tillåtna varianter
2 Logotyp Logotyp Norra Skogsägarnas logotyp är den främsta identitetsbäraren för föreningen. Den här delen får inte förändras Symboldel Textdel Logosymbol i cmyk, ( 3-färger; 100 % cyan, 10 % magenta
Struktur & Layout med CSS
1ME321 Webbteknik 1 Lek0on 5 Struktur & Layout med CSS Rune Körnefors Medieteknik 1 2015 Rune Körnefors rune.kornefors@lnu.se Agenda Veckoplanen Vecka 40 Läsanvisningar Exemplet Gretas Blommor GarreKs
F13 HTML5 Dagens agenda
F13 HTML5 Dagens agenda HTML5 Struktur Outline Nya element APIr Microdata/RDF/Microformats WHAT Working Group? Initiativ, 2004, startat av Apple, Mozilla och Opera WHATWG adapterades 2007 av W3C och rekommendationen
E07 "Greased Lightning"
E07 "Greased Lightning" Föreläsning 7, HT2014 CSS och Event Kurs: 1dv403 Webbteknik I Johan Leitet E07 Greased Lightning Dagens agenda CSS-egenskaper Händelsestyrd programmering Händelsehanterare Typer
On-line produktion TDDC61
On-line produktion TDDC61 Förra veckan Kursupplägg HTML FTP Validering Laboration 1. Deadlines Laborationer: 14/10 Lämna in efterhand ni blir färdiga Vi rättar inom 5 arbetsdagar Portfolio, tillfälle 1:
Sidan kommer inte läggas upp någonstans utan du redovisar den för mig på något handledningstillfälle.
Lab1 - CV-sidan Du ska bygga en variant av en CV-sida i HTML och CSS. Sidan ska åtminstone innehålla en bild på dig, en klassisk tabell med utbildningar/erfarenheter, ditt favoritcitat, en eller flera
GRAFISK IDENTITETSMANUAL
Meeting place of the world GRAFISK IDENTITETSMANUAL 10 1 TUR Vikten av att ha rätt uttryck och tonalitet när man kommunicerar sitt budskap är omätbar. Alla dimensioner av kommunikation från TUR är en del
KUNSKAP UTVECKLING MÖJLIGHETER
GRAFISK MANUAL INTRODUKTION GRAFISK MANUAL KUNSKAP UTVECKLING MÖJLIGHETER Det här är vår grafiska manual en beskrivning av hur Hälsinglands Utbildningsförbund ska se ut för att signalera de värden vi vill
Labora&on 2 HTML och validering övningar/uppgi:er
Labora&on 2 HTML och validering övningar/uppgi:er 1M321 Webbteknik 1, 7,5hp Medieteknik 2016 Rune Körnefors rune.kornefors@lnu.se 1. Ladda ner arbetsdokument Till övningarna i denna labora&on finns det
Webbutveckling Laboration 1: HTML5 och CSS3.
Institutionen för 2015-11-30 Tillämpad fysik och elektronik Karin Fahlquist Webbutveckling Laboration 1: HTML5 och CSS3. Målsättning Att skapa en webbplats genom att först skapa en Lo-fi prototyp och sedan
Hur ser vårt. framtida Piteå ut? PLANSTRATEGI I N G S H A N D L U T S TÄ L L N I N G. Översiktsplan för Piteå. Översiktsplan för Piteå.
U T S TÄ L L N Hur ser vårt framtida Piteå ut? I N G S H A N D L Översiktsplan för Piteå I N G Förslag till PLANSTRATEGI Utställningshandling Översiktsplan för Piteå Där denna symbol förekommer finns mer
Nätet. Uppgiften. Nivå
Nivå 1 Nätet All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club. Uppgiften Har