Studia Podyplomowe Grafika komputerowa i Techniki Multimedialne, 2015, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW.

Wielkość: px
Rozpocząć pokaz od strony:

Download "Studia Podyplomowe Grafika komputerowa i Techniki Multimedialne, 2015, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW."

Transkrypt

1 Ćwiczenie 2 Kaskadowe arkusze stylów CSS. Budowanie makiety strony i jej modyfikacja dr inż. Robert Banasiak 1

2 Materiały ćwiczeniowe Wszelkie materiały ćwiczeniowe: wykłady, instrukcje oraz pliki ćwiczeniowe do niniejszych zajęć z projektowania stron WWW są dostępne w trakcie zajęć na stronie WWW prowadzącego: w zakładce Grafika Komputerowa. Pamiętajmy o częstym zapisywaniu rezultatów swojej pracy!!! Plan ćwiczeń W trakcie tego ćwiczenia zapoznacie się Państwo z zaawansowanymi możliwościami tworzenia i stosowania kaskadowych arkuszy stylów CSS. A w szczególności jak: tworzyć elementy układu (makiety) strony i dołączać do nich arkusze stylów CSS; definiować reguły CSS dla określonych fragmentów projektu; definiować reguły CSS do znaczników <div>; umieszczać tekstu oraz obrazów zastępczych; eksportować reguły CSS do zewnętrznego arkusza stylów; Ćwiczenie : Tworzymy nowy układ (makietę, szablon) strony Nowoczesne serwisy internetowe bardzo często projektowane są (dla przypomnienia ) przy użyciu stylów CSS. Struktura oparta na modelu pudełkowym oraz regułach CSS jest mniej skomplikowana i łatwiejsza do zarządzania niż analogiczny projekt oparty o przestarzałe już (zdeprecjonowane w specyfikacji HTML5) ramki. Ponadto projekty oparte na stylach CSS są zgodne z obowiązującymi aktualnie standardami stosowanymi w Internecie. Projekt makiety CSS strony internetowej, który realizuje model pudełkowy CSS, składa się z dwóch głównych składników: sekwencji znaczników HTML zazwyczaj są to specjalne znaczniki <div> - które stanowią główny budulec projektu; zestawu reguł CSS, określających parametry i format najważniejszych elementów strony, dzięki czemu strona posiada określony przez nas, funkcjonalny i ciekawy wygląd. Aby stworzyć podstawę do zbudowania makiety strony WWW musimy najpierw wykonać następujące kroki: 1. Tworzymy nowy serwis o nazwie Makieta (musimy jak zwykle pamiętać o zbudowaniu właściwej struktury katalogów wraz z katalogiem Obrazy); 2. Następnie tworzymy nowy pusty dokument html (typ strony: HTML, Typ dokumentu: HTML5, układ: brak), następnie klikamy Utwórz; 3. Otwieramy panel style CSS i dodajemy nową regułę CSS i jej selektor o nazwie body (typ selektora: Znacznik (pozwala przedefiniować element HTML). Zatwierdzamy. 4. W oknie właściwości selektora ustawiamy kolor tła dla selektora body jako biały; w sekcji Blok -> Textalign -> center; w sekcji Pole ustawiamy w sekcji Padding (odstęp wewnętrzny) -> Top -> 0 i zaznaczamy (jeżeli nie jest zaznaczone) To samo dla wszystkich; Analogicznie jak dla Padding ustawiamy dla opcji Margin (margines); 2

3 Kolejnym naszym krokiem będzie zbudowanie pojemnika głównego (kontenera głównego) makiety, w którym pojawią się wszystkie jej elementy czyli cała struktura naszej strony WWW. W ten sposób wykorzystamy jedną najpopularniejszych technik tworzenia serwisów WWW polegającą na wstawieniu nadrzędnego znacznika <div>, który będzie zawierał wszystkie pozostałe znaczniki wraz z ich treścią. Nadrzędny znacznik <div> nosi, jak już wcześniej wspomniałem, nazwę pojemnika strony (znany Państwu z poprzednich zajęć styl wbudowany o nazwie container, który zawiera odpowiednią regułę i jej selektor). Zadeklarowanie takiego znacznika, obejmującego swoim zasięgiem całą zawartość strony WWW, pozwala zdefiniować pewne ogólne właściwości wszystkich elementów tej strony, na przykład takie jak jej szerokość czy wyrównanie tekstu. Naszym zadaniem będzie teraz zdefiniowanie takich właściwości w ramach nowych reguł CSS. Dla tych reguł utworzymy również szereg znaczników <div> określających poszczególne elementy strony takie jak nagłówek czy zawartość główna. Zaczniemy od stworzenia reguły określającej dla nas formatowanie tworzonego głównego kontenera strony. W tym celu tworzymy nową regułę CSS opartą na selektorze ID (typ selektora: Identyfikator dotyczy tylko jednego elementu HTML) o nazwie: #wrapper (krzyżyk w nazwie selektora oznacza, iż w obrębie danej strony może on być użyty tylko raz co jest oczywiście skrupulatnie pilnowane przez Dreamweavera). 1. W kategorii blok wybierz opcję Text-align i ustaw wartość na left. 2. W kategorii pole ustaw width= 984 (wartość optymalna dla stron o rozdzielczości 1024x768), 3. W sekcji Margin ustaw Top=0, Right=auto, Bottom=0, Left=auto. 4. Zatwierdź konfigurację selektora #wrapper. 5. Kliknij ikonę Znacznik DIV: 6. Gdy na ekranie pojawi się okno dialogowe Wstaw znacznik DIV: Wybierz z listy opcji ID: nazwę selektora #wrapper, jeżeli to konieczne wybierz z listy opcji Wstaw: Po początku znacznika (po prawej stronie wyświetli się <body>) i naciśnij OK. Efektem tych działań będzie pusty kontener o nazwie #wrapper, wycentrowany na środku strony i wypełniony domyślnym tekstem: Tu znajdzie się zawartość id "wrapper". 7. Naciśnij klawisz F4 w celu ukrycia wszystkich widocznych paneli edycyjnych i zobaczenia pełnej strony wraz z utworzonym kontenerem. Ponowne naciśnięcie klawisza F4 przywraca widzialność paneli edycyjnych. Utworzony znacznik <div> z selektorem formatującym #wrapper służy raczej jako pojemnik dla innych znaczników typu <div> nie zaś dla tekstu czy grafiki. Jednocześnie używa się go również do wymuszania docelowej szerokości układu serwisu WWW. 3

4 No cóż. główny znacznik już zdefiniowaliśmy, przejdźmy zatem do definicji właściwego szkieletu strony WWW, dzieląc go na kilka zasadniczych części: nagłówek, treść oraz stopkę. Każda z tych części wymaga zdefiniowania selektora i reguły CSS oraz wstawienia osobnego znacznika <div>. Zbudujmy zatem w pierwszej kolejności nagłówek (#header), następnie treść (#content) oraz stopkę (#footer). W tym celu: 1. Tworzymy nową regułę wraz z jej selektorem CSS o identyfikatorze ID: #header (typ selektora: Identyfikator dotyczy tylko jednego elementu HTML) proszę zwrócić uwagę na ustawienie opcji zaznaczonych kropkowanymi prostokątami na poniższej ilustracji. 2. Definiujemy regułę dla selektora #header według następujących wytycznych: zakładka Pole, wyłączmy Jednakowy dla wszystkich w sekcji Margin, ustawmy Top=12, Bottom=12, pozostałe pola zostawiamy puste; 3. Tworzymy nową regułę (i jej selektor) CSS o identyfikatorze ID: #content; 4. Definiujemy regułę dla selektora #content według następujących wytycznych: zakładka Pole, wyłączmy Jednakowy dla wszystkich w sekcji Padding, Top=0, pozostałe pola zostawiamy puste; 5. Analogicznie skonfigurujmy sekcję Margin. Ćwiczenie do samodzielnego zrealizowania: Korzystając z trybu Kod (lub Kod i Projekt -> zakładka Podziel) napisz kod dodający do arkusza stylów selektor #footer oraz jego regułę. Konfiguracja reguły będzie niemal identyczna jak w przypadku selektora #header. Jedyną zmianą będzie dopisanie reguły dbającej o to, by żadne inne tzw. pływające elementy strony nie kolidowały nam ze stopką. W tym celu ustawiamy zmienną clear na wartość both -> clear: both. Dodatkowo w ramach tego ćwiczenia można zapoznać się z ciekawym systemem podpowiedzi konfiguratora reguły CSS. Nadal pamiętajmy o częstym zapisywaniu rezultatów swojej pracy poprzez opcję Zapisz wszystko. W kolejnym ćwiczeniu do zbudowanych powyżej reguł CSS dla nagłówka, treści strony i stopki, wstawimy i przypiszemy odpowiednie znaczniki <div>. 1. Kasujemy tekst zastępczy w kontenerze #wrapper. 2. Header: wstawiamy nowy znacznik <div> (patrz str. 4 punkt 6): wybieramy opcję Wstaw -> Po początku znacznika, z sąsiadującej listy wybieramy <div id= wrapper >, a z listy ID wybieramy nazwę selektora 4

5 header. Naciskamy OK. Taka konfiguracja gwarantuje nam, iż nasz selektor zadziała wewnątrz kontenera wrapper. Zobaczmy jak wygląda kod źródłowy tej operacji: <body> <div id="wrapper"> <div id="header">tu znajdzie się zawartość id "header"</div> </div> </body> Jak widać zostało dokonane zagnieżdżenie jednego znacznika <div> w drugim. 3. W przypadku elementu strony WWW przechowującego główną treść o nazwie ID: content: wstawiamy nowy znacznik <div>: tym razem wybieramy opcję Wstaw -> Po znaczniku, z sąsiadującej listy wybieramy <div id= header >, a z listy ID wybieramy nazwę selektora content. Ćwiczenie do samodzielnego zrealizowania: Korzystając z trybu Kod (lub Podziel) napisz kod CSS/HTML dodający do naszego serwisu nowy znacznik <div> dla selektora #footer, odpowiednio go zagnieżdżając względem pozostałych znaczników <div> w strukturze serwisu tj. ustaw znacznik <div> dla #footer po znaczniku <div> dla #content. Ćwiczenie: Rozbudowujemy nowy układ strony W kolejnym ćwiczeniu spróbujemy rozbudować otrzymaną dotychczas ogólną strukturę serwisu, umieszczając w niej kilka znacznie bardziej ukierunkowanych elementów. W tym ćwiczeniu do naszej strony dodamy pojemnik na logo strony, pojemnik na panel nawigacyjny oraz pojemnik na baner reklamowy. Pamiętajmy o częstym zapisywaniu rezultatów swojej pracy poprzez opcję Zapisz wszystko. 1. Dodaj nowe reguły CSS dla selektora o ID: #logo, #nav oraz #banner. a. W konfiguracji reguły #logo ustaw w zakładce Pole -> Wysokość (height) na 71, wyłącz opcje Jednakowy dla wszystkich w sekcji Padding i wpisz 12 w polu Bottom. Pozostałe pola pozostaw puste; b. W konfiguracji reguły #nav ustaw w zakładce Pole -> Wysokość (height) na 28. Pozostałe pola pozostaw puste; c. W konfiguracji reguły #banner ustaw w zakładce Pole -> Wysokość (height) na 200. Pozostałe pola pozostaw puste. 2. Wstaw odpowiednio i we właściwej kolejności znaczniki <div> zagnieżdżając je wewnątrz kontenera header (korzystając z trybu Projekt lub trybu Kod) tak by uzyskać następujący układ makiety strony WWW: 5

6 Ćwiczenie 4: Dodajemy bloki tekstu w pojemniku #content Kolejny etap prac będzie polegał na podzieleniu treści strony na dwie kolumny. W tym celu należy zdefiniować odpowiednie reguły CSS i ich selektory dla tych kolumn. 1. Tworzymy nową regułę CSS dla kolumny lewej o nazwie ID: #leftcolumn; 2. W zakładce (kategorii) Pole wprowadź szerokość = (szerokość głównego kontenera / 2) 2*15 (dwa odstępy poziome po 15 pikseli) czyli w naszym przypadku będzie to.??? ; 3. Ustaw pole Float na left dzięki czemu nasz kolumna #leftcolumn będzie z lewej strony; 4. Utwórz regułę CSS dla kolumny prawej o nazwie ID: #rightcolumn korzystając z trybu Kod. Ustaw pole float na right. Szerokość #rightcolumn identyczna jak w przypadku #leftcolumn. 5. Utwórz odpowiednie znaczniki <div> zagnieżdżając je: znacznik dla #leftcolumn po początku znacznika #content a znacznik <div> dla #rightcolumn po znaczniku #leftcolumn. Zadanie można wykonać zarówno w trybie Projekt jak i Kod. 6. Wynik działania tej procedury powinien przypominać poniższą ilustrację: Ćwiczenie : Wstawiamy elementy zastępcze do makiety strony. 1. Zaznaczamy tekst Tu znajdzie się zawartość id "logo", kasujemy go i w to miejsce wstawiamy obraz zastępczy o wymiarach 984x71 nadając mu nazwę Logo; 2. Zaznaczamy tekst Tu znajdzie się zawartość id "nav", kasujemy go i w to miejsce wstawiamy obraz zastępczy o wymiarach 984x28 nadając mu nazwę Nav; 3. Zaznaczamy tekst Tu znajdzie się zawartość id "banner", kasujemy go i w to miejsce wstawiamy obraz zastępczy o wymiarach 984x200 nadając mu nazwę Banner; 4. Umieszczamy kursor w treści napisu Tu znajdzie się zawartość id "leftcolumn", następnie klikamy na znacznik <div #leftcolumn> w dolnym pasku stanu na liście znaczników. Następnie naciskamy strzałkę w lewo aby przenieść kursor pomiędzy znacznikami #content <div> a #leftcolumn <div>. Wpisujemy tekst: Nagłówek 1 i formatujemy ten tekst jako Nagłówek 1 korzystając z panelu właściwości HTML. 6

7 5. Zaznaczamy tekst zastępczy Tu znajdzie się zawartość id "leftcolumn" i wpisujemy słowo Nagłówek 2. Formatujemy go jako Nagłówek 2. Ustawiamy się na końcu napisu Nagłówek 2 i wpisujemy jakiś dowolny tekst tak by zajmował około 6 linii, rozdzielając kolejne linie Enterami przy końcu pojemnika lewej kolumny; 6. Zamieśćmy ten sam tekst w prawej kolumnie: ustawmy się w treści akapitu, który właśnie został stworzony, wybierzmy z menu Edycja -> Zaznacz wszystko. Następnie Ctrl+C (kopiuj). Zaznaczmy tekst Tu znajdzie się zawartość id "rightcolumn" i naciśnijmy Ctrl + V. 7. Końcowy efekt Państwa działań powinien być zbliżony do poniższego: Ćwiczenie do samodzielnego zrealizowania (w miarę możliwości czasowych ). Korzystając z tak przygotowanego szablonu: 1. Opracuj na jego bazie prostą stronę WWW na dowolny temat; 2. Wypełnij ją dowolnym, wybranym przez siebie tekstem; 3. Obrazy zastępcze przekształć na prawdziwe obrazy (Photoshop, Grafika Google); 4. Zmodyfikuj ogólna kolorystykę strony według własnego pomysłu; 5. Wyeksportuj style do zewnętrznego pliku; Ćwiczenie do samodzielnego zrealizowania (w miarę dalszych możliwości czasowych ). Zbuduj od podstaw samodzielnie szablon według podanych poniżej wytycznych: 1. Szablon składa się z następujących 6 elementów: container (kontener), header (nagłówek), footer (stopka), sidebar1 (panel lewy), sidebar2 (panel prawy), maincontent (panel środkowy); 2. Tło element body -> białe; 3. Komponent container powinien być zagnieżdżony wewnątrz body: rozmiary komponentu container (szerokość: 1024 px, wysokość zmienna), wycentrowany na środku ekranu przeglądarki; 7

8 4. header powinien być zagnieżdżony w komponencie container, wysokość 80px, szerokość dopasowana do szerokości komponentu container, ustawienie: górna krawędź komponentu container (marginesy górny i dolny -> według uznania); 5. footer powinien być zagnieżdżony w komponencie container, wysokość 40px, szerokość dopasowana do szerokości komponentu container, ustawienie: dolna krawędź komponentu container (marginesy górny i dolny -> według uznania); 6. sidebar1 powinien być zagnieżdżony w komponencie container, wysokość dopasowana do zawartości -> tekstu i grafik, szerokość 180px, ustawienie: lewa krawędź komponentu container (marginesy górny i dolny - > według uznania); 7. sidebar2 powinien być zagnieżdżony w komponencie container, wysokość dopasowana do zawartości -> tekstu i grafik, szerokość 280px, ustawienie: prawa krawędź komponentu container (marginesy lewy i prawy -> według uznania); 8. maincontent powinien być zagnieżdżony w komponencie container, pomiędzy komponentami Sidebar1 i Sidebar2, wysokość dopasowana do zawartości -> tekstu i grafik, szerokość 280px, ustawienie: prawa krawędź komponentu container (marginesy lewy i prawy -> według uznania); 9. Odstępy wewnętrzne we wszystkich elementach według uznania; 10. Ilustracja poglądowa przygotowywanego szablonu CSS (rzeczywiste proporcje komponentów będą nieco inne): 11. Korzystając z kolorowej wersji instrukcji dostępnej na stronie WWW prowadzącego można skonfigurować kolory tła takie jak prezentuje ilustracja poglądowa w punkcie 9) > kolory oczywiście można również zastosować własne - według uznania; 12. Po zbudowanie szablonu należy sprawdzić jego poprawność wyświetlania w przeglądarce Mozilla Firefox Internet Explorer, oraz Google Chrome (jeżeli dostępny). 8

Laboratorium 1: Szablon strony w HTML5

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

Bardziej szczegółowo

Zadanie 9. Projektowanie stron dokumentu

Zadanie 9. Projektowanie stron dokumentu Zadanie 9. Projektowanie stron dokumentu Przygotowany dokument można: wydrukować i oprawić, zapisać jako strona sieci Web i opublikować w Internecie przekonwertować na format PDF i udostępnić w postaci

Bardziej szczegółowo

Prezentacja multimedialna MS PowerPoint 2010 (podstawy)

Prezentacja multimedialna MS PowerPoint 2010 (podstawy) Prezentacja multimedialna MS PowerPoint 2010 (podstawy) Cz. 1. Tworzenie slajdów MS PowerPoint 2010 to najnowsza wersja popularnego programu do tworzenia prezentacji multimedialnych. Wygląd programu w

Bardziej szczegółowo

Studia Podyplomowe Grafika Komputerowa i Techniki Multimedialne, 2015/2016, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW

Studia Podyplomowe Grafika Komputerowa i Techniki Multimedialne, 2015/2016, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW Ćwiczenie nr 1 Zapoznanie się z pracą w środowisku Dreamweaver CS6 Tworzenie prostego serwisu WWW Publikacja w Internecie Praca własna dr inż. Robert Banasiak 1 Materiały ćwiczeniowe Wszelkie materiały

Bardziej szczegółowo

Tworzenie stron internetowych w kodzie HTML Cz 5

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

Bardziej szczegółowo

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. 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

Bardziej szczegółowo

I. Wstawianie rysunków

I. Wstawianie rysunków I. Wstawianie rysunków Wstawiane rysunku Bez parametrów: Tekst alternatywny Tytuł obrazka

Bardziej szczegółowo

Nowy szablon stron pracowników ZUT

Nowy szablon stron pracowników ZUT Nowy szablon stron pracowników ZUT Uczelniane Centrum Informatyki ZUT przygotowało nowy szablon stron pracowników, zunifikowany z obecnymi stronami ZUT. Serdecznie zachęcamy Państwa do migracji na nowy

Bardziej szczegółowo

Temat: Organizacja skoroszytów i arkuszy

Temat: Organizacja skoroszytów i arkuszy Temat: Organizacja skoroszytów i arkuszy Podstawowe informacje o skoroszycie Excel jest najczęściej wykorzystywany do tworzenia skoroszytów. Skoroszyt jest zbiorem informacji, które są przechowywane w

Bardziej szczegółowo

Układy witryn internetowych

Układy witryn internetowych 1. CEL ĆWICZENIA Celem ćwiczenia jest zapoznanie się z możliwościami kaskadowych arkuszy stylów CSS w zakresie kontrolowania położenia elementów na stronie. 2. MATERIAŁ NAUCZANIA W normalnym układzie opartym

Bardziej szczegółowo

DODAJEMY TREŚĆ DO STRONY

DODAJEMY TREŚĆ DO STRONY DODAJEMY TREŚĆ DO STRONY SPIS TREŚCI Pasek narzędzi i wyszukiwarka aplikacji... 2 Dodawanie portletów... 3 Widok zawartości stron... 4 Zawartość portletu... 5 Ikonki wybierz oraz dodaj zawartość stron...

Bardziej szczegółowo

Edytor tekstu MS Word 2003 - podstawy

Edytor tekstu MS Word 2003 - podstawy Edytor tekstu MS Word 2003 - podstawy Cz. 4. Rysunki i tabele w dokumencie Obiekt WordArt Jeżeli chcemy zamieścić w naszym dokumencie jakiś efektowny napis, na przykład hasło reklamowe, możemy wykorzystać

Bardziej szczegółowo

za pomocą: definiujemy:

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

Bardziej szczegółowo

MS Word 2010. Długi dokument. Praca z długim dokumentem. Kinga Sorkowska 2011-12-30

MS Word 2010. Długi dokument. Praca z długim dokumentem. Kinga Sorkowska 2011-12-30 MS Word 2010 Długi dokument Praca z długim dokumentem Kinga Sorkowska 2011-12-30 Dodawanie strony tytułowej 1 W programie Microsoft Word udostępniono wygodną galerię wstępnie zdefiniowanych stron tytułowych.

Bardziej szczegółowo

Arkusz kalkulacyjny EXCEL

Arkusz kalkulacyjny EXCEL ARKUSZ KALKULACYJNY EXCEL 1 Arkusz kalkulacyjny EXCEL Aby obrysować tabelę krawędziami należy: 1. Zaznaczyć komórki, które chcemy obrysować. 2. Kursor myszy ustawić na menu FORMAT i raz kliknąć lewym klawiszem

Bardziej szczegółowo

1. Przypisy, indeks i spisy.

1. Przypisy, indeks i spisy. 1. Przypisy, indeks i spisy. (Wstaw Odwołanie Przypis dolny - ) (Wstaw Odwołanie Indeks i spisy - ) Przypisy dolne i końcowe w drukowanych dokumentach umożliwiają umieszczanie w dokumencie objaśnień, komentarzy

Bardziej szczegółowo

Stosowanie, tworzenie i modyfikowanie stylów.

Stosowanie, tworzenie i modyfikowanie stylów. Stosowanie, tworzenie i modyfikowanie stylów. We wstążce Narzędzia główne umieszczone są style, dzięki którym w prosty sposób możemy zmieniać tekst i hurtowo modyfikować. Klikając kwadrat ze strzałką w

Bardziej szczegółowo

1. Włączamy listę wielopoziomową: rozwijamy trzecią ikonę do włączania list i wybieramy wzór:

1. Włączamy listę wielopoziomową: rozwijamy trzecią ikonę do włączania list i wybieramy wzór: Wskazówki do wykonania Ćwiczenia 2 (Word 2007) ze strony http://logika.uwb.edu.pl/mg/ Wg wzoru praca do wykonania http://logika.uwb.edu.pl/mg/cw2n.pdf Część A. LISTA WIELOPOZIOMOWA Autor: dr Mariusz Giero

Bardziej szczegółowo

Nawigacja po długim dokumencie może być męcząca, dlatego warto poznać następujące skróty klawiszowe

Nawigacja po długim dokumencie może być męcząca, dlatego warto poznać następujące skróty klawiszowe Zestawienie wydatków rok 2015 1 Wstaw numerację stron. Aby to zrobić przejdź na zakładkę Wstawianie i w grupie Nagłówek i stopka wybierz Numer strony. Następnie określ pozycję numeru na stronie (na przykład

Bardziej szczegółowo

Box model: Content. Content - obszar zawartości określany jest za pomocą deklaracji wysokości i szerokości.

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

Bardziej szczegółowo

Elementy div i style CSS w praktyce

Elementy div i style CSS w praktyce Elementy div i style CSS w praktyce Włodzimierz Gajda 23 listopada 2005 ver. 0.2 Streszczenie Artykuł omawia kulisy tworzenia strony internetowej wyłącznie w oparciu o elementy div oraz kaskadowe arkusze

Bardziej szczegółowo

Rozwiązanie ćwiczenia 8a

Rozwiązanie ćwiczenia 8a Rozwiązanie ćwiczenia 8a Aby utworzyć spis ilustracji: 1. Ustaw kursor za tekstem na ostatniej stronie dokumentu Polska_broszura.doc i kliknij przycisk Podział strony na karcie Wstawianie w grupie Strony

Bardziej szczegółowo

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA Ćwiczenie 1: Ściągnij plik z tekstem ze strony www. Zaznacz tekst i ustaw go w stylu Bez odstępów. Sformatuj tekst: wyjustowany czcionka Times New Roman

Bardziej szczegółowo

Zaprojektuj własny kalendarz na nowy rok szkolny

Zaprojektuj własny kalendarz na nowy rok szkolny Jadwiga Pawluk Warmińsko-Mazurska Biblioteka Pedagogiczna im. Karola Wojtyły w Elblągu Zaprojektuj własny kalendarz na nowy rok szkolny Początek roku szkolnego skłania nas do zaplanowania zajęć na najbliższe

Bardziej szczegółowo

Damian Daszkiewicz 2010 www.damiandaszkiewicz.pl www.videowebmaster.pl. Tworzenie strony-wizytówki dla firmy XYZ

Damian Daszkiewicz 2010 www.damiandaszkiewicz.pl www.videowebmaster.pl. Tworzenie strony-wizytówki dla firmy XYZ Damian Daszkiewicz 2010 www.damiandaszkiewicz.pl www.videowebmaster.pl Tworzenie strony-wizytówki dla firmy XYZ Dokument może być dowolnie rozpowszechniany w niezmiennej formie. Nie możesz pobierać opłat

Bardziej szczegółowo

I. Spis treści I. Spis treści... 2 II. Kreator szablonów... 3 1. Tworzenie szablonu... 3 2. Menu... 4 a. Opis ikon... 5 3. Dodanie nowego elementu...

I. Spis treści I. Spis treści... 2 II. Kreator szablonów... 3 1. Tworzenie szablonu... 3 2. Menu... 4 a. Opis ikon... 5 3. Dodanie nowego elementu... Kreator szablonów I. Spis treści I. Spis treści... 2 II. Kreator szablonów... 3 1. Tworzenie szablonu... 3 2. Menu... 4 a. Opis ikon... 5 3. Dodanie nowego elementu... 7 a. Grafika... 7 b. Tekst... 7 c.

Bardziej szczegółowo

I. Dlaczego standardy kodowania mailingów są istotne?

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

Bardziej szczegółowo

Kurs ECDL Moduł 3. Nagłówek i stopka Microsoft Office Word 2003. Autor: Piotr Dębowski. piotr.debowski@konto.pl

Kurs ECDL Moduł 3. Nagłówek i stopka Microsoft Office Word 2003. Autor: Piotr Dębowski. piotr.debowski@konto.pl Kurs ECDL Moduł 3 Nagłówek i stopka Microsoft Office Word 2003 Autor: Piotr Dębowski piotr.debowski@konto.pl Wolno: Creative Commons License Deed Uznanie autorstwa - Użycie niekomercyjne - Na tych samych

Bardziej szczegółowo

Edytor tekstu OpenOffice Writer Podstawy

Edytor tekstu OpenOffice Writer Podstawy Edytor tekstu OpenOffice Writer Podstawy OpenOffice to darmowy zaawansowany pakiet biurowy, w skład którego wchodzą następujące programy: edytor tekstu Writer, arkusz kalkulacyjny Calc, program do tworzenia

Bardziej szczegółowo

Edytor tekstu OpenOffice Writer Podstawy

Edytor tekstu OpenOffice Writer Podstawy Edytor tekstu OpenOffice Writer Podstawy Cz. 3. Rysunki w dokumencie Obiekt Fontwork Jeżeli chcemy zamieścić w naszym dokumencie jakiś efektowny napis, na przykład tytuł czy hasło promocyjne, możemy w

Bardziej szczegółowo

Formatowanie tekstu za pomocą zdefiniowanych stylów. Włączanie okna stylów. 1. zaznaczyć tekst, który chcemy formatować

Formatowanie tekstu za pomocą zdefiniowanych stylów. Włączanie okna stylów. 1. zaznaczyć tekst, który chcemy formatować Style Bardzo często w edytorze podczas pisania tekstu zachodzi potrzeba wielokrotnego powtórzenia czynności związanych z formatowaniem. Aby zapobiec stałemu otwieraniu okien dialogowych i wybierania stale

Bardziej szczegółowo

Jeśli dodamy jakieś parametry stylów dla poszczególnych DIV-ów, np.:
pierwsza treść, zdjęcie, tabele lub cokolwiek

Jeśli dodamy jakieś parametry stylów dla poszczególnych DIV-ów, np.: <div style=float: left>pierwsza treść, zdjęcie, tabele lub cokolwiek </div> Wykorzystanie znacznika DIV. Znacznik można nazwać blokiem, sekcją, zasobnikiem, pudełkiem, w którym umieszczamy dowolną treść. Poszczególne DIVy można dowolnie umieszczać na stronie, względem siebie

Bardziej szczegółowo

I. Menu oparte o listę

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

Bardziej szczegółowo

Przewodnik... Tworzenie Landing Page

Przewodnik... Tworzenie Landing Page Przewodnik... Tworzenie Landing Page Spis treści Kreator strony landing page Stwórz stronę Zarządzaj stronami 2 Kreator strony landing page Kreator pozwala stworzyć własną stronę internetową z unikalnym

Bardziej szczegółowo

Przykład 1 wałek MegaCAD 2005 2D przykład 1 Jest to prosty rysunek wałka z wymiarowaniem. Założenia: 1) Rysunek z branży mechanicznej; 2) Opracowanie w odpowiednim systemie warstw i grup; Wykonanie 1)

