Wykład 6 Skrypty typu JavaScript. Technologie internetowe Zofia Kruczkiewicz
|
|
|
- Halina Król
- 6 lat temu
- Przeglądów:
Transkrypt
1 Wykład 6 Skrypty typu JavaScript Technologie internetowe Zofia Kruczkiewicz
2 1 Umieszczanie kodu JavaScript w plikach XHTML W przypadku XHTML 1.x nie występuje atrybut language. Ponadto, specyfikacja XML wymaga, by umieścić treść skryptu wewnątrz sekcji CDATA, jeśli używamy znaków takich jak: <, >. <script type="text/javascript"> // <![CDATA[ function fun() {... // ]]> </script> Znaki komentarza "//" przy początku i końcu sekcji CDATA zapobiegają błędnemu zinterpretowaniu tej sekcji przez starsze przeglądarki.
3 1.2. Zewnętrzne skrypty dodajemy także przy użyciu script znacznika, dodając tylko parametr src z nazwą pliku zawierającego kod skryptu: <script type="text/javascript" src="plik.js"></script> Typem MIME dla samodzielnych plików z kodem w JavaScripcie jest "text/javascript" lub "application/x-javascript".
4 2. Zmiana komunikatu w linii statusu przeglądarki, automatyczne pokazywanie daty Podczas tworzenia widoku za pomocą elementów JavaScript wyznaczana jest wartośc daty pwr.wroc.pl/ Obszar prostokątny "0,0,100,40" c1.html Obszar rostokątny "200,0,400,40" rysunki2.html Obszar prostokątny "400,0,500,40" c3.html#miejsce1 Obszar prostokątny "500,0,600,40" Podczas zdarzenia onload wpisano tekst do linii statusu za pomocą funkcji load() JavaScript
5 Po wyborze obszaru prostokątnego "0,0,100,40" Po wyborze obszaru prostokątnego "200,0,400,40"
6 Po wyborze obszaru prostokątnego "500,0,600,40" Po wyborze obszaru prostokątnego "400,0,500,40"
7 Kod xhtml strony <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" xml:lang="pl" lang="pl"> <head> <title>mapa odsyłaczy, skrypty JavaScript</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="probystylu.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> //<![CDATA[ function load() { window.status = "Przykłady skryptów \-Wpisywanie do linii statusu!!"; //]]> </script> </head>
8 <body onload="load()"> <p class="date"> <script type="text/javascript"> //<![CDATA[ var data = new Date(); var miesiace = new Array("stycznia", "lutego", "marca", "kwietnia", "maja", "czerwca", "lipca", "sierpnia", "września", "października", "listopada", "grudnia"); document.write(data.getdate()+", "); document.write(miesiace[data.getmonth()]+", "); document.write(data.getfullyear()+" roku"); //]]> </script> </p>
9 <h1>odsyłacze</h1> <img src="rainbow.gif" usemap = "#tecza" alt=""/> <map id="tecza"> <area shape = "rect" coords = "0,0,100,40" href=" target="newwindow" alt=""/> <area shape = "rect" coords = "200,0,400,40" href="c1.html" target="newwindow" alt=""/> <area shape = "rect" coords = "500,0,600,40" href="c3.html#miejsce1" target="newwindow" alt=""/> <area shape = "rect" coords = "400,0,500,40" href=" rysunki2.html" target="newwindow" alt=""/> </map> </body> </html>
10 body { color: #000000; h1,h3,h4 { color: #333366;.date { color: red; font-size:12px; font-weight: bolder; top: 95px; z-index: 1;.date,body,h1,h3,h4 { font-family: Arial,sans-serif; background-color: transparent;.date,h1,h3,h4 { margin-left: 200px; Arkusz stylu
11 3. Skrót do materiałów dotyczących możliwości budowy skryptów typu JavaScript po stronie klienta. Window Document History Location Navigator Screan Wszystkie elementy strony HTML Historia odwiedzanych stron podczas aktualnej sesji przeglądarki Informacje o adresie URL aktualnie załadowej strony Informacje o przeglądarce: wersja, nazwa, język, system operacyjny itp Informacje o odwiedzanym ekranie
12 Stan początkowy strony 4. Pokaz slajdów skrypty JavaScript
13 Po wybraniu myszą lewego dolnego obrazka Po wybraniu myszą prawego dolnego obrazka
14 Po wybraniu połączenia COFNIJ (najechanie myszą) Po zamknięciu okienka
15 Po wybraniu połączenia NASTĘPNY (najechanie myszą) Po powrocie po wybraniu strony przez połączenie NASTĘPNY
16 Po wybraniu połączenia KONIEC (najechanie myszą) Po powrocie po wybraniu strony przez połączenie KONIEC
17 Widok strony, gdy pliki graficzne wyświetlanych obrazków są niedostępne zawartość atrybutu alt w stanie a:link Po wybraniu atrybutu alt (najechanie myszą) stan a:hover Po wybraniu strony za pomocą atrybutu alt i powrót -stan a:visited
18 Strona pokazu slajdów <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" xml:lang="pl" lang="pl"> <head> <title>pokazy slajdów, skrypty JavaScript</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="styl10.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> //<![CDATA[ var wybrany = new Image(); var koncowy = new Image(); wybrany.src = "Assets.gif" koncowy.src = "Books.gif" var wy_wybrany = new Image(); var wy_koncowy = new Image(); wy_wybrany.src = "School.gif " wy_koncowy.src = "Dbmusic.gif " function Cofnij() { alert("to jest początek pokazu."); // ]]> </script> </head>
19 <body> <p class="litera"> Pokazy slajdów</p> <p class="wiersz_graficzny"> <img src="assets.gif" class="polozenie" alt="pierwszy slajd"/> <img src="books.gif" class="polozenie" alt="drugi slajd"/> </p> <div class="srodek"> <a href="mapa.html"> <img src="books.gif" class="polozenie" alt="pierwsza strona" id="next" onmouseover="next.src = wybrany.src" onmouseout="next.src = koncowy.src"/> </a> <a href="s15.html"> <img src="dbmusic.gif" class="polozenie" alt="wyjście z pokazu" id="exit" onmouseover="exit.src=wy_wybrany.src" onmouseout="exit.src = wy_koncowy.src" /> </a> </div>
20 <div class="wiersz_tekstowy"> <p class="lacz"> <a class="niebieski" href="#" onmouseover="cofnij()"> COFNIJ </a> <a class="niebieski" href="mapa.html"> NASTĘPNY </a> <a class="niebieski" href="s15.html"> KONIEC</a> </p> </div> </body> </html>
21 Arkusz stylu - styl10.css body { background-color: #FFFFFF; color: #000000; p { color: #003366; font-family: Arial,sans-serif; background-color: transparent; text-align:center; p.litera:first-letter { font-size:xx-large; color:#ff0000;.wiersz_graficzny { height: 160px; img.polozenie { border-style: solid; border-color: blue; margin-right: 4px; height: 150px; width: 150px;
22 Style dla obrazków i tekstu div.srodek { text-align: center; margin: auto; padding: 3px;.wiersz_tekstowy { color: #FF0000; background-color: #D2FFF1; font-size: 11pt; line-height: 90%; border-width: 4px;border-style:solid; margin: 5px 15px 5px 15px; p.lacz { background-color: yellow;
23 Definicje stylu dla elementów typu połączenie a.niebieski:visited { color: #0000FF; background-color: transparent; text-decoration: none; a.niebieski:hover { color: #00FF00; background-color:rgb(170,170,170); background-image: url(kwiatek.gif); a:link,a:visited { color: #336633; background-color: transparent; font-family:arial,sans-serif; font-size:12px; font-weight: bolder; letter-spacing: 1px; text-decoration: none; a:hover { color: #009966; background-color:rgb(230,230,179); border-color:green;
24 5. Kontrola poprawności danych za pomocą skryptów JavaScript
25 Arkusz stylu formularza styl7.css input { background-color: #ececec;color: black; font-weight: bold; textarea { background-color: gray;color: white; border: black 2px solid; font-weight: normal select { font-weight: bold; li { font-size: 15px; input,textarea, select,li { font-family: Arial, Verdana, sans-serif; font-size: 12pt;
26 .przycisk,.poletekstowe { font-family: verdana; font-size: 12px;.przycisk { background-color: #c0c0c0;color: #778899; border: # px solid;.poletekstowe { background-color: #99ccff;color: #09c09c;.wybor { background-color: #FF0000;color: #000000; border: # solid 1px; ol { list-style-type: upper-roman; list-style-position: inside;
27 Przykład skryptu kontrolującego poprawność wprowadzanych danych do formularza <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" xml:lang="pl" lang="pl"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>formularz ankiety-zewnetrzne arkusze stylów</title> <link rel="stylesheet" href="styl7.css" type="text/css"></link> <script type="text/javascript"> //<![CDATA[ function validate_nazwisko_imie(form1) { if (form1.nazwisko.value == "" form1.imie.value=="") { alert ("Proszę podać swoje nazwisko i imie."); form1.nazwisko.focus(); return false; return true; //]]> </script> </head>
28 <body> <h2>ankieta</h2> <form method="post" action=" onsubmit="return validate_nazwisko_imie(this);"> <pre> <i>podaj nazwisko: </i> <input type ="text" name="nazwisko" value="" class="poletekstowe"/> <i>podaj imię </i> <input type ="text" name="imie" value=""/> </pre> <p><i>płeć</i> <select name="plec" size="1"> <option>mężczyzna</option> <option selected="selected" class="wybor">kobieta</option> </select> </p> <p><i>podaj swoje umiejętności<br/> Zaznacz wszystkie możliwe odpowiedzi</i> </p>
29 <ol> <li><input type="checkbox" name="komputer" checked="checked" class="wybor"/> Znajomość obsługi komputera </li> <li><input type="checkbox" name="prawo_jazdy"/>posiadanie prawa jazdy</li> <li><input type="checkbox" name="angielski" checked="checked"/> Znajomość języka angielskiego</li> <li><input type="checkbox" name="niemiecki"/>znajomość języka niemieckiego</li> </ol> <i>napisz o swoich dodatkowych umiejętnościach</i><br/> <textarea name="coment" rows="5" cols="50"> </textarea> <p> <input type="submit" value="prześlij dane operacji"/><br/> <input type="reset" value="wyczyść dane" class="przycisk"/><br/> </p> </form> </body> </html>
30 5. Właściowści dokumentów Reakcja na naciśnięcie przycisku Nacisnij, aby uaktualnić
31 Reakcja na kliknięcie na pole tekstowe
32 Strona prezentująca właściwości dokumentu <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" xml:lang="pl" lang="pl"> <head> <title>pokazy slajdów, skrypty JavaScript</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="styl10.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> // <![CDATA[ function update(form1) { form1.imie.value=""; form1.przycisk.value="nacisnij, aby uaktualnić"; alert("modyfikacja danych formularza"); // ]]></script> </head>
33 <body> <h2>ankieta</h2> <form name="ankieta1" method="post" action=" <i>podaj nazwisko: </i> <input type ="text" name="imie" value="" class="poletekstowe" onclick="update(ankieta1)"> </input> <br/> <p> <input type="button" name="przycisk" value="nacisnij, aby uaktualnić" onclick= "document.ankieta1.przycisk.value +='...Zmieniono!', document.ankieta1.imie.value += '...Zmieniono!'"/> </p> <input type="submit" value="prześlij dane operacji"/> <br/> </form> </body> </html>
Wykład 5_1 TINT Formularze. Zofia Kruczkiewicz
Wykład 5_1 TINT Formularze Zofia Kruczkiewicz Wytyczne języka XHTML (c.d.) Atrybut id Zamiast atrybutu name stosuje się atrybut id. W XHTML 1.0 można go stosować np. w znaczniku . Jednak, stosując jeszcze
Wykład 4. Specyfikacje XHTML, formularze
Wytyczne języka XHTML (c.d.) Wykład 4 Specyfikacje XHTML, formularze Atrybut id Zamiast atrybutu name stosuje się atrybut id. W XHTML 1.0 można go stosować np. w znaczniku . Jednak, stosując jeszcze
Wykład 5_2 Arkusze stylów dziedziczenie. Technologie internetowe Zofia Kruczkiewicz
Wykład 5_2 Arkusze stylów dziedziczenie Technologie internetowe Zofia Kruczkiewicz 1. Dziedziczenie stylów Zagnieżdżone elementy dziedziczą styl od elementów zagnieżdżających. Dziedziczenie stylu wynika
HTML (HyperText Markup Language) hipertekstowy język znaczników
HTML (HyperText Markup Language) hipertekstowy język znaczników Struktura dokumentu tytuł strony
Responsywne strony WWW
www.math.uni.lodz.pl/ radmat Ćwiczenie 1 Proszę zaprojektować następujący layout strony, oparty na DIV-ach: Aby osiągnąć powyższy efekt, w pliku CSS powinniśmy utworzyć reguły: #cala_strona width: 780px;
Rys.1. Prosty przykład strony www
Wykład 5 Kaskadowe arkusze stylów CSS element dynamiczny języka HTML (DHTML) Kaskadowe arkusze stylów pozwalają projektantowi: kontrolować wygląd dokumentu oddzielić tę kontrolę od języka HTML, czyli od
Podstawy JavaScript ćwiczenia Kontekst: 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
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
XHTML Budowa strony WWW
XHTML Budowa strony WWW Wydział Fizyki Politechnika Warszawska 2019 dr inż. Marzena Sala-Tefelska Założenie strony www na serwerze student 1. Tworzymy główny plik o nazwie index.html (plik tekstowy). UWAGA!:
Wykład 2 TINT. XHTML tabele i ramki. Zofia Kruczkiewicz
Wykład 2 TINT XHTML tabele i ramki Zofia Kruczkiewicz 1. Tabele 1.1. Przykład tabeli zawierającej kalendarz na miesiąc marzec ... definiuje tabelę Atrybuty: border ="" obramowanie tabeli,
Sierpień 2015 rozwiązanie plik: index.htlm
Sierpień 2015 rozwiązanie plik: index.htlm strona główna //ustalamy położenie wyświetlania
H2.cjk { font-family: "Microsoft YaHei"; font-size: 14pt; font-style: italic; font-weight:
Kod konspektu wygenerowany przez OpenOffice Writer
HTML (HyperText Markup Language)
HTML (HyperText Markup Language) Struktura dokumentu tytuł strony sekcja nagłówka Tutaj wpisujemy
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
Wykład 4_1 TINT. Obiekty graficzne. Zofia Kruczkiewicz
Wykład 4_1 TINT Obiekty graficzne Zofia Kruczkiewicz 1. Grafika i połączenia GIF (.gif) JPEG (.jpg,.jpeg), XBM (.xbm), TIFF (.tiff,.tif), BMP (.bmp),
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
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
Systemy internetowe HTML
Systemy internetowe HTML West Pomeranian University of Technology, Szczecin; Faculty of Computer Science Kwestie organizacyjne Obecność na wykładach nieobowiązkowa Obecność na laboratoriach obowiązkowa
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:
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
Budowa dokumentu HTML 5
Podstawy HTML 5 i CSS Budowa dokumentu HTML 5 Na dokument HTML składają się deklaracje: typu dokumentu DTD, nagłówka oraz treści strony. Deklaracja dokumentu DTD określa w jaki sposób przeglądarka reaguje
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza HTML z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed wysłaniem
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
Hyper Text Markup Language
Podstawy projektowania dokumentów WWW Język znaczników HTML Hyper Text Markup Language Język słuŝący do zapisu dokumentów WWW. Opisuje wygląd dokumentu i definiuje łączniki hipertekstowe, pozwalające na
Budowa aplikacji wielowarstwowych. Zastosowanie Kaskadowych arkuszy stylów (CSS)
Budowa aplikacji wielowarstwowych. Zastosowanie Kaskadowych arkuszy stylów (CSS) Laboratorium 7 Technologie internetowe Zofia Kruczkiewicz TINT_Lab_7, Zofia Kruczkiewicz 1 Wykaz pytań dotyczących materiału
Ć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ść
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ą
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
Znaczniki języka HTML
www.math.uni.lodz.pl/ radmat Elementy inline ... Elementy inline ... ... Elementy inline ... ... ... Elementy inline
Pozycjonowanie i poruszanie warstw
Pozycja warstwy na ekranie może być zmieniana poprzez modyfikację właściwości top i left obiektu style. Odpowiadają one za położenie lewego górnego rogu; pierwsza za współrzędną x, druga y. Umiejscowienie
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
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
Wykład 2: Kaskadowe arkusze stylów (CSS Cascade Style Sheets)
Wykład 2: Kaskadowe arkusze stylów (CSS Cascade Style Sheets) Przykład użycia stylu
Ć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
Zdarzenia Zdarzenia onload i onunload
Zdarzenia Zdarzenia onload i onunload Ćwiczenie 1. Rysunek 1. Okno powitalne wykorzystujące zdarzenie onload Na stronie mogą zachodzić różne zdarzenia, np. użytkownik kliknie myszą lub zacznie wprowadzać
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
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
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
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
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
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
TECHNOLOGIE SIECI WEB
TECHNOLOGIE SIECI WEB Prowadzący: dr inż. Jan Prokop, e-mail: jprokop@prz.edu.pl, Politechnika Rzeszowska, Wydział Elektrotechniki i Informatyki LABORATORIUM ĆWICZENIE nr 1 Temat: Język (X)HTML - Layout
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
Zastosowanie kaskadowych arkuszy stylów (CSS - Cascading Style Sheets) w technologii JavaServer Faces
Zastosowanie kaskadowych arkuszy stylów (CSS - Cascading Style Sheets) w technologii JavaServer Faces wg http://www.w3.org/tr/css3-selectors/ http://courses.coreservlets.com/course-materials/pdf/jsf/jsf2/jsf2-
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
JavaScript - wykład 4. Zdarzenia i formularze. Obsługa zdarzeń. Zdarzenia. Mysz. Logiczne. Klawiatura. Beata Pańczyk
Obsługa zdarzeń JavaScript - wykład 4 Zdarzenia i formularze Beata Pańczyk zdarzenia - wszystko co zachodzi w związku z obiektami JavaScript (np. window) i elementami XHTML przeglądarka moŝe wywołać funkcję
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.
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
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
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza na stronie WWW z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed
Wybrane znaczniki HTML
Wybrane znaczniki HTML Struktura dokumentu HTML informacje o dokumencie i plikach zewnętrznych zawartość wyświetlana w przeglądarce wraz z tagami formatującymi
APLIKACJE INTERNETOWE 1 HTML - STRUKTURA STRONY INTERNETOWEJ
APLIKACJE INTERNETOWE 1 HTML - STRUKTURA STRONY INTERNETOWEJ PLAN PREZENTACJI Wprowadzenie do HTML Struktura dokumentu HTML Komentarze Znaczniki Nagłówki (tytuły) Akapit Znacznik końca wiersza Linia pozioma
Budowa aplikacji wielowarstwowych. Zastosowanie szablonów
Budowa aplikacji wielowarstwowych. Zastosowanie szablonów Laboratorium 2 Technologie internetowe Zofia Kruczkiewicz 1 Wykaz pytań dotyczących materiału wykorzystanego w lab2, które należy opracować (wykład
XHTML - Extensible Hypertext Markup Language, czyli Rozszerzalny Hipertekstowy Język Oznaczania.
XHTML - Extensible Hypertext Markup Language, czyli Rozszerzalny Hipertekstowy Język Oznaczania. Reformuje on znane zasady języka HTML 4 w taki sposób, aby były zgodne z XML (HTML przetłumaczony na XML).
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
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
Inwestycja - kompleks dwóch budynków mieszkalnych wielorodzinnych
Inwestycja - kompleks dwóch budynków mieszkalnych wielorodzinnych Plik wygenerowany przez generator ofert PDF przygotowany przez silnet.pl Opis inwestycji Typ realizacji: - kompleks dwóch budynków mieszkalnych
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)
ZAWSEZ PAMIĘTAMY O KOLJENOŚĆI OTWIERANIA I ZAMYKANIA ZNACZNIKÓW
HTML i inne Struktura dokumentu standard języka użytego do budowy strony nagłówek strony zawartość strony ZAWSEZ PAMIĘTAMY O KOLJENOŚĆI OTWIERANIA I ZAMYKANIA ZNACZNIKÓW Strona kodowa Opis strony Słowa
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
HTML DOM, XHTML cel, charakterystyka
HTML DOM, XHTML cel, charakterystyka Mariusz Kacała Łukasz Przywarty Grzegorz Trawiński HTML DOM XHTML Ramowy plan prezentacji Wstęp HTML DOM - Założenia - Model i struktura - Właściwości - Metody i zastosowania
<body> <div style="max-width: 900px; margin: 0 auto;">
Załącznik Nr 2 do Uchwały Nr XXVII.144.2016 Rady Gminy Brańszczyk z dnia 28 czerwca 2016 roku
FORMULARZE Formularz ma formę ankiety, którą można wypełnić na stronie. Taki formularz może być np. przesłany pocztą elektroniczną e-mail.
1 FORMULARZE Formularz ma formę ankiety, którą można wypełnić na stronie. Taki formularz może być np. przesłany pocztą elektroniczną e-mail.
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
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
Formularze HTML. dr Radosław Matusik. radmat
www.math.uni.lodz.pl/ radmat Ramy formularza: Grupowanie pól formularza
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium JavaServer Pages Celem ćwiczenia jest zbudowanie kilku prostych stron internetowych z użyciem technologii JSP. Podczas ćwiczenia wykorzystany zostanie algorytm sortowania bąbelkowego
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
Mailingi HTML. Specyfikacja techniczna
Mailingi HTML Specyfikacja techniczna Informacje wstępne Grupa Morizon S.A. zastrzega sobie prawo do odmowy emisji materiałów reklamowych bez podania przyczyny, w szczególności gdy ich jakość techniczna
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
A P L I K A C J E I N T E R N E T O W E KONSPEKT nr 3 (DIV, galeria, formularze)
1 BLOK DOKUMENTU Polecenie div (blok, sekcja) odgrywa istotną rolę w grupowaniu wielu różnych elementów i pozycjonowaniu fragmentów dokumentu. We wcześniejszych wersjach HTML, od 3.2 do 4.01, na blokach
PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński
PROGRAMOWANIE HTML W składni języka HTML wykorzystuje się charakterystyczne znaczniki. Każdy z nich zaczyna się i kończy ostrokątnym nawiasem a pomiędzy nimi znajduje się wyrażenie html. Rozróżniamy znaczniki
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ć
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
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
XHTML, CSS i JavaScript. Pierwsza pomoc
. Pierwsza pomoc Autorzy: Maria Sokó³, Rados³aw Sokó³ ISBN: 978-83-246-1071-6 Format: A5, stron: 100 Pocz¹tki tworzenie szkieletu strony WWW i struktury dokumentu HTML Wygl¹d strony kodowanie znaków, krój
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
Technologie Informacyjne
Technologie Informacyjne Wykªad 7 Paweª Witkowski MIM UW Wiosna 2013 P. Witkowski (MIM UW) Technologie Informacyjne Wiosna 2013 1 / 23 HTML HTML Sªu»y do deniowania struktury dokumentu: akapity nagªówki
Aplikacje internetowe. Interfejs użytkownika
Aplikacje internetowe Interfejs użytkownika Plan wykładu Formatowanie HTML za pomocą arkuszy stylów CSS Język XML ogólna struktura dokumentów opis struktury za pomocą DTD przestrzenie nazw Język XHTML
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza HTML z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed wysłaniem
Programowanie internetowe
Programowanie internetowe Wykład 1 HTML mgr inż. Michał Wojtera email: mwojtera@dmcs.pl Plan wykładu Organizacja zajęć Zakres przedmiotu Literatura Zawartość wykładu Wprowadzenie AMP / LAMP Podstawy HTML
Aplikacje internetowe - laboratorium
Aplikacje internetowe - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza HTML z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed
INSTALACJA I KONFIGURACJA SERWERA PHP.
LABORATORIUM 0 INSTALACJA I KONFIGURACJA SERWERA PHP. W celu poprawnego wykonywania zadań na laboratorium konieczne jest zainstalowanie na komputerze wyposażonym w system operacyjny Windows następujących
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
Źródła. cript/1.5/reference/ Ruby on Rails: http://www.rubyonrails.org/ AJAX: http://www.adaptivepath.com/publications/e ssays/archives/000385.
Źródła CSS: http://www.csszengarden.com/ XHTML: http://www.xhtml.org/ XML: http://www.w3.org/xml/ PHP: http://www.php.net/ JavaScript: http://devedgetemp.mozilla.org/library/manuals/2000/javas cript/1.5/reference/
Zawartość specyfikacji:
Zawartość specyfikacji: Wielkość, waga i kodowanie Umieszczanie obrazków w kreacji Elementy niedopuszczalne Nazewnictwo plików Stopka mailingu Nie spełniam wymagań pracodawcy Waga, wielkość i kodowanie
Wprowadzenie do Internetu zajęcia 4
Wprowadzenie do Internetu zajęcia 4 Zakres tematyczny zajęć Rozmieszczanie elementów za pomocą CSS; JavaScript wprowadzenie, zagadnienia podstawowe; Wykorzystanie JavaScript-u do kontroli formularzy. Rozmieszczanie
W ogólności znaczniki mogą również posiadać atrybuty które pozwalają wpływać i manipulować własnościami znaczników lub przenosić dodatkowe informacje:
Projektowanie aplikacji internetowych (zajęcia 6.03.2017 r.) Zajęcia: grupa 3: środa 16:00-17:30 Prowadzący: Dr inż. Marcin Zieliński marcin.zielinski@uj.edu.pl pokój: B-2-33 (Zakład Fizyki Jądrowej) konsultacje:
CSS. Gotowe rozwi¹zania
IDZ DO PRZYK ADOWY ROZDZIA SPIS TREœCI KATALOG KSI EK KATALOG ONLINE ZAMÓW DRUKOWANY KATALOG CSS. Gotowe rozwi¹zania Autor: Richard York T³umaczenie: ukasz Piwko ISBN: 83-246-0574-6 Tytu³ orygina³u: CSS
I. Dlaczego standardy kodowania mailingów są istotne?
1 Tabela zawartości: I. Dlaczego standardy kodowania mailingów są istotne? 3 II. Budowa nagłówka wiadomości. 4 III. Style kaskadowe CSS. 4 IV. Elementarna budowa szablonu. 6 V. Podsumowanie. 9 2 I. Dlaczego
Wykład 2 Tabele i ramki 1. Tabele 1.1. Podstawy budowy tabel na stronach WWW
Wykład 2 Tabele i ramki 1. Tabele 1.1. Podstawy budowy tabel na stronach WWW Rys.1. Przykład prostej tabeli zawierającej kalendarz na miesiąc marzec ... definiuje tabelę Atrybuty: border
Szablon główny (plik guestbook.php) będzie miał postać:
Skrypt: Księga gości Skrypt generujący księgę gości będzie się składał z trzech części: szablonu głównego, który należy zapisać pod nazwą guestbook.php, formularza służącego do dodawania wpisów, który
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
Na początku utworzymy formularz w czystym języku HTML i przetestujemy go za pomocą przeglądarki WWW.
Tematy: Przygotowanie formularza Przesyłanie danych przez formularz Mechanizm PostBack W rozdziale 1. pojawiła się prosta definicja strony WWW definicja ta określiła dynamiczną stronę WWW jako stronę,
I. Menu oparte o listę
I. Menu oparte o listę We wcześniejszych przykładach założyliśmy, że menu posiada tylko jeden poziom nawigacji. Czasem jednak jeden poziom nie wystarczy za pomocą list elementów oraz kaskadowych arkuszy
Programowanie WEB PODSTAWY HTML
Programowanie WEB PODSTAWY HTML Najprostsza strona HTML tytuł strony To jest moja pierwsza strona WWW. tytuł strony
APLIKACJE INTERNETOWE 3 CSS - W Y G L Ą D S T R O N Y I N T E R N E T O W E J
APLIKACJE INTERNETOWE 3 CSS - W Y G L Ą D S T R O N Y I N T E R N E T O W E J PLAN PREZENTACJI Wprowadzenie do css Budowa stylu - selektor cecha wartość Klasa i identyfikator selektora Jednostki Miary
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ą
Tworzenie Stron Internetowych. odcinek 9
Tworzenie Stron Internetowych odcinek 9 Prosta galeria oparta na HTML Najprostszym sposobem zbudowania galerii zdjęć jest wykorzystanie tylko HTML i CSS. Strona główna galerii składa się miniatur zdjęć,