1 Kaskadowe arkusze stylów – CSSĆwiczenie laboratoryjne – Pajączek 2000 Techniki i narzędzia do tworzenia stron WWW

2 Kaskadowe arkusze stylów – CSS (Cascade Style Sheet)Co to jest CSS? Jak umieścić arkusz stylu na stronie ? Jak stworzyć własny arkusz stylu ?

3 Jak umieścić arkusz stylu na stronie ?zapisanie definicji stylów między znacznikami w nagłówku dokumentu import danych z zewnętrznego pliku umieszczenie reguł CSS w tekście dokumentu pomiędzy znacznikami w połączeniu ze znacznikiem, któremu chcemy nadać daną regułę

4 Jak stworzyć własny arkusz stylu ?Każda reguła niezależnie od miejsca jej umieszczenia składa się z trzech części:     selektora (B, DIV, Warstwa1) identyfikującego regułę,     właściwości (color, font-size, position) przypisanych danemu selektorowi     wartości tych właściwości (#cc66ff, 8pt, absolute)   Przykład:   i {font: obligue 8pt/10pt Verdana, Geneva, Arial, Helvetica, sans-serif} zawiera definicję selektora i (znacznik czcionki pisanej kursywą), któremu jest przypisana właściwość font o wartościach: obligue 8pt/10pt Verdana Geneva Arial Helvetica, sans-serif

5 Ćwiczenie laboratoryjne – tworzenie strony WWW za pomocą edytora PAJĄCZEK 2000Rozpoczęcie pracy z programem Pajączek 2000 Strona z definicją ramek Tworzenie strony startowej Tworzenie strony z formularzem Tworzenie arkusza stylów CSS Tworzenie hiperlinków Strona WWW

6 Techniki i narzędzia do tworzenia stron WWWHTML (Hyper Text Markup Language) DHTML (Dynamic HTML) CSS (Cascade Style Sheet) JavaScript VBScript CGI (Common Gateway Interface) Flash Grafika do WWW

7 narzędzia Edytory HTML, DHTML, języków skryptowych: Generatory koduNarzędzia graficzne, inne

8 Edytory HotDog 6.2 Adobe GoLive 4.0 1st Page 2000Pajączek Skryba 2000 CoffeCup HTML Editor 8.5 HomeSite 4.5 AceHTML 4.0

9 Generatory kodu Technologia FlashMicrosoft FrontPage 2000 Macromedia Dreamweaver 3 Technologia Flash Macromedia Flash 5 Adobe LiveMotion SWiSH 1.51

10 Narzędzia dodatkowe Narzędzia graficzne: - Corel Draw, PhotoPaint, Adobe PhotoShop, MS Image Composer, Paint Shop Pro, - Microsoft GifAnimator, Xara3D, Ulead GifAnimator Generator CSS – TopStyle Rejestrator w wyszukiwarkach - TrafficSeeker Pro 3.5 Obsługa kamery – SpyCam 6.2 Aplety Javy – Ulead JavaRazor, Anfy Java

11 Politechnika Poznańska Poznań, listopad 2000Autorzy: Politechnika Poznańska Poznań, listopad 2000