Bardziej szczegółowo

Kadry Optivum, Płace Optivum

Kadry Optivum, Płace Optivum Kadry Optivum, Płace Optivum Jak seryjnie przygotować wykazy absencji pracowników? W celu przygotowania pism zawierających wykazy nieobecności pracowników skorzystamy z mechanizmu Nowe wydruki seryjne.

Bardziej szczegółowo

2 Podstawy tworzenia stron internetowych

2 Podstawy tworzenia stron internetowych 2 Podstawy tworzenia stron internetowych 2.1. HTML5 i struktura dokumentu Podstawą działania wszystkich stron internetowych jest język HTML (Hypertext Markup Language) hipertekstowy język znaczników. Dokument

Bardziej szczegółowo

Jak zainstalować szablon allegro?

Jak zainstalować szablon allegro? Jak zainstalować szablon allegro? W mailu z zakupionym szablonem otrzymali państwo plik zip z numerem szablonu w nazwie. Należy najpierw go rozpakować. W paczce znajduję się pliki: 1. index[nrszablonu].txt

Bardziej szczegółowo

5.4. Tworzymy formularze

5.4. Tworzymy formularze 5.4. Tworzymy formularze Zastosowanie formularzy Formularz to obiekt bazy danych, który daje możliwość tworzenia i modyfikacji danych w tabeli lub kwerendzie. Jego wielką zaletą jest umiejętność zautomatyzowania

