Style CSS definicja i wykorzystanie klasy
|
|
|
- Kajetan Andrzejewski
- 7 lat temu
- Przeglądów:
Transkrypt
1 ICT Wykład 2
2 Style CSS definicja i wykorzystanie klasy Plik style.css p {font-size: 44px;}.czerwony {background-color:#ff0000;} Plik index.html <HTML><HEAD><TITLE>Indeks: elementy</title> <LINK rel="stylesheet" href="style.css" type="text/css" /> </HEAD> <BODY> <P class="czerwony"> To jest tekst 1</P> <TABLE class="czerwony"> <TR><TD>AAA</TD></TR> </TABLE> </BODY></HTML>
3 Można też zawężać definicję klasy do pewnych typów znaczników p.czerwony {background-color:red;} tylko akapity klasy czerwony będą miały tylko akapity klasy czerwony b d miały czerwone tło
4 Znaczniki mogą należeć do wielu klas <HTML> <HEAD> <STYLE type="text/css">.szary{background-color:lightgrey;}.czerwony{color:red}.duzy{font-size:30px} </STYLE> </HEAD> <BODY style="margin: "> <P class="czerwony szary duzy">szare tło</p> <TABLE style="border:1px solid green"> <TR> <TD class="czerwony duzy"> tekst1</td><td> tekst</td><td> tekst </TD> </TR> <TR> <TD> tekst</td><td> tekst</td><td> tekst </TD> </TR> </TABLE> </BODY> </HTML>
5 Przypisanie cech znacznikom posiadającym identyfikatory <HTML> <HEAD> <TITLE> Moja strona testowa </TITLE> <STYLE type="text/css"> #szary {background-color:lightgrey;}.czerwony{color:red}.duzy{font-size:30px} </STYLE> </HEAD> <BODY style="margin: "> <P id="szary" class="czerwony duzy">szare tło</p> </BODY> </HTML>
6 Przykład skryptu HTML z arkuszem stylów <HTML> <HEAD> <TITLE> Moja strona </TITLE> <LINK rel="stylesheet" href="style.css" type="text/css" /> </HEAD> <BODY> <TABLE> <TR> <TD> AA </TD> <TD> AB </TD></TR> <TR> <TD> BA </TD> <TD> BB </TD> </TR> <TR> <TD id="inna"> CA </TD> <TD> CB </TD> </TR> </TABLE> <UL class="lista"> <LI> <A HREF=" </LI> <LI> <A HREF=" </LI> <LI> <A HREF=" </LI> </UL> </BODY> </HTML> plik style.css body{ background-color:yellow; font-size:30px} table{border:3px solid red;} #inna {background-color:orange}.lista {font-size:37px}
7 DOM model dokumentu HTML Dokument HTML składa się z obiektów (standardowych i utworzonych przez użytkownika). Głównym obiektem jest document, posiada strukturę drzewiastą składowych (obiektów wewnętrznychznaczników na stronie) tworzących tzw. DOM (Document Object Model). Wykorzystamy to używając języka Java Script do stworzenia pewnych funkcjonalności, mogących być użytecznymi dla portalu biznesowego
8 Przypomnienie węzeł tekstowy
9 Obiekt document Obiekt document zawiera informacje o bieżącej stronie i dostarcza wielu sposobów wyświetlania strony HTML. Składnia wykorzystania właściwości i metod: document.właściwość lub document.metoda( )
10 UWAGI Właściwości mogą być tekstem, obiektem, kolekcją obiektów. Właściwość może być kolekcją, do jej elementów mamy dostęp jak do tablicy (indeks zaczyna się od 0), np.: p=x.childnodes[4] p jest piątym obiektem podrzędnym obiektu x Metoda może zwracać kolekcje, do poszczególnych składowych mamy dostęp jak do tablicy (indeks zaczyna się od 0) x=document.getelementsbytagname("div")[0] x jest pierwszym obiektem typu DIV dokumentu html Liczbę elementów w kolekcji zawiera właściwość length. Jeśli właściwości są typu obiektowego to mają kolejne właściwości. Właściwościom nadajemy wartości, badamy je lub wypisujemy Metody (funkcje) wykonujemy w osobnej instrukcji.
11 Wybrane właściwości obiektu document Właściwość Opis document.linkcolor określa kolor odsyłaczy document.bgcolor określa kolor tła document.fgcolor określa kolor tekstu document.lastmodified zawiera datę i czas ostatniej modyfikacji dokumentu document.location zawiera bieżący adres URL dokumentu document.title zawiera zawartość znacznika <TITLE> document.body zawiera element (obiekt) body document.links zawiera kolekcję wszystkich hiperłączy w dokumencie kolekcja (TABLICA - zawiera właściwość length- liczba elementów kolekcji) document.title zawiera tytuł dokumentu document.url zawiera pełny URL dokumentu
12 Metody obiektu document styl "wielbłądzi" nazw wyprowadzenie na ekran document.write() document.writeln() dostęp do elementów document.getelementbyid("id") document.getelementsbytagname("znacznik") zwraca kolekcję elementów document.getelementsbyname("nazwa") kolekcja tworzenie nowego elementu document.createtextnode("tekst") document.createelement("znacznik")
13 <HTML><HEAD> <TITLE>TEST obiektu document</title></head> <BODY style="font-size:18px"> <P>Przykłady wykorzystania obiektu document</p> <P> Akapit na stronie</p> <A href=" <A href=" <PRE> <SCRIPT language="javascript"> //ustalanie właściwości dokumentu document.bgcolor="yellow"; document.linkcolor="red"; document.fgcolor="green"; //wyświetlanie właściwości document.writeln("data utworzenia:",document.lastmodified); document.writeln("url:",document.url); document.writeln("location:",document.location); document.writeln("tytuł:",document.title); document.writeln("linków jest:", document.links.length); //elementy kolekcji w pętli for (k=0;k<document.links.length;k++) document.writeln("link ",k,":",document.links[k]);//jak tablica (indeks) </SCRIPT> </PRE></BODY></HTML>
14 Wykorzystanie własnej funkcji do ustawienia właściwości <HTML><HEAD> <TITLE> Przykłady wykorzystania obiektu document</title> <SCRIPT language="javascript"> function czerwony() {document.bgcolor="red";} function zielony() {document.bgcolor="green";} </SCRIPT> </HEAD> <BODY style="font-size:18px"> <INPUT type="button" value="czerwone" onclick="czerwony()"> <INPUT type="button" value="zielone" onclick="zielony()"> </BODY></HTML>
15 .. albo inaczej jedna funkcja z argumentem <HTML><HEAD> <TITLE> Przykłady wykorzystania obiektu document</title> <SCRIPT language="javascript"> function setkolor(k) { } </SCRIPT> </HEAD> document.bgcolor=k; <BODY style="font-size:18px"> <INPUT type="button" value="czerwone" onclick="setkolor('red')"> <INPUT type="button" value="zielone" onclick="setkolor('green')"> </BODY></HTML> Uwaga: ' ' wewnątrz " "
16 Dostęp do elementów strony Tworzenie referencji do istniejącego elementu (obiektu) zmiennej reprezentującej element na stronie - najwygodniej wykonać instrukcją: var element = document.getelementbyid("identyfikator"); pobierz element dokumentu o pewnym id albo var element = document.getelementsbytagname("znacznikhtml"); pobierz wszystkie elementy dokumentu o pewnym znaczniku HTML to będzie kolekcja - TABLICA
17 Ważniejsze właściwości tak pobranego elementu: node(ang. węzeł) element.childnodes kolekcja węzłów dla elementu - zawiera atrybut length (liczba elementów kolekcji), każdy węzeł ma nodename, nodetype i jeśli węzeł tekstowy ma nodevalue element.style dostęp do ustawiania atrybutu style elementu element.attributes kolekcja atrybutów elementu - mają one właściwości: length liczba atrybutów [nr].name nazwa [nr].value wartość atrybutu element.innerhtml suma wartości węzłów tekstowych
18 Przykład1 mamy tak zagnieżdżające się znaczniki <HTML><HEAD></HEAD><BODY> <DIV id="d1" style="border:1px solid red; width:70%"> <DIV> AAAAAAAAAAAAA </DIV> <DIV> BBBBBBBBBBBBB </DIV> </DIV> 5 węzłów
19 <SCRIPT language="javascript"> var x=document.getelementbyid("d1") //pobierz element document.write("div d1 ma "+x.childnodes.length+" węzłów<br />") document.write("czyli: 1text 2DIV 3text 4DIV 5text<BR />") document.write("div childnodes[0] :",x.childnodes[0],"<br />") document.write("div childnodes[1] :",x.childnodes[1],"<br />") document.write("div childnodes[2] :",x.childnodes[2],"<br />") document.write("div childnodes[3] :",x.childnodes[3],"<br />") document.write("div childnodes[4] :",x.childnodes[4],"<br />") document.write("węzeł 0:<BR />") document.write("div childnodes[0].nodename :",x.childnodes[0].nodename, "<BR />") document.write("div childnodes[0].nodetype :",x.childnodes[0].nodetype, "<BR />") document.write("div childnodes[0].nodevalue :",x.childnodes[0].nodevalue, "<BR />") document.write("i inne...:<br />") document.write("węzeł 1:<BR />") document.write("div childnodes[1].nodetype :",x.childnodes[1].nodetype,"<br />") document.write("div childnodes[1].nodename :",x.childnodes[1].nodename,"<br />")
20 document.write("węzeł 2:<BR />") document.write("div childnodes[2].nodetype :",x.childnodes[2].nodetype,"<br />") document.write("div childnodes[2].nodename :",x.childnodes[2].nodename,"<br />") document.write("div childnodes[2].nodevalue :",x.childnodes[2].nodevalue,"<br />") document.write("węzeł 3:<BR />") document.write("div childnodes[3].nodetype :",x.childnodes[3].nodetype,"<br />") document.write("div childnodes[3].nodename :",x.childnodes[3].nodename,"<br />") document.write("węzeł 4:<BR />") document.write("div childnodes[4].nodetype :",x.childnodes[4].nodetype,"<br />") document.write("div childnodes[4].nodename :",x.childnodes[4].nodename,"<br />") document.write("div childnodes[4].nodevalue :",x.childnodes[0].nodevalue,"<br />")
21 document.write("można też tak:<br />") document.write("div childnodes.item(0) :",x.childnodes.item(0),"<br />") document.write("div childnodes.item(1) :",x.childnodes.item(1),"<br />") document.write("div childnodes.item(2) :",x.childnodes.item(2),"<br />") document.write("div childnodes.item(3) :",x.childnodes.item(3),"<br />") document.write("div childnodes.item(4) :",x.childnodes.item(4),"<br />") document.write("div childnodes[0]: ",x.childnodes[0],"<br />") document.write("div childnodes[1]: ",x.childnodes[1],"<br />") document.write("div childnodes[2]: ",x.childnodes[2],"<br />") document.write("div childnodes[3]: ",x.childnodes[3],"<br />") document.write("div childnodes[4]: ",x.childnodes[4],"<br />") pierwszy potomek document.write("div firstchild: ",x.firstchild,"<br />") document.write("div firstchild.nodevalue: ",x.firstchild.nodevalue,"<br /> /") document.write("div firstchild.nextsibling: ",x.firstchild.nextsibling,"<br />") document.write("atrybut 0 naszego DIV ma nazwę: ", x.attributes[0].name) document.write("<br /><BR /><B>InnerHTML:</B><BR />",x.innerhtml) </SCRIPT></BODY></HTML> następny brat (rodzeństwo)
22 lub pętla <DIV id="d1" style="border:1px solid red;width:70%"> <DIV class="z"> AAAAAAAAAAAAA </DIV> <DIV class="z"> BBBBBBBBBBBBB </DIV> </DIV> <SCRIPT language="javascript"> var x=document.getelementbyid("d1") //pobierz element document.write("div ma "+x.childnodes.length+" węzłów<br />") document.write("czyli: 1text 2DIV 3text 4DIV 5text<BR />") for (n=0;n< x.childnodes.length;n++) document.write("div childnodes[",n,"] :",x.childnodes[n],"<br />") </SCRIPT>
23 inny przykład <HTML><HEAD> <TITLE> Przykłady obiektowe</title> </HEAD> <BODY style="font-size:48px"> <DIV name="c1" style="color:red">a</div> <DIV name="c1" style="color:green">b</div> <DIV name="c1" style="color:blue">c</div> <HR /> <SCRIPT language="javascript"> document.write(document.getelementsbyname("c1").length,"<br />"); for (k=0; k<document.getelementsbyname("c1").length;k++){ document.write(document.getelementsbyname("c1")[0].innerhtml,"<br />"); } </SCRIPT> </BODY></HTML>
24 Atrybut style jest również obiektem, poniżej ważniejsze właściwości: Właściwość backgroundcolor border borderstyle bordercolor borderbottom borderbottomcolor borderbottomstyle borderbottomwidth borderleft bordertop borderright margin marginbottom marginleft marginright margintop color fontfamily fontsize fontstyle fontweight textalign Opis znaczenia ustalenie lub pobranie koloru tła elementu ustawienie (np. "1px solid red") lub pobranie cech obramowania ustawienie (np. "solid") lub pobranie stylu obramowania ustawienie (np. "red") lub pobranie koloru obramowania dolna krawędź obramowania j.w. dolna krawędź obramowania kolor np. "blue" dolna krawędź obramowania styl np. "dotted" dolna krawędź obramowania szerokość podobnie j.w. margines np. "12px 20mm 2 cm 20px" góra prawy dolny lewy j.w. ustawienie (np. "14px solid red") lub pobranie koloru czcionki ustawienie (np. "Arial") lub pobranie rodziny czcionki ustawienie (np. "15px") lub pobranie rozmiaru czcionki ustawienie (np. "italic") lub pobranie stylu czcionki ustawienie (np. "bold") lub pobranie grubości czcionki ustawienie (np. "center") lub pobranie wyrównania tekstu
25 Zmiana stylu znacznika <HTML><HEAD> <TITLE> Przykłady obiektowe</title></head> <BODY style="font-size:18px"> <TABLE style="border:1px solid red;font-size:25px"> <TR><TD>a1</TD> <TD>a2</TD><TD>a3</TD></TR> <TR><TD>b1</TD> <TD>b2</TD><TD>b3</TD></TR> </TABLE> <SCRIPT language="javascript"> x=document.getelementsbytagname("td") //pobierz elementy wg znacznika! x[0].style.border="6px solid red"; x[1].style.backgroundcolor="blue"; document.write(x[1].style.backgroundcolor); </SCRIPT> </BODY></HTML>
26 Interakcyjna zmiana stylu znacznika <HTML><HEAD> <TITLE> Przykłady obiektowe</title> <SCRIPT language="javascript"> function setramka(n, kolor){ var x=document.getelementsbytagname("td") //pobierz elementy TD! x[n].style.border="3px solid "+kolor } </SCRIPT> uwaga na spację po solid </HEAD> <BODY style="font-size:18px"> <TABLE style="border:1px solid red"> <TR><TD>a1</TD> <TD>a2</TD><TD>a3</TD></TR> <TR><TD>b1</TD> <TD>b2</TD><TD>b3</TD></TR> </TABLE> Wpisz numer od 1 do 6<INPUT type="text" id="pole"> <INPUT type="button" value="ustaw kolor" onclick="setramka(pole.value-1, 'red')"> </BODY></HTML>
27 Proste sterowanie położeniem przez cechę margin <HTML><HEAD> <TITLE> Przykłady obiektowe</title> <SCRIPT language="javascript"> function setmargin(m){ var x=document.getelementsbytagname("div") //pobierz elementy wg znacznika!!!! x[0].style.marginleft=m+"px" } </SCRIPT> </HEAD> <BODY style="font-size:18px"> <DIV style="border:1px solid red; width:100px;height:100px; marginleft:200px;border:3px solid red"> </DIV> <INPUT type="button" value="prawo" onclick="setmargin(300)"> <INPUT type="button" value="lewo" onclick="setmargin(100)"> </BODY></HTML>
28 <HTML><HEAD> <TITLE> Przykłady sterowania margin2</title> <SCRIPT language="javascript"> function setmargin(){ var x=document.getelementsbytagname("div") //pobierz elementy wg znacznika!!!! } albo reakcja na kliknięcie obiektu if (x[0].style.marginleft=="200px") else </SCRIPT> </HEAD> x[0].style.marginleft="300px" x[0].style.marginleft="200px" <BODY style="font-size:18px"> <DIV style="border:1px solid red; width:100px;height:100px; marginleft:200px;border:3px solid red" onclick="setmargin()"> </DIV> </BODY></HTML>
29 Sterowanie na płaszczyźnie <HTML><HEAD> <TITLE> Przykłady sterowania</title> <STYLE type="text/css"> div.x{border:1px solid red; width:100px;height:100px;background-color:red; marginleft:0px;} div.z{ border:1px solid red; width:300px;height:300px;border:1px solid green; marginleft:200px;} </STYLE> <SCRIPT language="javascript"> function setmargin(m){ } var x=document.getelementbyid("d1") //pobierz element o id=d1 x.style.marginleft=m+"px" function setmargin2(m){ } var x=document.getelementbyid("d1") //pobierz element o id=d1 x.style.margintop=m+"px" </SCRIPT> </HEAD> cd..
30 <BODY style="font-size:18px"> <INPUT type="button" value="prawo" onclick="setmargin(200)"> <INPUT type="button" value="lewo" onclick="setmargin(0)"> <INPUT type="button" value="dół" onclick="setmargin2(200)"> <INPUT type="button" value="góra" onclick="setmargin2(0)"> <DIV class="z"> <DIV id="d1" class="x"> </DIV> </DIV> </BODY></HTML>
31 Przydatne metody dla zmian struktury obiektów document.createelement(typ) document.createtextnode(tekst) utworzenie elementu o typie znacznika utworzenie węzła tekstowego element.appendchild(element_dołączany) dołączanie elementu do innego elementu (na końcu) element.clonenode(true) powielenie elementu - klonowanie element.removechild(element_dziecko); usunięcie elementu podrzędnego element.replacechild(el_nowy,el_stary); podmiana elementu podrzędnego element.setattribute(nazwa, wartość) ustawianie atrybutu element.getattribute(nazwa) pobieranie atrybutu append = dołącz create = utwórz clone = klonuj, kopiuj remove = usuń replace= zamień set = ustaw get = pobierz
32 Tworzenie nowego elementu na końcu strony <HTML><HEAD> <SCRIPT language="javascript"> function fun(d1) { //ustawianie parametrów stylu istniejącego DIV d1.style.color="red";d1.style.fontsize="28px"; d1.style.border="4px solid blue";d1.style.color="yellow"; d1.style.width="600px";d1.style.marginleft="200px"; d1.style.background="green";d1.style.textalign="center"; //tworzenie elementu - tworzymy drugi DIV d2=document.createelement("div"); //ustalamy style dla nowego DIV'a d2.style.border="4px solid red";d2.style.margin="0px 100px 0px 100px"; d2.style.textalign="center";d2.style.fontsize="32px"; //tworzymy węzeł tekstowy var t2=document.createtextnode("drugi DIV"); //dołaczamy węzeł tekstowy do nowego div'a d2.appendchild(t2); //dołączamy DIV na końcu strony dołączenie do BODY document.body.appendchild(d2); }</SCRIPT> </HEAD> cd.
33 <BODY style="font-size:18px"> <!-- Istniejący DIV --> <DIV onclick="fun(this)">kliknij tu.. </DIV> </BODY></HTML> funkcja uruchamiana kliknięciem w ten DIV
34 Słowo kluczowe this Nadając i wykorzystując identyfikatory właściwości i metod korzystamy ze słowa kluczowego this. Rozumiane jest ono jako obiekt bieżący, właściciel metody lub właściwości. Poniżej prosty przykład:
35 Przykład <HTML> <HEAD> </HEAD> <BODY style="font-size:18px"> <P> AKAPIT</P> <PRE> <SCRIPT language="javascript"> function kolor1( ) { this.document.bgcolor = "red"; } function kolor2(e) { e.style.color = "yellow"; } </SCRIPT> </PRE> <INPUT type="button" value="kolor dla tła okna" onclick="kolor1( )"> <INPUT type="button" value="kolor napisu przycisku" onclick="kolor2(this)"> </BODY> </HTML>
36 W powyższym przykładzie mamy dwie własne funkcje. W pierwszej o nazwie kolor1 ustalamy kolor tła dla bieżącego obiektu (this) - którym jest domyślnie window. Druga funkcja o nazwie kolor2 zmienia kolor czcionki Druga funkcja o nazwie kolor2 zmienia kolor czcionki przekazanego do funkcji obiektu e - wywoływana jest kliknięciem w przycisk z przekazaniem odniesienia do tego właśnie przycisku (this), a więc zmienia się kolor napisu na przycisku.
37 Tworzenie elementu potomnego do istniejącego elementu..uzupełnić poprzedni kod o funkcję function fun2(d) { //tworzymy akapit P p1=document.createelement("p"); p1.style.background="pink"; p1.style.marginleft="40px"; p1.style.marginright="40px"; // i tworzymy jego węzeł tekstowy tp1=document.createtextnode("akapit potomny do DIV"); //trzeba dołączyć węzeł tekstowy do akapitu p1.appendchild(tp1); // i dołączyć akapit do div d.appendchild(p1); } a w fun dopisać.. d2.setattribute("onclick","fun2(this)");
38 Usuwanie elementu <HTML><HEAD> <SCRIPT language="javascript"> function usun(d) { document.body.removechild(d); } </SCRIPT> </HEAD> <BODY style="font-size:18px"> <DIV onclick="usun(this)">div1</div> <DIV onclick="usun(this)">div2</div> </BODY></HTML> Uwaga: tu usuwamy element bezpośrednio potomny do body
39 Jeśli chcemy usunąć element w bardziej złożonej, głębszej strukturze, to należy wykorzystać jego element nadrzędny (parentnode węzeł "rodzic") <HTML><HEAD> <SCRIPT language="javascript"> function usun(d) { d.parentnode.removechild(d); } </SCRIPT> </HEAD> <BODY style="font-size:18px"> <DIV> <DIV onclick="usun(this)">div wewnętrzny</div> </DIV> </BODY></HTML>
40 <HTML> <HEAD> <SCRIPT language="javascript"> function Fun() { } var oryg = document.getelementbyid("lista2").lastchild; var klon = oryg.clonenode(true); document.getelementbyid("lista1").appendchild(klon); </SCRIPT> </HEAD><BODY> <UL id="lista1"><li>kawa</li><li>herbata</li></ul> <UL id="lista2"><li>woda</li><li>mleko</li></ul> <P>Kopiowanie z jednej listy na drugą.</p> <BUTTON onclick="fun()">klonuj</button> </BODY></HTML> Koniec listy bezpośrednio za ostatnim elementem, bo inaczej ostatnim będzie węzeł tekstowy
Programowanie obiektowe. Wykład 3
Programowanie obiektowe Wykład 3 DOM model dokumentu HTML Dokument HTML składa się z obiektów (standardowych i utworzonych przez użytkownika). Głównym obiektem jest document, posiada strukturę drzewiastą
JAVAScript - obiekty HTML
Programowanie obiektowe ćw.3 JAVAScript - obiekty HTML DOM model dokumentu HTML Dokument HTML składa się z obiektów (standardowych i utworzonych przez użytkownika). Głównym obiektem jest document, posiada
2.JAVAScript - obiekty HTML
2.JAVAScript - obiekty HTML DOM model dokumentu HTML Dokument HTML składa się z obiektów (standardowych i utworzonych przez użytkownika). Głównym obiektem jest document, posiada strukturę drzewiastą składowych
HTML. HTML(ang. HyperTextMarkupLanguage, pol. hipertekstowy język znaczników) język wykorzystywany do tworzenia stron internetowych
HTML HTML(ang. HyperTextMarkupLanguage, pol. hipertekstowy język znaczników) język wykorzystywany do tworzenia stron internetowych HTML zdefiniowanie sposobu wizualnej prezentacji dokumentu w przeglądarce
Danuta ROZPŁOCH-NOWAKOWSKA Strona 1 2007-11-06. Moduł 4. Przykład 1. Przykład 2. HTML 4.01 Transitional).
Danuta ROZPŁOCH-NOWAKOWSKA Strona 1 2007-11-06 Moduł 4. Style Zajęcia poświęcone będą kaskadowym arkuszom stylów (por. slajdy 18.-27. z wykładu 2.) Wiele uwagi poświęcaliśmy do tej pory planowaniu szkieletu
Informatyka MPDI 3 semestr
Informatyka MPDI 3 semestr Wykład 2 CSS JavaScript CSS arkusze stylów opiera się na zasadzie określania cech elementy dzięki atrybutowi style ... Styl może mieć wiele cech,
Dzięki arkuszom zewnętrznym uzyskujemy centralne sterowanie wyglądem serwisu. Zewnętrzny arkusz stylów to plik tekstowy z rozszerzeniem css.
Kaskadowe arkusze stylów CSS Geneza - oddzielenie struktury dokumentu HTML od reguł prezentacji - poszerzenie samego HTML Korzyści - przejrzystość dokumentów - łatwe zarządzanie stylem (wyglądem) serwisu
Programowanie obiektowe. Wykład 4
Programowanie obiektowe Wykład 4 Tworzenie własnych obiektów Słowo kluczowe this W JavaScriptmożna tworzyć własne obiekty. Wykorzystuje się tu zapis utworzonej funkcji o nazwie takiej samej jak klasa,
Informatyka 2MPDI. Wykład 4
Informatyka 2MPDI Wykład 4 Strony WWW (World Wide Web) Mosaic pierwsza przeglądarka 1993 Internet Explorer Opera Firefox(Mozilla) Safari Chrome(Google) HTML HTML (ang. HyperText Markup Language, pol. hipertekstowy
Krótki przegląd własności języka CSS
Krótki przegląd własności języka CSS Stosując arkusze stylów CSS, w sposób wyraźny oddziela się formatowanie dokumentu XHTML od jego warstwy znaczeniowej umieszczonej w sekcji . Niżej zestawiono
Podstawy HTML i styli CSS. selektor {właściwość1: wartość1; właściwość2: wartość2}
Kaskadowe arkusze stylów (CSS) W trakcie projektowania własnego serwisu w języku HTML napotkamy problem z określeniem precyzyjnego pozycjonowania tekstu i grafiki oraz elastycznym formatowaniem tekstu.
www.fwrl.pl/szkolenie
STRONA www.fwrl.pl/szkolenie MS WORD HTML HTML i dostarczają informację dla silnika przeglądarki o tym jak ma być zbudowana i wyświetlona strona HTML HTML HTML (warstwa logiczna co i gdzie ma być) (wastwa
Model blokowy. Model blokowy w CSS
Model blokowy Model blokowy w CSS opisuje bloki, które są generowane dla elementów HTML. Model blokowy zawiera także dokładne opcje związane z ustawieniem maginesu zewnętrznego, wewnętrznego, obramowania
Zdefiniowane style mogą określać układ treści na stronie i sposób jej formatowania np. kolor czcionki, pogrubienia, tło tabel, rysunków itp.
Style CSS Wstęp Zdefiniowane style mogą określać układ treści na stronie i sposób jej formatowania np. kolor czcionki, pogrubienia, tło tabel, rysunków itp. Podstawową zaletą i zadaniem stylów jest oddzielenie
za pomocą: definiujemy:
HTML CSS za pomocą: języka HTML arkusza CSS definiujemy: szkielet strony wygląd strony Struktura dokumentu html - znaczniki Znaczniki wyznaczają rodzaj zawartości. element strony
XML extensible Markup Language. część 5
XML extensible Markup Language część 5 JavaScript Co to jest JavaScript? JavaScript był zaprojektowany w celu dodania interaktywności do stron HTML JavaScript jest językiem skryptowym JavaScript jest zwykle
Ćw.4 Dokumenty HTML Przy pomocy języka znaczników opisać można strukturę witryny internetowej, postać i wygląd jej elementów.
Ćw.4 Dokumenty HTML Przy pomocy języka znaczników opisać można strukturę witryny internetowej, postać i wygląd jej elementów. Znaczniki HTML (tagi) postać ogólna: zawartość
Box model: Content. Content - obszar zawartości określany jest za pomocą deklaracji wysokości i szerokości.
Box model Box model: Content Content - obszar zawartości określany jest za pomocą deklaracji wysokości i szerokości. Box model: Padding Content Content - obszar zawartości określany jest za pomocą deklaracji
Funkcje i instrukcje języka JavaScript
Funkcje i instrukcje języka JavaScript 1. Cele lekcji a) Wiadomości Uczeń : zna operatory i typy danych języka JavaScript, zna konstrukcję definicji funkcji, zna pętlę If i For, Do i While oraz podaje
HTML (HyperText Markup Language) hipertekstowy język znaczników
HTML (HyperText Markup Language) hipertekstowy język znaczników Struktura dokumentu tytuł strony
DOM (Document Object Model)
DOM (Document Object Model) Czym jest DOM? Platforma, która pozwala skryptom na dynamiczny dostęp do zawartości strony i jej aktualizację. Elementy można dodawać, zmieniać lub usuwać. Specyfikacje Poziomy
kaskadowe arkusze stylów
Autor: Marek Buła bulkas@poczta.onet.pl CSS kaskadowe arkusze stylów CASCADING STYLE SHEETS Validator (X)HTML Validator CSS CSS CSS level 1 (1996, 1999) contains properties for fonts, margins, colors,
Krok 1: Stylizowanie plakatu
HTML & CSS 1 Wanted! Każdy Klub Kodowania musi być zarejestrowany. Zarejestrowane kluby można zobaczyć na mapie na stronie codeclubworld.org - jeżeli nie ma tam twojego klubu sprawdź na stronie jumpto.cc/18cplpy
Young Programmer: HTML+PHP. Dr inż. Małgorzata Janik, Zajęcia #2
Young Programmer: HTML+PHP Dr inż. Małgorzata Janik, Zajęcia #2 Ramowy program warsztatów Zajęcia 1: Zajęcia wprowadzające, HTML Zajęcia 2: Style CSS (tabele i kaskadowe arkusze stylów) Zajęcia 3: Podstawy
Kaskadowe arkusze stylów (CSS)
Kaskadowe arkusze stylów (CSS) CSS (Cascading Style Sheets) jest to język opisujący sposób, w jaki przeglądarki mają wyświetlać zawartość odpowiednich elementów HTML. Kaskadowe arkusze stylów służą do
CSS pozwala przypisać poszczególnym elementom na. grubość, rozmiar czcionki, kolor tła, odległości między
Cascading Style Sheets CSS CSS pozwala przypisać poszczególnym elementom na stronie (HTML/XML) takie właściwości jak rodzaj, grubość, rozmiar czcionki, kolor tła, odległości między elementami, ich obramowania,
Celem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania na nich skryptów w języku JavaScript.
Instrukcja laboratoryjna do ćwiczenia: 1. Cel ćwiczenia Strona internetowa w systemach unix-owych Celem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania
CSS - 2. Właściwości tekstu, czcionek
CSS - 2 Właściwości tekstu, czcionek Właściwości tekstu Służą do nadawania określonego wyglądu tekstowi:» color» direction» letter-spacing» text-align» text-decoration» text-indent» text-shadow» text-transform»
Projektowanie aplikacji internetowych. CSS w akcji
Projektowanie aplikacji internetowych CSS w akcji Tak to ma wyglądać Strona : 2 Założenie Treść strony ma być oddzielona od informacji o jej wyglądzie. Kod HTML nie powinien zawierać żadnych informacji
p { color: yellow; font-weight:bold; }
Barbara Łukawska, Adam Krechowicz, Tomasz Michno Ćwiczenie nr 13: CSS Wstęp Cascading Style Sheets (Kaskadowe Arkusze Styli, w skrócie CSS) jest językiem, który opisuje sposób w jaki będzie wyświetlana
Mechatronika PWSW. Informatyka. Wykład 2
Mechatronika PWSW Informatyka Wykład 2 Strony WWW (World Wide Web) Mosaic pierwsza przeglądarka 1993 Internet Explorer Opera Firefox(Mozilla) Safari Chrome(Google) HTML HTML (ang. HyperText Markup Language,
Programowanie WEB PODSTAWY HTML
Programowanie WEB PODSTAWY HTML Najprostsza strona HTML tytuł strony To jest moja pierwsza strona WWW. tytuł strony
Witryny i aplikacje internetowe
Test z przedmiotu Witryny i aplikacje internetowe Zadanie 1 Kod języka HTML przedstawi tabelę składającą się z dwóch
LABORATORIUM 3 WSTĘP DO SIECI TELEINFORMATYCZNYCH CSS CECHY WYBRANYCH SELEKTORÓW
LABORATORIUM 3 WSTĘP DO SIECI TELEINFORMATYCZNYCH CSS CECHY WYBRANYCH SELEKTORÓW 1. Definicja tła Tło elementu HTML można definiować w CSS korzystając z następujących cech: background-color background-image
CSS. Kaskadowe Arkusze Stylów
CSS Kaskadowe Arkusze Stylów CSS CSS = Cascading Style Sheets Style określają sposób wyświetlania zawartości elementów HTML Arkusz stylów jest zbiorem takich reguł Pojawiły się w HTML 4.0 by rozwiązać
CSS - layout strony internetowej
www.math.uni.lodz.pl/ radmat Ćwiczenie 1 Proszę przy pomocy listy stworzyć menu pionowe o następujących własnościach: Ćwiczenie 1 Proszę przy pomocy listy stworzyć menu pionowe o następujących własnościach:
Rys.2.1. Drzewo modelu DOM [1]
![Rys.2.1. Drzewo modelu DOM [1]](/thumbs/39/18108975.jpg "Rys.2.1. Drzewo modelu DOM [1]")
1. CEL ĆWICZENIA Celem ćwiczenia jest przedstawienie możliwości wykorzystania języka JavaScript do tworzenia interaktywnych aplikacji działających po stronie klienta. 2. MATERIAŁ NAUCZANIA 2.1. DOM model
Laboratorium 1: Szablon strony w HTML5
Laboratorium 1: Szablon strony w HTML5 Czas realizacji: 2 godziny Kurs: WYK01_HTML.pdf, WYK02_CSS.pdf Pliki:, Edytor: http://www.sublimetext.com/ stabilna wersja 2 (portable) Ćwiczenie 1. Szablon strony
Technologie informacyjne Mechatronika PWSW. W4-24.XI Pakiet Office edytor HTML
Technologie informacyjne Mechatronika PWSW W4-24.XI Pakiet Office edytor HTML Superaplikacja biurowa MS- OFFICE Microsoft Office to pakiet aplikacji biurowych wyprodukowany przez firmę Microsoft. Popularny
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 6 JavaScript w przeglądarce Agenda Skrypty na stronie internetowej Model DOM AJAX Skrypty na stronie
Oczywiście występują także znaczniki, bez ich odpowiednika kończącego, np. <BR>
Język html to język znaczników inaczej tagów, czyli słów lub skrótów pochodzących z języka angielskiego ujętych w nawiasy ostrokątne , np.. . W większości przypadków spotykamy znaczniki początku (inaczej
Podstawy HTML i CSS. Wydział Matematyki, Informatyki i Ekonometrii Uniwersytet Zielonogórski
Podstawy HTML i CSS Grzegorz Arkit Wydział Matematyki, Informatyki i Ekonometrii Uniwersytet Zielonogórski 13 października 2016 G. Arkit (WMIiE) Podstawy HTML i CSS 13 października 2016 1 / 20 Informacja
Systemy internetowe Wykład 2 CSS
Systemy internetowe Wykład 2 CSS CSS - definicja CSS (Cascading Style Sheets) kaskadowe arkusze stylów CSS - język opisujący w jaki sposób elementy HTML będą wyświetlane na ekranie komputera, tabletu,
Dokument hipertekstowy
Dokument hipertekstowy Laboratorium 4 CSS mgr inż. Krzysztof Wróbel Katedra Lingwistyki Komputerowej Cel poznanie konceptu stylów tworzenie różnych typów reguł stylów Style służą do zmiany wyglądu elementów
I. Wstawianie rysunków
I. Wstawianie rysunków Wstawiane rysunku Bez parametrów: Tekst alternatywny Tytuł obrazka
Format HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty
Wybrane działy Informatyki Stosowanej Format HTML Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty dr hab. inż. Andrzej Czerepicki 2019 Definicja HTML HyperText Markup Language
PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński
PROGRAMOWANIE KASKADOWE ARKUSZE STYLÓW CASCADING STYLE SHEETS Za pomocą HTML tworzymy strukturę dokumentu, jego elementy oraz treść CSS służy do opisu wyglądu struktury dokumentu, elementów oraz treści
SterBox. Przygotowanie Strony Użytkownika
Przygotowanie Strony Użytkownika Sterbox od wersji 2.1.1 obsługuje dwie strony użytkownika umożliwiające sterowanie z kontrolą stanów. Rozpoczynając tworzenie strony potrzebujemy programu do tworzenia
Ćwiczenia laboratoryjne nr 8 Podstawy języka XML.
Prezentacja Danych i Multimedia II r Socjologia Ćwiczenia laboratoryjne nr 8 Podstawy języka XML. Celem ćwiczeń jest poznanie zasad tworzenia dokumentów w oparciu o język XML oraz metod modyfikacji ich
Podstawy (X)HTML i CSS
Inżynierskie podejście do budowania stron WWW momat@man.poznan.pl 2005-04-11 1 Hyper Text Markup Language Standardy W3C Przegląd znaczników Przegląd znaczników XHTML 2 Cascading Style Sheets Łączenie z
Przykład integracji kalkulatora mbank RATY na platformie IAI
Przykład integracji kalkulatora mbank RATY na platformie IAI 1. Moderacja - > Dodatki HTML i JavaScript 1.1 Klikamy na przycisk nowy dodatek Wpisujemy w pole Tytuł dodatku nazwę CSS_mRaty. Następnie ustawiamy
Ćwiczenie 9 - CSS i wstawianie CSS
Ćwiczenie 9 - CSS i wstawianie CSS Wprowadzenie: Od tego ćwiczenia zajmować się będziemy CSS czyli Kaskadowymi Arkuszami Stylów (Cascading Style Sheets). CSS stanowią uzupełnienie dla HTML-a. HTML odpowiada
Wprowadzenie do Internetu zajęcia 3
Wprowadzenie do Internetu zajęcia 3 Zakres tematyczny zajęć CSS arkusz stylów. Formatowanie tekstu CSS w przykładach. CSS arkusz stylów Wprowadzenie Język HTML, XHTML został wzbogacony o potężne narzędzie
TECHNOLOGIE SIECI WEB
1. Wybrane elementy sk³adni CSS TECHNOLOGIE SIECI WEB Prowadz¹cy: dr in. Jan Prokop, e-mail: jprokop@prz.edu.pl, Politechnika Rzeszowska, Wydzia³ Elektrotechniki i Informatyki LABORATORIUM ÆWICZENIE nr
Tworzenie Stron Internetowych. odcinek 6
Tworzenie Stron Internetowych odcinek 6 CSS kaskadowe arkusze stylów CSS (Cascading Style Sheets), czyli Kaskadowe Arkusze Stylów "stylów" "arkusze" Reguły opisujące wygląd dokumentu opisanego za pomocą
Znaczniki języka HTML
www.math.uni.lodz.pl/ radmat Elementy inline ... Elementy inline ... ... Elementy inline ... ... ... Elementy inline
Laboratorium 6 Tworzenie bloga w Zend Framework
Laboratorium 6 Tworzenie bloga w Zend Framework Przygotowanie bazy danych 1. Wykonaj skrypt blog.sql, który założy w bazie danych dwie tabele oraz wpisze do nich przykładowe dane. Tabela blog_uzytkownicy
Zajęcia 4 - Wprowadzenie do Javascript
Zajęcia 4 - Wprowadzenie do Javascript Co to jest Javascript Javascript jest językiem skryptowym pozwalającym na dołączanie dodatkowej funkcjonalności do stron WWW. Jest ona najczęściej związana z modyfikacją
zmiana koloru tła <body bgcolor = kolor > tło obrazkowe <body background= ścieżka dostępu do obrazka >
tytuł dokumentu treść dokumentu
I. Formatowanie tekstu i wygląd strony
I. Formatowanie tekstu i wygląd strony Akapit: ... aby wyrównać tekst do lewego marginesu aby wyrównać tekst do prawego marginesu:
używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów
opracowanie I. K. używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów ISO-8859-2 - norma międzynarodowa określająca sposób kodowania
Tworzenie stron internetowych w kodzie HTML Cz 5
Tworzenie stron internetowych w kodzie HTML Cz 5 5. Tabele 5.1. Struktura tabeli 5.1.1 Odcięcia Microsoft Internet Explorer 7.0 niepoprawnie interpretuje białe znaki w komórkach tabeli w przypadku tworzenia
Aplikacje internetowe
Temat: Język HTML i style CSS Aplikacje internetowe Pracownia specjalistyczna, studia podyplomowe, rok 2011/2012 1. Stwórz formularz HTML pozwalający na rejestrację użytkownika w aplikacji internetowej.
Tablica zawierająca odniesienia do znajdujących się w dokumencie obiektów typu Anchor.
Obiekt document służy do reprezentacji wczytanego do przeglądarki dokumentu HTML oraz zawiera szereg właściwości i metod pozwalających na jego modyfikację. Poprzez ten obiekt można otrzymać dostęp praktycznie
Nazwa implementacji: CSS i box model. Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie.
Nazwa implementacji: CSS i box model Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie. Wprowadzenie CSS (kaskadowe arkusze stylów, ang. Cascading
Dziedziczenie. Dziedziczenie i kaskadowość. Dodał Administrator środa, 10 marzec :00. Tematy: Dziedziczenie Kaskadowość
Tematy: Dziedziczenie Kaskadowość Dziedziczenie Zrozumienie pojęcia dziedziczenia wymaga od nas zapoznania się z hierarchią ważności poszczególnych znaczników wewnątrz dokumentu. Kaskadowe arkusze stylów
Tabele. Przykład 15a.htm. <HTML><HEAD><TITLE> Cennik</TITLE></HEAD><BODY><H3>Cennik</H3> <TABLE BORDER="1"> <TR>
Tabele Autorem niniejszego skryptu jest dr inż. Robert Kolud Tabele w HTML to nie tylko praktyczny sposób na przedstawianie zestawień informacji. Znacznie częściej jednak tabele są wygodnym narzędziem
Języki programowania wysokiego poziomu. CSS Wskazówki
Języki programowania wysokiego poziomu CSS Wskazówki CSS powinno się projektować hierarchicznie, zaczynając od elementów ogólniejszych, kończąc na szczegółowych - Źle: p.mid { text-align: center; p { color:
Kaskadowe arkusze stylów cz. 2
Formatowanie wyglądu tekstu Właściwości związane z czcionką Wybór czcionki Tworzenie czcionki pochyłej Pogrubianie czcionki Określanie wielkości czcionki Wykorzystanie kapitalików Określanie wysokości
Arkusze stylów CSS Cascading Style Sheets
Arkusze stylów CSS Cascading Style Sheets HTML a CSS HTML odpowiada za strukturę tworzonej witryny internetowej i poszczególnych dokumentów (ich stronę semantyczną) CSS odpowiada za wizualną prezentację
JAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window
Programowanie obiektowe ćw.2 JAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window Tablice w JavaScript Przykład zastosowania tablicy dla przekazania rezultatów funkcji do miejsca wywołania
Tworzenie Stron Internetowych. odcinek 7
Tworzenie Stron Internetowych odcinek 7 CSS dziedziczenie Drzewo dokumentu Drzewo dokumentu to hierarchia elementów umieszczonych w dokumencie źródłowym HTML. Każdy element w takim drzewie ma dokładnie
Sierpień 2015 rozwiązanie plik: index.htlm
Sierpień 2015 rozwiązanie plik: index.htlm strona główna //ustalamy położenie wyświetlania
Innowacja pedagogiczna Pasja programowania ZESPÓŁ SZKÓŁ W CHOROSZCZY
Innowacja pedagogiczna Pasja programowania ZESPÓŁ SZKÓŁ W CHOROSZCZY 1. Informacje o innowacji Nazwa szkoły: Zespół Szkół w Choroszczy Etap edukacyjny: Szkoła Podstawowa, klasy 4-6 Tytuł innowacji: Pasja
PORADNIK KODOWANIA: CSS
PORADNIK KODOWANIA: CSS Przygotowane przez Jakuba Skórzyńskiego SPIS TREŚCI Wstęp... 3 Jak zacząć?. 4 Składnia 5 Klasy i unikaty.. 7 Rzeczy ważne 8 Najważniejsze komendy 9 Porady i Triki. 11 2 Wstęp Nazywam
plansoft.org Zmiany w Plansoft.org
Zmiany w Plansoft.org Mapy Google... 1 Tworzenie mapy... 2 Wprowadzanie szerokości i długości geograficznej... 2 Tworzenie mapy... 2 Dostosowanie wyglądu mapy... 3 Ograniczanie liczby zasobów do wyświetlenia
XML extensible Markup Language. część 5
XML extensible Markup Language część 5 XML ważne zastosowanie Jak często pracujemy z plikami XML? Wróćmy jeszcze do wykładu poprzedniego. A dokładnie do pliku zawierającego ten wykład. xml_2017_wyklad_4.pptx
HTML (HyperText Markup Language)
HTML (HyperText Markup Language) Struktura dokumentu tytuł strony sekcja nagłówka Tutaj wpisujemy
Kaskadowe arkusze stylów
CSS Kaskadowe arkusze stylów Gabriela Przęczek Co to jest CSS?. Skrót pochodzi z angielskiego Cascading Style Sheets Kaskadowe arkusz stylu to narzędzie dające szerokie możliwości formatowania dokumentów
Dokumentacja Skryptu Mapy ver.1.1
Dokumentacja Skryptu Mapy ver.1.1 2 Dokumentacja Skryptu Mapy ver.1.1 Spis treści Dokumentacja skryptu... 3 Dodatkowe informacje i kontakt... 7 3 Dokumentacja Skryptu Mapy ver.1.1 Dokumentacja skryptu
Tworzenie stylów w HTML
Podstawy arkuszy stylów i JS CSS (kaskadowe arkusze stylów) to standard opisu formatowania języka HTML znacznie rozszerzający jego możliwości prezentacyjne. Może być stosowany zarówno dla statycznych stron
Wykład 03 JavaScript. Michał Drabik
Wykład 03 JavaScript Michał Drabik Język programowania wykorzystywany na stronach internetowych głównie w celu umożliwienia interakcji z użytkownikiem. Kod JavaScript może być umieszczany w kodzie XHTML
Kaskadowość stylów określa pierwszeństwo w oddziaływaniu na te same elementy strony różnych stylów.
Kaskadowe arkusze stylów Kaskadowe arkusze stylów CSS (Cascading Style Sheets) służą do definiowania sposobu wyświetlania elementów HTML. Pozwalają np. określać rozmiar i kolor czcionki, definiować odstępy
Elementarz HTML i CSS
Elementarz HTML i CSS Znaczniki przydatne w pracy redaktora stron internetowych 1 Elementarz HTML i CSS Znaczniki przydatne w pracy redaktora stron internetowych Treść, korekta, skład i oprawa graficzna
Specyfikacja techniczna dot. mailingów HTML
Specyfikacja techniczna dot. mailingów HTML Informacje wstępne Wszystkie składniki mailingu (pliki graficzne, teksty, pliki HTML) muszą być przekazane do melog.com dwa dni albo maksymalnie dzień wcześniej
EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2018 CZĘŚĆ PRAKTYCZNA
Arkusz zawiera informacje prawnie chronione do momentu rozpoczęcia egzaminu Układ graficzny CKE 2018 Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie
Podstawy JavaScript ćwiczenia Kontekst: Tworzenie stron internetowych z wykorzystaniem HTML5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTML5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 1 Podstawy tworzenia stron internetowych Agenda Podstawy stron internetowych Przegląd języka HTML Wprowadzenie
Przedmiot: Grafika komputerowa i projektowanie stron WWW
KARKONOSKA PAŃSTWOWA SZKOŁA WYŻSZA Kierunek: Dziennikarstwo i komunikacja społeczna Przedmiot: Grafika komputerowa i projektowanie stron WWW 1 opracował: dr inż. Jerzy Januszewicz HTML (HyperText Markup
2. Prezentacja wizualna
2. Prezentacja wizualna 2.1. Opis rozdziału Rozdział ten przedstawia jak stworzyć przykładowy układ graficzny dla naszej gry w HTML5 i CSS3, które w dalszej części poradnika zostaną wykorzystane do stworzenia
Tworzenie Stron Internetowych. odcinek 6
Tworzenie Stron Internetowych odcinek 6 CSS kaskadowe arkusze stylów CSS (Cascading Style Sheets), czyli Kaskadowe Arkusze Stylów "stylów" "arkusze" Reguły opisujące wygląd dokumentu opisanego za pomocą
Często używanym elementem języka HTML są tabele, które wykorzystuje się do wygodnego rozmieszczania informacji i obrazów.
Tabele Często używanym elementem języka HTML są tabele, które wykorzystuje się do wygodnego rozmieszczania informacji i obrazów. Ramy tabeli Ramy tabeli tworzone są za pomocą polecenia: Cała zawartość
Rozwiązania zadań EGZAMINACYJNYCH- WITRYNY
Rozwiązania zadań EGZAMINACYJNYCH- WITRYNY Zadanie maj 2015 rok Wykonaj zestaw grafik oraz stronę internetową dla zespołów medycznych zgodnie z wymaganiami dotyczącymi bazy danych, grafiki i strony internetowej.
O stronach www, html itp..
O stronach www, html itp.. Prosty wstęp do podstawowych technik spotykanych w internecie 09.01.2015 M. Rad Plan wykładu Html Przykład Strona www Xhtml Css Php Js HTML HTML - (ang. HyperText Markup Language)
Moduł IV Internet Tworzenie stron www
Ze strony internetowej www.kaze.zut.edu.pl z folderu BUDOWA JACHTÓW pobierz i zapisz je do własnego folderu następujące pliki: znak_drogowy.png, morze.jpg, logo_ecdl.gif, logobj.png ZADANIE 1 Podstawy
LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH
LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH KASKADOWE ARKUSZE STYLÓW (Cascading Style Sheets) 1. Wprowadzenie Selektory należą do kluczowych pojęć, wskazują obiekty, którym przypisujemy jakiś zestaw
HTML podstawowe polecenia Szkielet dokumentu: Wrocław dn. 20 kwietnia 2006 roku. Temat lekcji: Style CSS.
Piotr Chojnacki http://www.piotrchojnacki.pl IV rok, informatyka chemiczna Gimnazjum nr 35 we Wrocławiu Wrocław dn. 20 kwietnia 2006 roku Czas trwania zajęć: 90 minut, przedmiot: informatyka Temat lekcji:
EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2018 CZĘŚĆ PRAKTYCZNA
Arkusz zawiera informacje prawnie chronione do momentu rozpoczęcia egzaminu Układ graficzny CKE 2018 Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie
EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA
Arkusz zawiera informacje prawnie chronione do momentu rozpoczęcia egzaminu Układ graficzny CKE 2018 Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie