Porównanie rozmiarów plików nieskompresowanych rysunków z uwzględnieniem różnych wymiarów i liczby kolorów obrazów. Wymiary (cm)
|
|
|
- Robert Król
- 7 lat temu
- Przeglądów:
Transkrypt
1 A. OBRAZY I MULTIMEDIA 1. METODY OKREŚLANIA KOLORÓW [R.33] Najczęściej używanymi właściwościami służącymi do określania kolorów elementów są: color oraz background-color. Działanie tych właściwości jest w pełni zgodne z ich nazwami- pierwsza z nich określa kolor pierwszoplanowy, a druga kolor tła. <p style="color: green; "> tekst wewnątrz danego akapitu będzie miało kolor zielony </p> <body style="background-color: blue;"> dokument zostanie wyświetlony na niebieskim tle background np. <body style="background-color: blue; "> border np. <img style="border:4px solid black; ".. > border-color np.<img style="border-color: white; ".. > outline - obrys outline-color kolor obrysu text-shadow zmiana koloru cienia tekstu 2. FORMATY GRAFICZNE STOSOWANE W DOKUMENTACH WWW Większość przeglądarek obsługuje przynajmniej trzy formy zapisu plików graficznych: GIF, JPEG, PNG. Standard GIF i JPEG stosowany jest od początku istnienia sieci WWW. KOMPRESJA OBRAZÓW rastrowych zmniejszenie rozmiaru plików graficznych poprzez zmniejszenie ich objętości. Kompresja może być bezstratna i stratna. Kompresja obrazów rastrowych wykonywana jest dlatego, że obrazy zapisane w 24- lub 32-bitowej głębi o dużej rozdzielczości zajmują dużo miejsca, co utrudnia przesyłanie ich pocztą elektroniczną, publikowanie w Internecie bądź zapisanie na różnego rodzaju nośnikach danych. Porównanie rozmiarów plików nieskompresowanych rysunków z uwzględnieniem różnych wymiarów i liczby kolorów obrazów. Wymiary (cm) Liczba kolorów Rozmiar pliku Wymiary (cm) Liczba kolorów Rozmiar pliku Wymiary (cm) Liczba kolorów Rozmiar pliku 2,5 x 2,5 2 9 kb 5 x kb 7,5 x 7, kb 2,5 x 2, kb 5 x kb 7,5 x 7, kb 2,5 x 2,5 16,7 mln 18 kb 5 x 5 16,7 mln 63 kb 7,5 x 7,5 16,7 mln 139 kb FORMAT GIF format 8-bitowy zapisujący maksymalnie 256 kolorów wykorzystywany do projektowania nagłówków, przycisków, pasków i prostej grafiki czyli elementów graficznych zawierających duże obszary o tym samym kolorze i niewielkiej liczbie szczegółów. niewielki rozmiar plików, umożliwia tworzenie grafiki transparentnej (przezroczystej np. przycisk owalny) możliwość stosowania przeplotu czyli wczytywania obrazu we fragmentach; redukcji palety kolorów FORMAT JPEG 24-bitowa paleta kolorów obraz tworzony jest jako czarno-biały a informacje o kolorach zapisywane są osobno kolory są analizowane i te niewidoczne dla oka zostają usunięte regulacja stopnia kompresji (zmniejszenie rozmiaru pliku); 24-bitowa paleta kolorów FORMAT PNG 48-bitowa paleta kolorów i 16-bitowa paleta odcieni szarości tworzenie grafik transparentnych, efektywny i bezstratny mechanizm kompresji
2 3. WSTAWIANIE OBRAZÓW ZDJĘĆ Za wyświetlanie pojedynczego obrazu na stronie odpowiada znacznik <img>, który nie ma znacznika zamykającego: <img src="adres pliku graficznego" alt="tekst alternatywny" hspace= x vspace= y /> <img src="pies.jpg" alt="zdjecie psa" hspace= 40 /> atrybut src służy do podania ścieżki dostępu do pliku wraz z jego nazwą i rozszerzeniem; atrybut alt określa teks alternatywny, który zostanie wyświetlony po najechaniu na obrazek. atrybuty hspace/vspace umożliwiają oddzielenie grafiki od innych elementów strony <img src="zdjecie.jpg" /> - wstawienie zdjęcie/obrazka/itd. <img src="zdjecie.jpg" border="1" /> - wstawienie zdjęcia w ramce o grubości 1 <img src="foto/zdjecie.jpg" border="1" /> - wstawienie zdjęcia z folderu foto w ramce o grubości 1 <img src="foto.jpg" width="100" height="200"/> wstawienie zdjęcia o szerokości 100 i wysokości 200 pikseli align (umieszczenie obrazka względem znajdującego się na stronie tekstu): left obrazek ustawiony po lewej stronie względem tekstu right obrazek ustawiony po prawej stronie względem tekstu top tekst ustawiony przy górnej części obrazka middle tekst ustawiony w środkowej części obrazka bottom tekst ustawiony na dole obrazka (domyślnie) Wymiary i skalowanie rysunków: height - wysokość width szerokość Definiując wymiar rysunku, należy pamiętać o poprawnym określeniu zarówno wysokości jak i szerokości (albo jednej z dwóch opcji). Zmiana proporcji spowoduje zniekształcenie obrazu. 4. ZNACZNIK RUCHOMY <MARQUEE> Ten znacznik już poznaliście. Omówiliśmy go wcześniej. 5. MUZYKA I MULTIMEDIA a) animowane obrazy Najprostszy rodzaj animacji, nie posiadają żadnej ścieżki dźwiękowej. Tworzone i wyświetlane na podstawie klatek (pojedynczych obrazów). Animacje obrazów zapisywane są w formacie GIF. b) pliki dźwiękowe Wymagają dodatkowych narzędzi w celu wyświetlenia ich, tzw. wtyczek (plug-in) bądź programów pomocniczych. <bgsound src="adres_url_pliku" loop="lb_odtworzeń" /> <bgsound> - odtwarzanie dźwięku w tle strony (rozszerzenie przeglądarki Internet Explorer i Opera) src ścieżka dostępu, loop liczba powtórzeń (infiniti nieskończoność), volume poziom głośności (od do 0), balance balans między głośnikami (od do ).
3 c) pliki multimedialne Wymagają dodatkowych narzędzi w celu wyświetlenia ich, tzw. wtyczek (plug-in) bądź programów pomocniczych. ROZSZERZENIE.wav.mid,.midi.avi.mp3.mpg,.mpeg.mov.wmv Formaty plików multimedialnych TYP PLIKU format plików dźwiękowych typu Wave Form Audio Format format plików dźwiękowych MIDI format plików wideo typu AVI format kompresji plików audio MP3 format plików wideo MPEG format związany z technologią QuickTime format plików wideo typu WMV <embed> - umieszczenie na stronie różnych plików multimedialnych (przestarzały, nie występuje w specyfikacji języka HTML 4.01, tak jak marquee) - obsługuje formaty plików: avi, mpeg, mp3, mid, wav, mov, asf, wma - jego zaletą jest współpraca w różnymi wtyczkami (niewielkie programy, które można doinstalować do przeglądarki) src ścieżka dostępu (jedyny wymagany atrybut), loop= type [true / false/ n] liczba powtórzeń [IE odtwarza w pętli!] playcount liczba powtórzeń [IE odtwarza prawidłowo :/], ma pierwszeństwo przed loop volume poziom głośności (od 0 i do 100 domyślnie 50), balance balans między głośnikami (od do ) dźwięk stereofonowy controls= rodzaj [console/ smallconsole/ playbutton/ pauseconsole/ stopbutton/ volumebutton] rodzaj wyświetlanego element sterującego (koniecznie z width i height) width i height określają obszar wyświetlania wtyczki autostart= type [true / false] określają sposób uruchamiania dźwięku <embed src= muzyka.aiff width= 25 height= 30 autostart= false pluginspage= QuickTime> - adres pod którym znajduje się niezbędne oprogramowanie do uruchomienia pliku multimedialnego. <p><embed src="don t_stop_me_now.mp3" autostart="true" volume="-10" pluginspage= QuickTime > <br/> <center> ZDJĘCIE WYKONAWCY/ALBUMU </center></embed> </p> plik z dźwiękiem proponuję wstawić na końcu strony by przeglądarka wczytała najpierw tekst i zdjęcia jeżeli się da to zastąp mp3 -> mid ODSYŁACZ DO PLIKU - zdefiniowanie odsyłaczy do plików - metoda ta działa w każdej przeglądarce i przy każdym formacie plików - po uruchomieniu linku automatycznie otworzy się okno z programem do obsługi danego pliku - brak wad związanych z poleceniami multimedialnymi -> otwiera się w nowej aplikacji użytkownik musi posiadać zainstalowany program do odczytu pliku. - < a href= plik.mp3 >Moja muza </a> - < a href= film.avi > <img src= obraz width= 60 height= 100 border= 0 alt= wyświetl film ></ a>
4 d) MULTIMEDIA W HTML 5 W HTML 5 do osadzania plików multimedialnych na stronie internetowej mogą zostać wykorzystane nowe znaczniki <audio> i <video>, które równocześnie dostarczają prostych odtwarzaczy dźwięku i wideo. Nie są potrzebne dodatkowe wtyczki. DŹWIĘKI I VIDEO <video> / <audio> [przeglądarka wybiera format obsługiwanego pliku] src ścieżka dostępu, ustalenie wysokości i szerokości wyświetlanego odtwarzacza poster ścieżka do obrazka, który będzie wyświetlany w trakcie ładowania filmu autoplay automatyczne odtwarzanie w trakcie ładowania controls wyświetlenie panelu sterowania wideo loop zapętlenie odtwarzania autobuffer automatyczne buforowanie wideo preload wczytanie wideo wraz z załadowaniem strony <!DOCTYPE HTML><html><head><title>FILM</title></head><body><video src= film.mp4 height= 500 width= 600 poster= obraz.png autoplay controls loop>znacznik nie jest obsługiwany! </video> </body></html> <!DOCTYPE HTML><html><head><title>MUZA</title></head><body><audio controls> <source src= muza.ogg type= audio/ogg /> <source src= muza.wav type= audio/wav /> Znacznik audio nie jest obsługiwany!</body></html> <video src= > PODSTAWOWY ODTWARZACZ VIDEO <audio src= > PODSTAWOWY ODTWARZACZ AUDIO <video> <source src= type= video/mp4; codecs="avc1.42e01e, mp4a.40.2 ' /> ODTWARZACZ WIELU FORMATÓW VIDEO <source src= type= video/ogg; codecs="theora, vorbis ' /> Pobierz plik w formacie: <a href="plik.mp4">mp4</a>, <a href="plik.ogv">ogv</a> </video> <canvas> - tworzenie grafiki rastrowej na stronie WWW w czasie rzeczywistym - definiuje prostokątny obszar (płótno), w którym tworzony jest rysunek - działanie oparte jest na renderingu trybu natychmiastowego czyli daje maksymalną kontrolę nad każdym pikselem obrazu, ale wymaga jawnego pisania kodu JavaScript rysującego grafikę - korzystanie jest pracochłonne rysuje prostokąty i ścieżki (linie, łuki, krzywe Beziera, krzywe drugiego stopnia) wypełnia figury kolorem, wzorem, gradientem rysuje napisy obsługuje przezroczystość przekształca (skaluje, obraca ) osadza obrazy rastrowe (PNG, JPEG, GIF) cieniuje PROSTOKĄT <canvas id= moja_kanwa width= 300 height= 200 > BRAK OBSŁUGI CANVAS </canvas> <script> var canvas = document.getelementbyid( moja_kanwa ); var context = canvas.getcontext( 2d ) ; context.fillstyle = red ; [kolor pędzla rysującego] context.fillrect (50,50,50,50) ; [wypełnienie kolorem] context.strokestyle= black ; [kolor pędzla rysującego] context.strokerect (40,40,70,70); [rysowanie krawędzi] </script>
5 <object> Innym sposobem umieszczania treści multimedialnych na stronach WWW jest zastosowanie znacznika <object>. Znacznik ten pozwala podać adres URL do pliku multimedialnego, a jednocześnie określić, jaki PLUGIN (odtwarzacz: Flash, RealOne, QuickTime, YouTube, Windows Media Player) będzie potrzebny do jego zaprezentowania. <object classid="clsid:d27cdb6e-ae6d-11cf-96b " codebase=" width="550" height="400" id="nazwaelementu"> <param name="movie" value="filmflash.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> </object> OSADZENIE FLASH Atrybut classid i codebase zawierają informacje określające, jaka wersja pluginu jest konieczna do odtworzenia pliku multimedialnego. W atrybucie codebase jest podany adres odpowiedniego pluginu, wraz z określeniem numeru wersji. Informacje zapisywane w tych atrybutach znajdujemy m.in. na stronach twórców technologii Flash. Można też utworzyć łącze do pliku multimedialnego (wtedy nie ładuje tak długo otwieranej strony). <a href="mojfilmflash.swf"> plik do ściągnięcia </a> Technika ta może być stosowana z powodzenie bo większość formatów plików multimedialnych może być obsługiwana przez programy już zainstalowane na komputerze użytkownika (wav, mpg, avi, aiff, itd.). Aby ułatwić zadanie przeglądarce warto określić typ pliku przy użyciu atrybutu type, np.: <a href="mojfilmflash.swf" type="application/x-shockwave-flash > plik do ściągnięcia </a> Atrybuty elementu <object> archive (opcjonalny) (HTML 4.01) Lista rozdzielonych spacjami adresów URL archiwów i klas objętych procedurą wstępnego pobierania. Zwiększa szybkość działania kodu classid (opcjonalny) (HTML 4.01) Określenie położenia danej implementacji obiektu za pomocą adresu URL. codebase (opcjonalny) (HTML 4.01) Określenie bazowego adresu URL dla ścieżki dostępu do obiektu. codetype (opcjonalny) (HTML 4.01) Określenie typu spodziewanych danych. data (opcjonalny) (HTML 4.01) Określenie położenia danych obiektu. height (opcjonalny) (HTML 4.01) Określenie wstępnej wysokości elementu, w px lub %. hspace (opcjonalny) (HTML 4.01) Określenie liczby px poziomego odstępu od innych elementów. id (opcjonalny) (HTML 4.01) (CSS) Formatowanie zawartości znacznika zgodnie ze stylem o danym identyfikatorze. name (opcjonalny) (HTML 4.01) Atrybut nazwy przypisywanej danemu elementowi. standby (opcjonalny) (HTML 4.01) Treść komunikatu wyświetlanego podczas oczekiwania na załadowanie obiektu. style (opcjonalny) (HTML 4.01) (CSS) Formatowanie zawartości znacznika zgodnie z regułami stylu zdefiniowanymi za pomocą tego atrybutu. type (opcjonalny) (HTML 4.01) Określenie typu zawartości elementu docelowego. vspace (opcjonalny) (HTML 4.01) Określenie liczby pikseli pionowego odstępu od innych elementów. width (opcjonalny) (HTML 4.01) Określenie wstępnej szerokości elementu, wyrażonej w pikselach lub %. Znacznik <embed> jest przestarzały, jednakże istnieje technika umieszczenia znacznika <embed> wewnątrz znacznika <object>. <object classid="clsid:d27cdb6e-ae6d-11cf-96b " codebase="
6 width="550" height="400" id="mojaanimacjaflash"> <param name="movie" value="animacjaflash.swf" /> ZAGNIEŻDŻENIE <EMBED> W <OBJECT> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <embed src="animacjaflash" bgcolor="#ffffff" width="550" height="400" name="mojaanimacjaflash" align=" " type="application/x-shockwave-flash" pluginspage=" </embed> </object> <object id="video" width="320" height="240" classid="clsid:6bf52a52 394A 11D3 B153 00C04F79FAA6" codebase=" standby="wczytujemy komponenty W M P.. " OSADZENIE ODTWARZACZA type="application/x-oleobject"> WINDOWS MEDIA PLAYER <param name="url" value="rozrywka.avi" /> <param name="sendplaystatechangeevents" value="true" /> <param name="autostart" value="true" /> <param name="uimode" value="mini" /> <param name="volume" value="20" /> <param name="currentposition" value="0" /> <param name="playcount" value="1" /> <embed type="application/x-mplayer2" pluginspage=" width="320" height="240" src= "rozrywka.avi" autostart="true" show controls="true" showstatusbar="false" showdisplay="false" autorewind="true"> </embed> </object>
Osadzenie pliku dźwiękowego na stronie www
Osadzenie pliku dźwiękowego na stronie www gdzie jako "ścieżka dostępu do pliku" należy podać lokalizację
Formaty obrazów wykorzystywane na stronach www. Dołączanie obrazów do strony Formatowanie obrazów na stronie Tło na stronie Multimedia
Grafika i multimedia na stronie Formaty obrazów wykorzystywane na stronach www. Dołączanie obrazów do strony Formatowanie obrazów na stronie Tło na stronie Multimedia Grafika na stronie HTML niezbędny
Multimedia i interfejsy. Ćwiczenie 5 HTML5
Multimedia i interfejsy Ćwiczenie 5 HTML5 Celem ćwiczenia jest poznanie nowych elementów wprowadzonych w HTML 5, do których należą m.in. video oraz canvas. Poniższy opis przedstawia sposób użycia tych
Ćwiczenie 5 Multimedia
Ćwiczenie 5 Multimedia W ćwiczeniu tym zajmujemy się multimediami i osadzaniem ich na stronach WWW. Poprzez multimedia rozumiemy pliki graficzne, muzyczne, video i inne ozdobniki umieszczone na stronie.
Multimedia w HTML5. Statyczne witryny internetowe 2TI/TOR. Marek Kwiatkowski
Multimedia w HTML5 Statyczne witryny internetowe 2TI/TOR Marek Kwiatkowski Cele lekcji: Poznanie zasady umieszczania plików multimedialnych w HTML5 Zrozumienie istoty stosowania nowych znaczników w HTML5
Formaty plików. graficznych, dźwiękowych, wideo
Formaty plików graficznych, dźwiękowych, wideo Spis treści: Wstęp: Co to jest format? Rodzaje formatów graficznych Właściwości formatów graficznych Porównanie formatów między sobą Formaty plików dźwiękowych
HTML (HyperText Markup Language) hipertekstowy język znaczników
HTML (HyperText Markup Language) hipertekstowy język znaczników Struktura dokumentu tytuł strony
Audio i Video w HTML5
Audio i Video w HTML5 http://www.asdala.de/netz/html/video.html Kiedyś
Multimedia. Plan wykładu/ów. Wstęp do HTML a. zastosowanie HTML a do tworzenia multimediów. podstawy HTML a Flash style JavaScript warstwy Java
Multimedia Wstęp do HTML a mgr inż. Piotr Odya piotrod@sound.eti.pg.gda.pl Plan wykładu/ów zastosowanie HTML a do tworzenia multimediów podstawy HTML a Flash style JavaScript warstwy Java 1 Trochę teorii
Proste kody html do szybkiego stosowania.
Proste kody html do szybkiego stosowania. Często, w trakcie pracy z blogiem czy portalem zachodzi potrzeba umieszczenia grafiki, linku zaszytego w grafice czy innych podobnych. Szczególnie w widgetach
HTML 1. Gimnazjum nr 1 w Barcinie gimbarcin.pl
HTML 1 Gimnazjum nr 1 w Barcinie UWAGA: UTWÓRZ FOLDER HTML, a w nim HTML-1 dla pierwszego ćwiczenia. Imię_ nazwisko_html-1.html z dysku J: w folderze HTML 1. Tło strony - Jednolity kolor:
Justyna Klimczyk j_klimczyk@poczta.onet.pl Nauczyciel informatyki Gimnazjum im. Władysława Stanisława Reymonta w Kleszczowie
Justyna Klimczyk j_klimczyk@poczta.onet.pl Nauczyciel informatyki Gimnazjum im. Władysława Stanisława Reymonta w Kleszczowie Scenariusz lekcji informatyki klasa II gimnazjum Temat : Strona WWW pierwsze
I. Wstawianie rysunków
I. Wstawianie rysunków Wstawiane rysunku Bez parametrów: Tekst alternatywny Tytuł obrazka
HTML5 Nowe znaczniki header nav article section aside footer
Specyfikacja HTML5 wprowadza nowe znaczniki pozwalające w łatwy i intuicyjny sposób budować szkielet strony, który przez zmniejszenie ilości kodu jest czytelniejszy i łatwiejszy w utrzymaniu, pozwala poza
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
zmiana koloru tła <body bgcolor = kolor > tło obrazkowe <body background= ścieżka dostępu do obrazka >
tytuł dokumentu treść dokumentu
Za pomocą atrybutu ROWS moŝemy dokonać podziału ekranu w poziomie. Odpowiedni kod powinien wyglądać następująco:
1 1. Ramki Najbardziej elastycznym sposobem budowania stron jest uŝycie ramek. Ułatwiają one nawigowanie w wielostronicowych dokumentach HTML, poprzez podział ekranu na kilka obszarów. KaŜdy z nich zawiera
Spis treści CZĘŚĆ I JĘZYK SIECI 17. Wstęp 13. Rozdział 1 Wprowadzenie do HTML5 19. Rozdział 2 Znajomość znaczników HTML5 37
Spis treści Wstęp 13 CZĘŚĆ I JĘZYK SIECI 17 Rozdział 1 Wprowadzenie do HTML5 19 Tworzenie przy pomocy znaczników: przegląd 20.Wprowadzanie nowych elementów HTML5 21 Korzystanie z kontynuowanych znaczników
ABC języka HTML i XHTML / Maria Sokół. wyd. 2. Gliwice, cop Spis treści
ABC języka HTML i XHTML / Maria Sokół. wyd. 2. Gliwice, cop. 2012 Spis treści Wstęp 9 1 HTML 5 i XHTML w pytaniach i odpowiedziach 13 Co to jest HTML 5? 13 Co to jest XHTML? 15 Czy strony utworzone w HTML
przygotował: mgr Szymon Szewczyk PODSTAWY
S t r o n a 1 PODSTAWY Każdy dokument musi być w całości zawarty między znacznikami - i (większość znaczników musi być odwołana ). Dokument HTML a składa się z dwóch części: - głowy
Odsyłacze. Style nagłówkowe
Odsyłacze ... polecenie odsyłcza do dokumentu wskazywanego przez url. Dodatkowym parametrem jest opcja TARGET="...", która wskazuje na miejsce otwarcia wskazywanego dokumentu, a jej parametrami
GRAFIKA RASTROWA. WYKŁAD 1 Wprowadzenie do grafiki rastrowej. Jacek Wiślicki Katedra Informatyki Stosowanej
GRAFIKA RASTROWA WYKŁAD 1 Wprowadzenie do grafiki rastrowej Jacek Wiślicki Katedra Informatyki Stosowanej Grafika rastrowa i wektorowa W grafice dwuwymiarowej wyróżnia się dwa rodzaje obrazów: rastrowe,
Co to jest dźwięk. Dźwięk to wyrażenie słuchowe wywołane przez falę akustyczną. Ludzki narząd wyłapuje dźwięki z częstotliwością 16 do 20 Hz
Dźwięk Co to jest dźwięk Dźwięk to wyrażenie słuchowe wywołane przez falę akustyczną. Ludzki narząd wyłapuje dźwięki z częstotliwością 16 do 20 Hz Próbkowanie Cyfrowy zapis dźwięku opiera się na procedurze
Rozdział 4. Multimedia
Rozdział 4. Multimedia Ćwiczenia zawarte w tym rozdziale pozwolą na wykorzystanie ogromnych moŝliwości multimedialnych systemu Windows XP. Większość narzędzi multimedialnych w Windows XP pochodzi z systemu
Wprowadzenie do języka HTML
Radosław Rudnicki (joix@mat.umk.pl) 05.09.2009 r. Wprowadzenie do języka HTML Do tworzenia stron internetowych wystarczy użyd zwykłego Notatnika oferowanego przez system Windows, czy dowolny inny system
E.14.1 Tworzenie stron internetowych / Krzysztof T. Czarkowski, Ilona Nowosad. Warszawa, Spis treści
E.14.1 Tworzenie stron internetowych / Krzysztof T. Czarkowski, Ilona Nowosad. Warszawa, 2014 Spis treści Przewodnik po podręczniku 8 Wstęp 10 1. Hipertekstowe języki znaczników 1.1. Elementy i znaczniki
HTML, CSS i JavaScript / Laura Lemay, Rafe Colburn, Jennifer Kyrnin. Gliwice, cop Spis treści
HTML, CSS i JavaScript / Laura Lemay, Rafe Colburn, Jennifer Kyrnin. Gliwice, cop. 2017 Spis treści O autorach 11 Wprowadzenie 13 CZĘŚĆ I ROZPOCZĘCIE PRACY Lekcja 1. Co oznacza publikowanie treści w sieci
Udostępnianie obrazu z kamer Sanyo HD na stronach WWW PORADNIK
PORADNIK Udostępnianie obrazu z kamer Sanyo HD na stronach WWW 1. Informacje wstępne Istnieje kilka sposobów wyświetlenia płynnego obrazu w formacie H.264 z kamer Sanyo z serii HD na dostępnych publicznie
Jak dodać własny szablon ramki w programie dibudka i dilustro
Aby dodać własną ramkę otwórz moduł administracyjny dibudkaadmin.exe, wejdź do zakładki Ramki, tła, id i następnie Edycja. 1. Kliknij przycisk Dodaj ramkę 2. Określ wymiary nowej ramki Jeżeli dodajesz
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
1. Wstęp Pierwsze uruchomienie Przygotowanie kompozycji Wybór kompozycji Edycja kompozycji...
Spis treści 1. Wstęp... 3 2. Pierwsze uruchomienie... 3 3. Przygotowanie kompozycji... 4 3.1. Wybór kompozycji... 4 3.2. Edycja kompozycji... 5 3.2.1. Dodawanie pliku Flash przygotowanie plików Flash...
SPECYFIKACJA TECHNICZNA FORM REKLAMOWYCH - INTERNET
SPECYFIKACJA TECHNICZNA FORM REKLAMOWYCH - INTERNET Rozmiar, waga, format reklam FORMA REKLAMOWA MAKSYMALNA WAGA ROZMIAR (px) FORMAT PLIKU Billboard 50 kb 750x100 gif, jpg, swf Double billboard 50 kb 750x200
Systemy internetowe HTML + CSS - dodatki
Systemy internetowe HTML + CSS - dodatki West Pomeranian University of Technology, Szczecin; Faculty of Computer Science HTML 5 Sekcja to tematyczna grupa treści (dane kontaktowe, materiały dydaktyczne,
Grafika w aplikacjach lp. Jak zmienić kolor tła?
Grafika w aplikacjach lp W tym rozdziale znajdziesz informacje jak osadzić w tworzonym programie zdjęcia, rysunki, wykresy i inne elementy graficzne. W środowisku lp autor ma dostęp do następujących obiektów
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
Specyfikacja techniczna formatów reklamowych w serwisach internetowych Wydawnictwa Te-Jot.
Specyfikacja techniczna formatów reklamowych w serwisach internetowych Wydawnictwa Te-Jot. Statystyki. Technologię mierzącą dostarcza Smart AdServer. Dopuszczalna różnica adserwerowa dla statystyk odsłon
FORMATY PLIKÓW GRAFICZNYCH
FORMATY PLIKÓW GRAFICZNYCH Różnice między nimi. Ich wady i zalety. Marta Łukasik Plan prezentacji Formaty plików graficznych Grafika wektorowa Grafika rastrowa GIF PNG JPG SAV FORMATY PLIKÓW GRAFICZNYCH
HTML (HyperText Markup Language)
HTML (HyperText Markup Language) Struktura dokumentu tytuł strony sekcja nagłówka Tutaj wpisujemy
Podstawowe znaczniki języka HTML.
Podstawowe znaczniki języka HTML. Struktura dokumentu. Sposób użycia i dokumentu. Między nimi umieszczana jest cała treść dokumentu. Sposób użycia Sekcja HEAD zawiera podstawowe
Dział O atrakcyjnym przedstawianiu i prezentowaniu informacji (program PowerPoint oraz język HTML tworzenie stron WWW)
Dział O atrakcyjnym przedstawianiu i prezentowaniu informacji (program PowerPoint oraz język HTML tworzenie stron WWW) Określa pojęcia dotyczące prezentacji. Projektuje i wykonuje prezentację multimedialną
Z CSS3 szybciej i przyjemniej
1 Z CSS3 szybciej i przyjemniej Marta Piasecka, 2 Zaokraglone--narozniki - 3 lub 4 elementy rysują tło - więcej kodu html - obrazki z narożnikami lub częściami tła - użytkownik widzi stronę bez tła dopóki
Cel ogólny lekcji: Wprowadzenie dodatkowych znaczników. Wprowadzenie odsyłacza, tabeli, listy numerowanej i wypunktowanej.
Piotr Chojnacki IV rok, informatyka chemiczna Liceum Ogólnokształcące Nr I we Wrocławiu Wrocław dn. 26 lutego 2006 roku Czas trwania zajęć: 90 minut, przedmiot: TI Temat lekcji: Tworzenie strony internetowej
Edycja strony: W edycję danej strony wchodzimy poprzez naciśnięcie opcji
Edycja strony: W edycję danej strony wchodzimy poprzez naciśnięcie opcji uzyskujemy widok: a. Wstawianie tekstów Tekst możemy wpisywać bezpośrednio w panelu lub wklejać do edytora. Jeśli wklejamy tekst
Okna dialogowe ustawień konfiguracyjnych
Zadania z luką 1. Utwórz folder dla nowego ćwiczenia i uruchom moduł JCloze. 2. Kliknij w ikonę by zapisać plik ćwiczenia. Nadaj mu nazwę (najlepiej bez polskich znaków) i zapisz w folderze ćwiczenia.
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
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:
WYMAGANIA EDUKACYJNE. Witryny i Aplikacje Internetowe klasa I
WYMAGANIA EDUKACYJNE Witryny i Aplikacje Internetowe klasa I Dopuszczający definiuje pojęcia: witryna, portal, wortal, struktura witryny internetowej; opisuje rodzaje grafiki statycznej wymienia i charakteryzuje
Specyfikacja techniczna form reklamowych do umieszczenia na stronie
Specyfikacja techniczna form reklamowych do umieszczenia na stronie www.olsztyn.tvp.pl (ważna od 1 lipca 2017 r.) Postanowienia ogólne Wszystkie formy reklamowe przeznaczone do emisji na stronie www.olsztyn.tvp.pl
Platforma szkoleniowa krok po kroku
Platforma szkoleniowa krok po kroku Jeśli masz problemy z uruchomieniem Platformy szkoleniowej warto sprawdzić poprawność poniższych konfiguracji: Minimalne wymagania sprzętowe SPRZĘT Procesor min. 233
Wstawianie grafiki. Po wstawieniu grafiki, za pomocą znaczników możemy zmienić wielkość i położenie grafiki na slajdzie.
Wstawianie grafiki Aby wstawić grafikę do prezentacji należy z górnego menu wybrać polecenie Wstaw Obraz, a następnie wskazać miejsce gdzie jest zapisana grafika Po wstawieniu grafiki, za pomocą znaczników
REKLAMA INTERNETOWA WYMAGANIA TECHNICZNE
WYMAGANIA TECHNICZNE y form reklamowych dostępnych w serwisach www.gazetaolsztynska.pl i wm.pl SPIS TREŚCI 3 SPIS TREŚCI Zasady ogólne...................................str. 4 1. Baner tradycyjny................................str.
Przy wstawianiu znacznika zamykającego nie przepisujemy już atrybutów.
JĘZYK - HTML Hipertekst - możliwośd przechodzenia między różnymi fragmentami tego samego lub różnych dokumentów, które zostały ze sobą powiązane. Jest systemem odnośników (tzw. Skrótów), działających na
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ść
Zajęcia nr 15 JavaScript wprowadzenie do JavaScript
Zajęcia nr 15 JavaScript wprowadzenie do JavaScript Prowadzący: Andrzej Gąsienica-Samek, strona kółka www.atinea.pl/kolko Wprowadzenie do jsfiddle.net Uruchom Chrome i wejdź na stronę http://jsfiddle.net.
OPIS FORM REKLAMOWYCH
OPIS FORM REKLAMOWYCH : KATARZYNA PIĄTEK 600-25-33-25 REKLAMA@DDWLOCLAWEK.PL OPIS ZAWARTOŚCI 1. BILLBOARD 2. BILLBOARD PODSTRONA 3. BILLBOARD ROZWIJANY 4. BILLBOARD PŁYWAJĄCY 5. PODWÓJNY BILLBOARD 6. BANNER
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ć
INTERAKTYWNA KOMUNIKACJA WIZUALNA. Flash - podstawy
INTERAKTYWNA KOMUNIKACJA WIZUALNA Flash - podstawy Adobe Flash (dawniej Macromedia Flash) program komputerowy, technologia tworzenia animacji z wykorzystaniem grafiki wektorowej. Powstałe pliki *.swf można
Formaty plików graficznych
Formaty plików graficznych grafika rastowa grafika wektorowa Grafika rastrowa Grafika rastrowa służy do zapisywania zdjęć i realistycznych obrazów Jakość obrazka rastrowego jest określana przez całkowitą
Aplikacje internetowe
Aplikacje internetowe HTML 5 Wprowadzenie Autor Roman Simiński Kontakt roman.siminski@us.edu.pl www.siminskionline.pl Niniejsze opracowanie zawiera skrót treści wykładu, lektura tych materiałów nie zastąpi
Część II Wyświetlanie obrazów
Tło fragmentu ABA-X Display jest wyposażony w mechanizm automatycznego tworzenia tła fragmentu. Najprościej można to wykonać za pomocą skryptu tlo.sh: Składnia: tlo.sh numer oznacza numer
Formy reklamowe. Specyfikacja techniczna
Formy reklamowe Specyfikacja techniczna Spis treści SPIS TREŚCI...1 OGÓLNE ZASADY DOTYCZĄCE KREACJI REKLAMOWYCH WYKONANYCH W TECHNOLOGII MACROMEDIA FLASH....3 1. BILLBOARD...4 1.1 BILLBOARD STATYCZNY...4
Księgarnia internetowa Lubię to!» Nasza społeczność
Kup książkę Poleć książkę Oceń książkę Księgarnia internetowa Lubię to!» Nasza społeczność Spis treści Rozdział 1. Zastosowanie komputera w życiu codziennym... 5 Rozdział 2. Elementy zestawu komputerowego...13
URL: http://www.ecdl.pl
Syllabus WEBSTARTER wersja 1.0 Polskie Towarzystwo Informatyczne 2007 Copyright wersji angielskiej: Copyright wersji polskiej: The European Computer Driving Licence Foundation Ltd. Polskie Towarzystwo
Wyświetlanie publikacji w formacie DjVu. Wyświetlanie publikacji w Bałtyckiej Bibliotece Cyfrowej można realizować na 3 sposoby:
Wyświetlanie publikacji w formacie DjVu Wyświetlanie publikacji w Bałtyckiej Bibliotece Cyfrowej można realizować na 3 sposoby: 1. Za pomocą wbudowanego apletu DjVu (na komputerze wymagana jest Java).
Kompresja obrazów i formaty plików graficznych
Kompresja obrazów i formaty plików graficznych Kompresja obrazów Obrazy zapisywane w 24 lub 32-bitowej głębi kolorów o dużej rozdzielczości zajmują dużo miejsca. Utrudnia to przesyłanie ich pocztą elektroniczną,
Sigplus. Galeria w Joomla
Sigplus Galeria w Joomla Cel prezentacji Pokazanie że Sigplus jest prosty w konfiguracji; Metody konfiguracji Sigplusa; Jest jednym z najczęściej używanych dodatków w tworzeniu galerii na stronie internetowej
Grafika rastrowa (bitmapa)-
Grafika komputerowa Grafika rastrowa Grafika rastrowa (bitmapa)- sposób zapisu obrazów w postaci prostokątnej tablicy wartości, opisujących kolory poszczególnych punktów obrazu (prostokątów składowych).
Specyfikacja techniczna form reklamowych
Specyfikacja techniczna form reklamowych www.olsztyn.tvp.pl Rozmiar, waga, format reklam Forma reklamowa Maksymalna waga Rozmiar [px] Format pliku Billboard 50 kb 750x100 gif, jpg, swf Double billboard
Programowanie WEB PODSTAWY HTML
Programowanie WEB PODSTAWY HTML Najprostsza strona HTML tytuł strony To jest moja pierwsza strona WWW. tytuł strony
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
Pierwsza strona internetowa
HTML i CSS Pierwsza strona internetowa Rozpoczynając pracę na swoim komputerze powinieneś posiadać: dowolny edytor tekstowy (np. Notatnik), dostęp do Internetu, Microsoft Visual Studio. Podstawy formatowania
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
Widżety KIWIPortal. tworzenie umieszczanie na stronach internetowych opcje zaawansowane. Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.
Widżety KIWIPortal tworzenie umieszczanie na stronach internetowych opcje zaawansowane Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.3 Strona 1 z 17 1 SPIS TREŚCI 2 Metody osadzania widżetów... 3 2.1
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
Instrukcja obsługi funkcji specjalnych szablonu C01 v.1.0
Instrukcja obsługi funkcji specjalnych szablonu C01 v.1.0 UWAGA 1: Przed dokonaniem jakichkolwiek zmian, zalecamy skopiować wcześniej kod html modułu do pliku na lokalnym dysku. W przypadku problemów ułatwi
PROBLEMY TECHNICZNE. Co zrobić, gdy natrafię na problemy związane z użytkowaniem programu DYSONANS
PROBLEMY TECHNICZNE Co zrobić, gdy natrafię na problemy związane z użytkowaniem programu DYSONANS Jeżeli stwierdziłeś występowanie błędów lub problemów podczas pracy z programem DYSONANS możesz skorzystać
Wirtualne Klasy. Kontakt: Izabela Trojan, Tel: Fax:
Kontakt: Izabela Trojan, izabela.trojan@jpalio.com jpalio SA ul. Joteyki 20 02-317 Warszawa Tel: +48 22 424 87 88 Fax: +48 22 313 23 37 www.jpalio.com Tradycyjny model nauczania, wymagający fizycznej obecności
Cała prawda o plikach grafiki rastrowej
~ 1 ~ Cała prawda o plikach grafiki rastrowej Grafika rastrowa to rodzaj grafiki zapisywanej na dysku w postaci bitmapy, czyli zbioru pikseli. W edytorach grafiki rastrowej możliwa jest edycja na poziomie
Prezentacja multimedialna MS PowerPoint 2010 (podstawy)
Prezentacja multimedialna MS PowerPoint 2010 (podstawy) Cz. 2. Wstawianie obiektów do slajdu Do slajdów w naszej prezentacji możemy wstawić różne obiekty (obraz, dźwięk, multimedia, elementy ozdobne),
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
Opis Edytora postaci Logomocji
Opis Edytora postaci Logomocji Przyciski na pasku narzędzi Przyciski Wygląd Opis W Edytorze postaci można otwierać pliki o rozszerzeniach: Otwórz plik postaci lgf (plik Edytora postaci), imp (plik projektu
Konfiguracja szablonu i wystawienie pierwszej aukcji allegro
Konfiguracja szablonu i wystawienie pierwszej aukcji allegro Metod na wystawienie aukcji na allegro jest co najmniej 2. W pierwszej przechodzimy do zakładki MOJA SPRZEDAŻ, w USTAWIENIACH SPRZEDAŻY odnajdujemy
Rodzaje plików. Podstawowe definicje.
Rodzaje plików. Podstawowe definicje. Mariusz Tokarski Zagadnienia Zarządzanie plikami w systemie Windows Definicja pliku Opcje folderów Programy domyślne Współdzielenie plików przez programy Podstawowe
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
Specyfikacja techniczna form reklamowych
Specyfikacja techniczna form reklamowych Wymagania Ogólne... 3 Standardowe Formy Reklamy... 4 Banner... 4 Billboard... 4 Leaderboard... 4 Medium Rectangle... 4 Skyscraper... 4 Double Billboard... 4 Large
Tematy lekcji informatyki klasa 4a styczeń 2013
Tematy lekcji informatyki klasa 4a styczeń 2013 temat 7. z podręcznika (str. 70-72); sztuczki 4. i 5. (str. 78); Narysuj ikony narzędzi do zaznaczania i opisz je. 19 Zaznaczamy fragment rysunku i przenosimy
Pokaz slajdów na stronie internetowej
Pokaz slajdów na stronie internetowej... 1 Podpisy pod zdjęciami... 3 Publikacja pokazu slajdów w Internecie... 4 Generator strony Uczelni... 4 Funkcje dla zaawansowanych użytkowników... 5 Zmiana kolorów
Scenariusz lekcji. Scenariusz lekcji. opisać działanie narzędzi przybornika. korzystać z Edytora postaci programu Logomocja;
Kolorowe neony Scenariusz lekcji Scenariusz lekcji 1 TEMAT LEKCJI: Kolorowe neony 2 CELE LEKCJI: 2.1 Wiadomości: Uczeń potrafi: opisać sposób tworzenia animacji; wyjaśnić pojęcie klatka ; opisać działanie
Wstawianie filmu i odtwarzanie go automatycznie
Wstawianie filmu (pliku wideo) w programie PowerPoint 2003 i wyświetlanie go na pełnym ekranie Ten artykuł dotyczy odtwarzania filmów (nazywanych także plikami wideo) i opisuje sposób wykonywania następujących
Dostępne nośniki reklamowe
Dostępne nośniki reklamowe Nazwa Wymiar (px) Waga Format Billboard 750x100 40 kb gif, jpg, swf Doublebillboard 750x200 40 kb gif, jpg, swf Widebillboard 950x200 50 kb gif, jpg, swf Skyscraper 120x600 40
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
MODUŁ AM6: GRAFIKA MENEDŻERSKA
ECDL ADVANCED ECDL-A EUROPEJSKI CERTYFIKAT UMIEJĘTNOŚCI KOMPUTEROWYCH POZIOM ZAAWANSOWANY MODUŁ AM6: GRAFIKA MENEDŻERSKA I PREZENTACYJNA Syllabus v. 1.0 Oficjalna wersja dokumentu jest dostępna w serwisie
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
Reklama w serwisie muno.pl formy, warunki emisji. 2011 BPM Media Sp. z o.o.
Reklama w serwisie muno.pl formy, warunki emisji Podstawowe formy graficzne 300x38 Navibanner Navibanner: graficzny element reklamowy umieszczany w prawej części strony serwisu Rozmiar: 300 x 38 pikseli
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
Wstawianie nowej strony
Wstawianie nowej strony W obszernych dokumentach będziemy spotykali się z potrzebą dzielenia dokumentu na części. Czynność tę wykorzystujemy np.. do rozpoczęcia pisania nowego rozdziału na kolejnej stronie.
Specyfikacja techniczna
Specyfikacja techniczna Informacje wstępne Grupa Melog.com sp. z o.o Morizon SA nie ponosi odpowiedzialności finansowej w przypadku gdy klient nie dostarczy poprawionej wersji kreacji lub nie spełnia ona
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:
która metoda jest najlepsza
która metoda jest najlepsza dr inż. Marek Żabka Instytut Matematyki Wydział Matematyki Stosowanej Politechnika Śląska 20 września 2012r Nowa metoda tworzenia grafiki na stronie internetowej: element,,canvas
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