Bardziej szczegółowo

1. 2. Dobór formy do treści dokumentu w edytorze tekstu MS Word

1. 2. Dobór formy do treści dokumentu w edytorze tekstu MS Word 1. 2. Dobór formy do treści dokumentu w edytorze tekstu MS Word a. 1. Cele lekcji i. a) Wiadomości 1. Uczeń potrafi wyjaśnić pojęcia: nagłówek, stopka, przypis. 2. Uczeń potrafi wymienić dwie zasadnicze

Bardziej szczegółowo

INSTRUKCJA OBSŁUGI SYSTEM ZARZĄDZANIA TREŚCIĄ

INSTRUKCJA OBSŁUGI SYSTEM ZARZĄDZANIA TREŚCIĄ INSTRUKCJA OBSŁUGI SYSTEM ZARZĄDZANIA TREŚCIĄ Spis treści: 1 Logowanie do panelu administracyjnego 2 Dodawanie obiektów na stronie 2.1 Wybór podstrony 2.2 Wybór obiektu 2.2.1 Dodawanie obiektów tekstowych

Bardziej szczegółowo

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.

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

Bardziej szczegółowo

Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów

Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów 1. Uruchamianie edytora tekstu MS Word 2007 Edytor tekstu uruchamiamy jak każdy program w systemie Windows. Można to zrobić

