Technologie internetowe Zofia Kruczkiewicz

Slides:



Advertisements
Podobne prezentacje
Tworzenie stron internetowych
Advertisements

SuperHost.pl td img {display: block;}
XHTML Podstawowe różnice.
Style CSS.
Style definiujące tabele
C++ wykład 6 ( ) Polimorfizm.
Kurs WWW – wykład 3 Paweł Rajba
Narzędzia internetowe Paweł Rajba
Wprowadzenie do HTML, CSS, JavaScript, PHP
Kurs języka HTML Mariusz Tomczyk.
PROJEKT STRONY WWW KW GOPŁO KRUSZWICA
Uniwersytet Mikołaja Kopernika Wydział Fizyki, Astronomii i Informatyki Stosowanej Podyplomowe Studium Programowania i Zastosowań Komputerów Paweł Abramczyk.
Wstawianie stylów CSS.
Sok z czerwonego buraka
Temat 7: Tekst.
Specjalizacja "Dziennikarstwo On-line„ HTML – XHTML Część 4 Prowadzący: Dariusz Jaruga
Specjalizacja "Dziennikarstwo On-line„ Arkusze stylów – CSS Część 5 Prowadzący: Dariusz Jaruga
Specjalizacja "Dziennikarstwo On-line„ HTML – XHTML część 3 Prowadzący: Dariusz Jaruga
Czcionki, tekst, odnośniki
Lekcja 1 Składnia języka XHTML
Temat 5: Pozycjonowanie elementów
Wprowadzenie do CSS Okiełznać style.
Część I. Grupowanie elementów  Elementy i są używane do grupowania i strukturyzowania dokumentu. Będziesz je często wykorzystywał wraz z atrybutami class.
Selektory. Selektor elementu Selektor {własciwość:wartość}
Aplikacje internetowe
Aplikacje internetowe Grafika na stronach WWW ciąg dalszy Atrybuty znacznika body.
Temat 3: Właściwości CSS
Struktura Dokumentu HTML tekst. Deklaracja dokumentu W każdym dokumencie HTML, na samym początku, powinna się pojawić deklaracja typu dokumentu (Document.
Treści multimedialne - kodowanie, przetwarzanie, prezentacjaOdtwarzanie treści multimedialnych Andrzej Majkowski informatyka +
Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.
Informatyka – szkoła gimnazjalna – Scholaris - © DC Edukacja Wprowadzenie do kaskadowych arkuszy stylów Informatyka.
Temat 4: Klasy i identyfikatory
Projektowanie Aplikacji Internetowych Artur Niewiarowski Wydział Fizyki, Matematyki i Informatyki Politechnika Krakowska.
XHTML Tworzenie stylów CSS Damian Urbańczyk. Zewnętrzny plik CSS Aby ułatwić sobie pracę ze stylami, najlepiej utworzyć osobny plik, w którym będą przechowywane.
CSS - Selektory. Selektory Selektorem można nazwoć dowolny element języka HTML, dla którego chcemy zdefiniować parametry formatowania. Wyróżniamy następujące.
4/3/2015Opracowała Ewa Barańska1 Formatowanie czcionki HTML.
C S S 1 Cascading Style Sheets HTML pozwala zarządzać strukturą dokumentu, STYLE mają nam służyć do jego upiększania Kaskadowe Arkusze Stylów.
HTML Hyper Text Markup Language komputerowe Esperanto cz. I historia, struktura dokumentu.
HTML HTML (ang. HyperText Markup Language, pol. hipertekstowy język znaczników) – język wykorzystywany do tworzenia stron internetowych HTML zdefiniowanie.
Temat 2: Składnia kaskadowych arkuszy stylów. Za zmianę wyglądu witryny w kaskadowych arkuszach stylów odpowiadają reguły stylów. Każda z reguł powiązana.
Technologie internetowe
Grafika komputerowa Dr inż. Piotr Gronek Wykład dla Studium Podyplomowego „Informatyka w Szkole”
I TY ZOSTAŃ WEBMASTEREM! CZĘŚĆ 2 – „STRUKTURA STRONY” STWORZYŁ GABRIEL ŚLAWSKI.
Kaskadowe arkusze stylów CSS. Reguła CSS – definiuje sposób formatowania elementów na stronie WWW Części składowe reguły CSS selektor{ właściwość: wartość;
XHTML + CSS Style definiujące tekst Damian Urbańczyk.
Wykład 4 Informatyka MPDI sem.3 HTML cd. Arkusze stylów - CSS.
MULTIMEDIALNY SCENARIUSZ ZAJĘĆ. Edukacja: Poziom: Temat: Czas realizacji: matematyczna klasa I liczymy do 8 1 godz. lekcyjna.
Wyższa Szkoła Informatyki i Zarządzania w Bielsku-Białej Wydział Informatyki Kierunek: Informatyka Specjalność: Systemy Informatyczne PRACA DYPLOMOWA INŻYNIERSKA.
Kaskadowe arkusze stylów CSS - Cascading Style Sheets.
Język HTML Justyna Rychel. Język HTML jest obecnie szeroko wykorzystywany do tworzenia stron internetowych. Skrót pochodzi od angielskiego „HyperText.
HTML + CSS = strony internetowe Krzysztof Geras. FAKTY I MITY Czym nie jest HTML: ● programem do tworzenia stron internetowych, ● interpreterem skryptów.
Bootstrap 3 Technologie Informacyjne Literatura:
HTML 5 Technologie Informacyjne Literatura:
Tworzenie stron internetowych
CSS 3 Technologie Informacyjne Literatura:
JavaScript.
<i>Tu wpisz tekst</i>
Domy Świata Ludzie mieszkają w różnych zakątkach naszej planety. W zależności od miejsca zamieszkania każdy dom jest inny.
Rekursje Tak jak w innych językach funkcje mogą odwoływać się same do siebie Możemy regulować głębokość przed stwierdzeniem błędu (MaxRecursion, $RecursionLimit,
Programowanie obiektowe
HTML HTML -HyperText Markup Language – hipertekstowy język znaczników, obecnie szeroko wykorzystywany do tworzenia stron internetowych.
Arkusz stylów CSS Cascading Style Sheet.
PODSTAWY TWORZENIA STRON WWW W HTML’u
Dobre praktyki w Django REST Framework
Podstawy języka HTML.
Jak dostosować witrynę internetową usługi Microsoft SharePoint Online
Damian Urbańczyk xHTML Tworzenie stylów CSS.
Podstawy informatyki Zygfryd Głowacz.
Dodatek – Technologie internetowe
Style definiujące tekst
Zapis prezentacji:

Technologie internetowe Zofia Kruczkiewicz Arkusze stylów – część 2 Technologie internetowe Zofia Kruczkiewicz

Dziedziczenie stylów – 1a – użycie kilku stylów w jednej deklaracji class <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8 "/> <title>Arkusze stylow</title> <style type="text/css"> .dziadek {color:green; letter-spacing: 0.3em} .ojciec {color: red} .syn {font-weight: bold; font-size:xx-large;} </style> </head> <body> <p class="dziadek"> dziadek </p> <p class="dziadek ojciec"> dziadek ojciec </p> <p class="dziadek ojciec syn"> dziadek ojciec syn </p> <p class="dziadek syn"> dziadek syn </p> <p class="ojciec syn"> ojciec syn </p> <p class="syn"> syn </p> <p class=" ojciec"> ojciec </p> </body> </html>

Kolejność podawanych klas nie wpływa na kolejność użytych stylów Kolejność podawanych klas nie wpływa na kolejność użytych stylów. Na kolejność użytych stylów decyduje kolejność definiowania stylów – ostatnia definicja ma najwyższy priorytet

Dziedziczenie stylów – 1b <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8 "/> <title>Arkusze stylow</title> <style type="text/css"> .dziadek {color:green; letter-spacing: 0.3em} .ojciec {color: red} .syn {font-weight: bold; font-size:xx-large;} </style> </head> <body> <p class="dziadek"> dziadek </p> <p class="ojciec dziadek"> ojciec dziadek</p> <p class="dziadek ojciec syn"> dziadek ojciec syn </p> <p class="dziadek syn"> dziadek syn </p> <p class="ojciec syn"> ojciec syn </p> <p class="syn"> syn </p> <p class=" ojciec"> ojciec </p> </body> </html>

Kolejność podawanych klas nie wpływa na kolejność użytych stylów Kolejność podawanych klas nie wpływa na kolejność użytych stylów. Na kolejność użytych stylów decyduje kolejność definiowania stylów – ostatnia definicja ma najwyższy priorytet

Dziedziczenie stylów – 2 – o kolejności stylów decyduje kolejność definiowania w arkuszu stylu <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8 "/> <title>Arkusze stylow</title> <style type="text/css"> .dziadek {color:green; letter-spacing: 0.3em} .ojciec {color: red} .syn {color:blue; font-weight: bold; font-size:xx-large;} </style> </head> <body> <p class="dziadek"> dziadek </p> <p class="dziadek ojciec"> dziadek ojciec </p> <p class="dziadek ojciec syn"> dziadek ojciec syn </p> <p class="dziadek syn"> dziadek syn </p> <p class="ojciec syn"> ojciec syn </p> <p class="syn"> syn </p> <p class=" ojciec"> ojciec </p> </body> </html>

Kolejność definiowanych klas wpływa na kolejność użytych stylów – ostatnia deklaracja anuluje poprzednią. Styl ojciec z kolorem czerwonym anuluje kolor zielony stylu dziadek Kolejność definiowanych klas wpływa na kolejność użytych stylów – ostatnia deklaracja anuluje poprzednią. Styl syn z kolorem niebieskim anuluje kolor zielony stylu dziadek oraz czerwony stylu ojciec

Style narzucone, domniemane, domyślne Styl narzucony - narzucony styl body Styl domyslny1 - zignorowany styl body Styl domyslny2 - zignorowany styl body Styl alternatywny1 - wybrany w przeglądarce Styl narzucony i styl przeglądarki - zignorowany styl alternatywny

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Arkusze stylów</title> <link rel="alternate stylesheet" title="alternatywny1" href="alternatywny1.css type="text/css"></link> <link rel="alternate stylesheet" title="alternatywny2" href="alternatywny2.css" type="text/css"></link> <link rel="stylesheet" title="domyslny1" href="domyslny1.css" type="text/css"></link> <link rel="stylesheet" title="domyslny2" href="domyslny2.css" type="text/css"></link> <link rel="stylesheet" href="narzucony.css" type="text/css"></link> </head> <body> <h1 class="body1">Styl body1 nagłówka</h1> <p class="box1"> Styl box1 akapitu.</p> <p class="box2"> Styl box2 akapitu.</p> <p class="box3"> Styl box3 akapitu.</p> <p class="box4"> Styl box4 akapitu.</p> <p class="box5"> Styl box5 akapitu.</p> </body> </html>