Bardziej szczegółowo

Tworzenie prezentacji w MS PowerPoint

Tworzenie prezentacji w MS PowerPoint Tworzenie prezentacji w MS PowerPoint Program PowerPoint dostarczany jest w pakiecie Office i daje nam możliwość stworzenia prezentacji oraz uatrakcyjnienia materiału, który chcemy przedstawić. Prezentacje

Bardziej szczegółowo

Rozwiązanie ćwiczenia 6a

Rozwiązanie ćwiczenia 6a Rozwiązanie ćwiczenia 6a Aby ponumerować strony: 1. Ustaw kursor tekstowy na pierwszej stronie dokumentu Polska_broszura.doc i kliknij przycisk Numer strony na karcie Wstawianie w grupie Nagłówek i stopka.

Bardziej szczegółowo

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA Ćwiczenie 1: Ściągnij plik z tekstem ze strony www. Zaznacz tekst i ustaw go w stylu Bez odstępów. Sformatuj tekst: wyjustowany czcionka Times New Roman

Bardziej szczegółowo

Podstawy pozycjonowania CSS

Podstawy pozycjonowania CSS Podstawy pozycjonowania CSS Żeby pokazać w jaki sposób przeglądarka rozkłada elementy na stronie posłużę się prostym przykładowym fragmentem kodu html. div id="before"

Bardziej szczegółowo

Instalacja systemu zarządzania treścią (CMS): Joomla

Instalacja systemu zarządzania treścią (CMS): Joomla Instalacja systemu zarządzania treścią (CMS): Joomla Na stronie http://www.cba.pl/ zarejestruj nowe konto klikając na przycisk:, następnie wybierz nazwę domeny (Rys. 1a) oraz wypełnij obowiązkowe pola

Bardziej szczegółowo

1. Proszę wejść na stronę: poczta.home.pl i zalogować się do nowej skrzynki e-mail za pomocą otrzymanych danych.

1. Proszę wejść na stronę: poczta.home.pl i zalogować się do nowej skrzynki e-mail za pomocą otrzymanych danych. 1. Proszę wejść na stronę: poczta.home.pl i zalogować się do nowej skrzynki e-mail za pomocą otrzymanych danych. 2. Po poprawnym zalogowaniu się, przejdziemy do nowej skrzynki. Ważną informacją jest zajętość

Bardziej szczegółowo

CMS- kontakty (mapa)

CMS- kontakty (mapa) CMS- kontakty (mapa) Rozpatrzy inny rodzaj kontaktu mapa sytuacyjna. W naszej kategorii kontaktów dodamy teraz multimedialną mapę dojazdową. W tym celu potrzebny nam będzie moduł HTML 1.0. Będziemy mogli

Bardziej szczegółowo

www.fwrl.pl/szkolenie

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

Bardziej szczegółowo

Zadaniem tego laboratorium będzie zaznajomienie się z podstawowymi możliwościami kompozycji strony i grafiki

Zadaniem tego laboratorium będzie zaznajomienie się z podstawowymi możliwościami kompozycji strony i grafiki Zadaniem tego laboratorium będzie zaznajomienie się z podstawowymi możliwościami kompozycji strony i grafiki Edytory tekstu oferują wiele możliwości dostosowania układu (kompozycji) strony w celu uwypuklenia

Bardziej szczegółowo

Spis treści. Konwencje zastosowane w książce...5. Dodawanie stylów do dokumentów HTML oraz XHTML...6. Struktura reguł...9. Pierwszeństwo stylów...

Spis treści. Konwencje zastosowane w książce...5. Dodawanie stylów do dokumentów HTML oraz XHTML...6. Struktura reguł...9. Pierwszeństwo stylów... Spis treści Konwencje zastosowane w książce...5 Dodawanie stylów do dokumentów HTML oraz XHTML...6 Struktura reguł...9 Pierwszeństwo stylów... 10 Klasyfikacja elementów... 13 Sposoby wyświetlania elementów...

Bardziej szczegółowo

BAZY DANYCH Formularze i raporty

BAZY DANYCH Formularze i raporty BAZY DANYCH Formularze i raporty Za pomocą tabel można wprowadzać nowe dane, przeglądać i modyfikować dane już istniejące. Jednak dla typowego użytkownika systemu baz danych, przygotowuje się specjalne

Bardziej szczegółowo

Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów

Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów Europejski Certyfikat Umiejętności Komputerowych. Moduł 3 Przetwarzanie tekstów 1. Uruchamianie edytora tekstu MS Word 2003 Edytor tekstu uruchamiamy jak każdy program w systemie Windows. Można to zrobić

Bardziej szczegółowo

Tworzenie i edycja dokumentów w aplikacji Word.

Tworzenie i edycja dokumentów w aplikacji Word. Tworzenie i edycja dokumentów w aplikacji Word. Polskie litery, czyli ąłóęśźżń, itd. uzyskujemy naciskając prawy klawisz Alt i jednocześnie literę najbardziej zbliżoną wyglądem do szukanej. Np. ł uzyskujemy

Bardziej szczegółowo

Konfiguracja szablonu i wystawienie pierwszej aukcji allegro

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

Bardziej szczegółowo

Rozwiązanie ćwiczenia 7a

Rozwiązanie ćwiczenia 7a Rozwiązanie ćwiczenia 7a Podpisy pod rysunkami, zdjęciami możesz wprowadzić w następujący sposób: 1. Kliknij obiekt (rysunek, zdjęcie) i wybierz przycisk Wstaw podpis z grupy narzędzi Podpisy na karcie

Bardziej szczegółowo

Instrukcja 3wcms najważniejsze funkcje

Instrukcja 3wcms najważniejsze funkcje Instrukcja 3wcms najważniejsze funkcje Spis: Dodawanie nowego dokumentu Edycja dokumentu Dodawanie dokumentu do menu Dodawanie grafiki do dokumentu Dodawanie grafiki głównej Lista dokumentów Operacje na

Bardziej szczegółowo

Praca z tekstem: WORD Listy numerowane, wstawianie grafiki do pliku

Praca z tekstem: WORD Listy numerowane, wstawianie grafiki do pliku Praca z tekstem: WORD Listy numerowane, wstawianie grafiki do pliku W swoim folderze utwórz folder o nazwie 29_10_2009, wszystkie dzisiejsze zadania wykonuj w tym folderze. Na dzisiejszych zajęciach nauczymy

Bardziej szczegółowo

Instrukcja obsługi systemu Sky CMS

Instrukcja obsługi systemu Sky CMS Instrukcja obsługi systemu Sky CMS Tworzenie stron w systemie skycms 1. Logujemy się 2. Tworzenie nowej strony: Wchodzimy do zakładki Strony Dodaj nową stronę. Pokażą się zakładki Strona, Powiązania strony,

Bardziej szczegółowo

Kaskadowe arkusze stylów (CSS)

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

Bardziej szczegółowo

Jak posługiwać się edytorem treści

Jak posługiwać się edytorem treści Jak posługiwać się edytorem treści Edytor CKE jest bardzo prostym narzędziem pomagającym osobom niezaznajomionym z językiem HTML w tworzeniu interaktywnych treści stron internetowych. Razem z praktyka

Bardziej szczegółowo

I Tworzenie prezentacji za pomocą szablonu w programie Power-Point. 1. Wybieramy z górnego menu polecenie Nowy a następnie Utwórz z szablonu

I Tworzenie prezentacji za pomocą szablonu w programie Power-Point. 1. Wybieramy z górnego menu polecenie Nowy a następnie Utwórz z szablonu I Tworzenie prezentacji za pomocą szablonu w programie Power-Point 1. Wybieramy z górnego menu polecenie Nowy a następnie Utwórz z szablonu 2. Po wybraniu szablonu ukaŝe się nam ekran jak poniŝej 3. Następnie

Bardziej szczegółowo

CSS. Kaskadowe Arkusze Stylów

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ć

Bardziej szczegółowo

Ćwiczenie 4 Konspekt numerowany

Ćwiczenie 4 Konspekt numerowany Ćwiczenie 4 Konspekt numerowany Celem ćwiczenia jest zastosowane automatycznej, wielopoziomowej numeracji nagłówków w wielostronicowym dokumencie. Warunkiem poprawnego wykonania tego ćwiczenia jest właściwe

Bardziej szczegółowo

Zajęcia e-kompetencje

Zajęcia e-kompetencje Zajęcia e-kompetencje Podstawy obsługi pakietu biurowego. Word i Writer cz.2 Projekt pt:. E-dzi@dek, e-b@bcia i nauczyciel wnuczek 1 Plan dzisiejszych zajęć: 1. Podstawy obsługi pakietu biurowego. Word

Bardziej szczegółowo

Klawisze funkcyjne w OpenOffice.org Writer

Klawisze funkcyjne w OpenOffice.org Writer Klawisze funkcyjne w OpenOffice.org Writer F2 Ctrl + F2 F3 Ctrl + F3 F4 Shift + F4 F5 Ctrl + Shift + F5 F7 Ctrl + F7 F8 Ctrl + F8 Shift + F8 Ctrl+Shift+F8 F9 Ctrl + F9 Shift + F9 Ctrl + Shift + F9 Ctrl

Bardziej szczegółowo

EDYCJA TEKSTU MS WORDPAD

EDYCJA TEKSTU MS WORDPAD EDYCJA TEKSTU MS WORDPAD EDYCJA TEKSTU - MS WORDPAD WordPad (ryc. 1 ang. miejsce na słowa) to bardzo przydatny program do edycji i pisania tekstów, który dodatkowo dostępny jest w każdym systemie z rodziny

Bardziej szczegółowo

Słowa kluczowe Sterowanie klawiaturą, klawiatura, klawisze funkcyjne, przesuwanie obiektów ekranowych, wydawanie poleceń za pomocą klawiatury

Słowa kluczowe Sterowanie klawiaturą, klawiatura, klawisze funkcyjne, przesuwanie obiektów ekranowych, wydawanie poleceń za pomocą klawiatury Obsługa za pomocą klawiatury Różnego typu interfejsy wykorzystują różne metody reagowania i wydawania poleceń przez użytkownika. W środowisku graficznym najpopularniejsza jest niewątpliwie mysz i inne

Bardziej szczegółowo

Uwaga w niektórych przeglądarkach różnice mogą być niewidoczne zależy to od przeglądarki i ew. od jej ustawień.

Uwaga w niektórych przeglądarkach różnice mogą być niewidoczne zależy to od przeglądarki i ew. od jej ustawień. Poprzednie zajęcia skończyliśmy ucząc się tworzenia odsyłaczy/hiperłączy/linków (można wrócić do poprzedniego scenariusza, jeśli ktoś go nie skończył). Skoro jesteśmy przy odsyłaczach, to warto poznać

Bardziej szczegółowo

Podstawowa instrukcja obsługi STRON stron internetowych serwisu www.smpn.pl zrealizowanych w systemie zarządzania treścią Wordpress.

Podstawowa instrukcja obsługi STRON stron internetowych serwisu www.smpn.pl zrealizowanych w systemie zarządzania treścią Wordpress. Podstawowa instrukcja obsługi STRON stron internetowych serwisu www.smpn.pl zrealizowanych w systemie zarządzania treścią Wordpress. Założenia użytkownik posiada założone konto w systemie z prawami Redaktora.

Bardziej szczegółowo

Ćwiczenie 9 - CSS i wstawianie CSS

Ć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

Bardziej szczegółowo

Podstawowe czynnos ci w programie Word

Podstawowe czynnos ci w programie Word Podstawowe czynnos ci w programie Word Program Word to zaawansowana aplikacja umożliwiająca edytowanie tekstu i stosowanie różnych układów, jednak aby w pełni wykorzystać jej możliwości, należy najpierw

Bardziej szczegółowo

Podstawowe czynnos ci w programie Excel

Podstawowe czynnos ci w programie Excel Podstawowe czynnos ci w programie Excel Program Excel to zaawansowana aplikacja do obsługi arkuszy kalkulacyjnych i analizy danych, jednak aby w pełni wykorzystać jej możliwości, należy najpierw poznać

Bardziej szczegółowo

Przed rozpoczęciem pracy otwórz nowy plik (Ctrl +N) wykorzystując szablon acadiso.dwt

Przed rozpoczęciem pracy otwórz nowy plik (Ctrl +N) wykorzystując szablon acadiso.dwt Przed rozpoczęciem pracy otwórz nowy plik (Ctrl +N) wykorzystując szablon acadiso.dwt Zadanie: Utwórz szablon rysunkowy składający się z: - warstw - tabelki rysunkowej w postaci bloku (według wzoru poniżej)

Bardziej szczegółowo

Zadanie 8. Dołączanie obiektów

Zadanie 8. Dołączanie obiektów Zadanie 8. Dołączanie obiektów Edytor Word umożliwia dołączanie do dokumentów różnych obiektów. Mogą to być gotowe obiekty graficzne z galerii klipów, równania, obrazy ze skanera lub aparatu cyfrowego.

Bardziej szczegółowo

Platforma szkoleniowa krok po kroku. Poradnik Kursanta

Platforma szkoleniowa krok po kroku. Poradnik Kursanta - 1 - Platforma szkoleniowa krok po kroku Poradnik Kursanta PORA - 2 - Jeśli masz problemy z uruchomieniem Platformy szkoleniowej warto sprawdzić poprawność poniższych konfiguracji: - 3 - SPRZĘT Procesor

Bardziej szczegółowo

MATERIAŁY SZKOLENIOWE WORD PODSTAWOWY

MATERIAŁY SZKOLENIOWE WORD PODSTAWOWY MATERIAŁY SZKOLENIOWE WORD PODSTAWOWY 2013 Klawiatura narzędzie do wpisywania tekstu. 1. Wielkie litery piszemy z wciśniętym klawiszem SHIFT albo z włączonym klawiszem CAPSLOCK. 2. Litery typowe dla języka

Bardziej szczegółowo

Za pomocą atrybutu ROWS moŝemy dokonać podziału ekranu w poziomie. Odpowiedni kod powinien wyglądać następująco:

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

Bardziej szczegółowo

Podstawy tworzenia prezentacji w programie Microsoft PowerPoint 2007

Podstawy tworzenia prezentacji w programie Microsoft PowerPoint 2007 Podstawy tworzenia prezentacji w programie Microsoft PowerPoint 2007 opracowanie: mgr Monika Pskit 1. Rozpoczęcie pracy z programem Microsoft PowerPoint 2007. 2. Umieszczanie tekstów i obrazów na slajdach.

Bardziej szczegółowo

Przygotuj za pomocą tabulatorów element formularza. Utwórz pole tekstowe i sformatuj tak, aby dół napisu w polu był dokładnie nad kropkami.

Przygotuj za pomocą tabulatorów element formularza. Utwórz pole tekstowe i sformatuj tak, aby dół napisu w polu był dokładnie nad kropkami. FORMULARZE POLA TEKSTOWE Pole tekstowe Pole tekstowe kilka wierszy Karta Developer Formanty Formant i pole tekstowe Ćwiczenia Jak wypełnić danymi utworzony w edytorze tekstów formularz? Jak wpisać informacje

Bardziej szczegółowo

1.Formatowanie tekstu z użyciem stylów

1.Formatowanie tekstu z użyciem stylów 1.Formatowanie tekstu z użyciem stylów Co to jest styl? Styl jest ciągiem znaków formatujących, które mogą być stosowane do tekstu w dokumencie w celu szybkiej zmiany jego wyglądu. Stosując styl, stosuje

Bardziej szczegółowo

Instrukcja obsługi szablonów aukcji

Instrukcja obsługi szablonów aukcji Instrukcja obsługi szablonów aukcji spis treści 2 Ładowanie kodu szablonu bezpośrednio na Allegro.pl (edytor wizualny) 4 Edycja szablonu w edytorze wizualnym 7 Dodawanie zdjęć przy pomocy www.imageshack.us

Bardziej szczegółowo

Jak szybko wystawić fakturę w LeftHand? Instalacja programu

Jak szybko wystawić fakturę w LeftHand? Instalacja programu Jak szybko wystawić fakturę w LeftHand? Aby móc szybko wystawić fakturę VAT w programie LeftHand należy: - zainstalować program LeftHand - skonfigurować go za pomocą szybkiego wizzarda - dodać definicję

Bardziej szczegółowo

Instrukcja użytkowania stron domowych pracowników Politechniki Rzeszowskiej

Instrukcja użytkowania stron domowych pracowników Politechniki Rzeszowskiej Instrukcja użytkowania stron domowych pracowników Politechniki Rzeszowskiej 1. 2. 3. 4. 5. 6. Podstawowe informacje Wymagania systemowe Zakładanie konta strony domowej Panel administratora Przykłady modyfikacji

Bardziej szczegółowo

Instrukcja. Rejestracji i aktywacji konta w systemie so-open.pl DOTACJE NA INNOWACJE; SOFTWARE OPERATIONS SP. Z O. O.

Instrukcja. Rejestracji i aktywacji konta w systemie so-open.pl DOTACJE NA INNOWACJE; SOFTWARE OPERATIONS SP. Z O. O. Instrukcja Rejestracji i aktywacji konta w systemie so-open.pl 1Strona 1 z 12 Spis treści Wstęp... 3 Rejestracja... 3 Aktywacja konta... 5 Rozpoczęcie pracy z systemem... 7 Pierwsze logowanie do systemu...

Bardziej szczegółowo

wstawianie przycisków umożliwiających wybieranie wartości poprzez klikanie strzałek

wstawianie przycisków umożliwiających wybieranie wartości poprzez klikanie strzałek VBA Excel Formularz Formanty Label wstawianie etykiet TextBox wstawianie pól tekstowych ComboBox wstawianie pól kombi ComboBox wstawianie pól kombi ComboBox wstawianie pól kombi OptionButton wstawianie

Bardziej szczegółowo

Problemy techniczne. Jak wyłączyć obsługę plików cookie w przeglądarkach internetowych? Przeglądarka Internet Explorer

Problemy techniczne. Jak wyłączyć obsługę plików cookie w przeglądarkach internetowych? Przeglądarka Internet Explorer Problemy techniczne Jak wyłączyć obsługę plików cookie w przeglądarkach internetowych? Udostępniając treści w naszych serwisach internetowych wykorzystujemy pliki cookie (tzw. ciasteczka) na zasadach określonych

Bardziej szczegółowo

Instrukcja dodawania obiektów do strony Ekonomika.

Instrukcja dodawania obiektów do strony Ekonomika. Instrukcja dodawania obiektów do strony Ekonomika. Klikasz na zaloguj, aby przejść do strony logowania Podajesz login i hasło na WWW i klikasz Zaloguj W dodatkowym menu wybierasz Dodaj artykuł W edytorze

Bardziej szczegółowo

Sekretariat Optivum. Jak przygotować listę uczniów zawierającą tylko wybrane dane, np. adresy e-mail ucznia i jego opiekunów? Projektowanie listy

Sekretariat Optivum. Jak przygotować listę uczniów zawierającą tylko wybrane dane, np. adresy e-mail ucznia i jego opiekunów? Projektowanie listy Sekretariat Optivum Jak przygotować listę uczniów zawierającą tylko wybrane dane, np. adresy e-mail ucznia i jego opiekunów? Program Sekretariat Optivum ma wbudowane różne edytory, które umożliwiają przygotowywanie

Bardziej szczegółowo

Instrukcja obsługi Zaplecza epk w zakresie zarządzania tłumaczeniami opisów procedur, publikacji oraz poradników przedsiębiorcy

Instrukcja obsługi Zaplecza epk w zakresie zarządzania tłumaczeniami opisów procedur, publikacji oraz poradników przedsiębiorcy Instrukcja obsługi Zaplecza epk w zakresie zarządzania tłumaczeniami opisów procedur, publikacji oraz poradników przedsiębiorcy Spis treści: 1 WSTĘP... 3 2 DOSTĘP DO SYSTEMU... 3 3 OPIS OGÓLNY SEKCJI TŁUMACZENIA...

Bardziej szczegółowo

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA

NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA Ćwiczenie 1: NAGŁÓWKI, STOPKI, PODZIAŁY WIERSZA I STRONY, WCIĘCIA Skopiuj dowolny tekst z Internetu, np. ze strony http://www.gazeta.pl, około jednej strony objętości. Wklej tekst do nowego dokumentu Writer.

Bardziej szczegółowo

SYSTEM ZARZĄDZANIA TREŚCIĄ (CMS) STRONY INTERNETOWEJ SZKOŁY PRZEWODNIK

SYSTEM ZARZĄDZANIA TREŚCIĄ (CMS) STRONY INTERNETOWEJ SZKOŁY PRZEWODNIK SYSTEM ZARZĄDZANIA TREŚCIĄ (CMS) STRONY INTERNETOWEJ SZKOŁY PRZEWODNIK Daniel M. [dm.o12.pl] 2012 I. Ogólna charakterystyka systemu 1) System nie wymaga bazy danych oparty jest o pliki tekstowe. 2) Aktualna

Bardziej szczegółowo

Jak zmienić ustawienia cookies?

Jak zmienić ustawienia cookies? Jak zmienić ustawienia cookies? Pamiętaj, że zablokowanie ciasteczek używanych przez nas może negatywnie wpłynąć na wygodę korzystania z naszych stron, na przykład możesz nie być w stanie odwiedzić pewnych

Bardziej szczegółowo

Tworzenie strony www - jako projektu z Mechaniki i budowy maszyn

Tworzenie strony www - jako projektu z Mechaniki i budowy maszyn Tworzenie strony www - jako projektu z Mechaniki i budowy maszyn Program do tworzenia projektu strony - Microsoft SharePoint Designer 2007 Kliknij > aby dowiedzieć się o nowej aplikacji do tworzenia stron

Bardziej szczegółowo

Technologia Informacyjna. semestr I, studia niestacjonarne I stopnia Elektrotechnika rok akademicki 2012/2013 Pracownia nr 3 mgr inż.

Technologia Informacyjna. semestr I, studia niestacjonarne I stopnia Elektrotechnika rok akademicki 2012/2013 Pracownia nr 3 mgr inż. Technologia Informacyjna semestr I, studia niestacjonarne I stopnia Elektrotechnika rok akademicki 2012/2013 Pracownia nr 3 mgr inż. Adam Idźkowski Technologia informacyjna Pracownia nr 3 2 I. Style w

Bardziej szczegółowo

Wikispaces materiały szkoleniowe

Wikispaces materiały szkoleniowe Wikispaces materiały szkoleniowe Wstęp Wikispaces jest ogólnie dostępnym narzędziem do tworzenia własnych stron internetowych. Zastosowanie stron internetowych tworzonych przy pomocy wikispaces to na przykład:

Bardziej szczegółowo

dokumentacja Edytor Bazy Zmiennych Edytor Bazy Zmiennych Podręcznik użytkownika

dokumentacja Edytor Bazy Zmiennych Edytor Bazy Zmiennych Podręcznik użytkownika asix 4 Edytor Bazy Zmiennych Podręcznik użytkownika asix 4 dokumentacja Edytor Bazy Zmiennych ASKOM i asix to zastrzeżone znaki firmy ASKOM Sp. z o. o., Gliwice. Inne występujące w tekście znaki firmowe

Bardziej szczegółowo

Compas 2026 Vision Instrukcja obsługi do wersji 1.07

Compas 2026 Vision Instrukcja obsługi do wersji 1.07 Compas 2026 Vision Instrukcja obsługi do wersji 1.07 1 2 Spis treści Integracja...5 1.Compas 2026 Lan...5 Logowanie...7 Użytkownicy...8 Raporty...10 Tworzenie wizualizacji Widoki...12 1.Zarządzanie widokami...12

Bardziej szczegółowo