docHTML - 1 - Gimnazjum nr 1 Barcin
download 
Reklamacja Transkrypt
HTML - 1 - Gimnazjum nr 1 Barcin
HTML - 1 Ćwiczenie: Korzystając z NOTATNIKA utwórz stronę pod nazwą index.htm z następującymi elementami: - kolor strony aqua, - Imię i nazwisko (niebieski, wielkość – 20, środek strony), - Gimnazjum nr 1 (czerwony, wielkość – 22, środek strony), - w Barcinie (zielony, wielkość – 20, środek strony), - dzisiejsza data (czarny, po prawej, wielkość – 14). HTML - 2 1. Rodzaj czcionki <font face="rodzaj">Tu wpisz tekst</font> 2. <b>tekst pogrubiony</b> 3. <i> tekst pochylony </i> 4. <u>podkreślony</u> 5. <blink>tekst migający</blink> 6. <marquee>poruszający się tekst</marquee> <marquee behavior="typ">Tu wpisz tekst</marquee> gdzie jako "typ" należy wpisać: • "scroll" - tekst przesuwa się od prawej do lewej (domyślnie) • "alternate" - tekst przesuwa się od prawej do lewej, a następnie "odbija się" i powraca • "slide" - tekst przesunie się od prawej do lewej tylko raz, a później się zatrzyma i pozostanie nieruchomy <marquee direction="kierunek">Tu wpisz tekst</marquee> gdzie jako "kierunek" należy wpisać: • "left" - tekst będzie przesuwał się w lewo (domyślnie) • "right" - tekst będzie przesuwał się w prawo • "up" - przesuwanie w górę (nie obsługuje MSIE 3.01 ani Netscape 7) • "down" - przesuwanie w dół (nie obsługuje MSIE 3.01 ani Netscape 7) <marquee bgcolor="kolor">Tu wpisz tekst</marquee> 7. Linia <hr> <hr width =”50%”> linia na połowę ekranu <hr width =”250”> linia o długości 250 pikseli <hr width =”center”> linia umieszczona centralnie <hr size=”20”> linia o grubości 20 pikseli <hr width =”50%” size=”20” <hr color=”red”> linia o kolorze czerwonym color=”red”> 8. Tło strony z obrazka <body background=”uwaga-1”> Uwaga-1: w to miejsce wstaw nazwę pliku z rozszerzeniem, jeżeli obrazek znajduje się w innym miejscu podaj także ścieżkę dostępu. Np. <body background=”foto.jpg”> lub <body background=”h:\www\foto.jpg”> 9. Marginesy strony <body leftmargin="x1" rightmargin="x2" topmargin="y1" bottommargin="y2"> X1-lewy, x2-prawy, y1-wysokość górnego, y2-wysokość dolnego Ćwiczenie: Korzystając z NOTATNIKA utwórz stronę pod nazwą elementami: html-2.htm z następującymi - kolor strony – własne tło wykonane w programie Paint, - Imię i nazwisko (niebieski, wielkość – 24, ARIAL, pogrubiona, środek strony), - klasa – nr (wielkość 18, wyśrodkowane, migające) - Gimnazjum nr 1 w Barcinie (wielkość – 28, poruszający się), - pierwsza linia o grubości 5 pikseli - ostatnia linia 50% długości HTML - 3 1. Odsyłacze -link do innej podstrony - <a href> - tekst jako odsyłacz do strony WWW: <a href="http://www.gimbar.internet">strona gimnazjum</a> <a href="wp.pl">wp.pl</a> 2. Grafika na stronie - <img src> <img src=”ścieżka dostępu i nazwa pliku”> <img src="tarcza.gif"> 3. Bez ramki <img src="tarcza.gif" border="0"> Wyśrodkowanie <p align="center"><img src="tarcza.gif"></p> (inne: left, right) 4.Zmiana rozmiarów grafiki <img src="tarcza.gif" border="0" width="196" height="195"> Wielkości podajemy w pikselach 5.Etykieta rysunku (pojawia się po najechaniu myszką) <img src="tarcza.gif" border="0" width="196" height="195" alt=”opis”> 6.Wzajemne położenie tekstu i obrazu <p><img src="tarcza.gif" align="top">tekst</p> <p><img src="tarcza.gif" align="middle">tekst</p> <p><img src="tarcza.gif" align="bottom">tekst</p> Ćwiczenie: Korzystając z NOTATNIKA utwórz stronę pod nazwą elementami: gimnazjum.htm z następującymi - kolor strony – własne tło wykonane w programie Paint, - wstaw linie, - wstaw grafikę i opis wg wzoru, - wstaw link do pierwszej strony – index.htm - na stronie index.htm wstaw link do strony html-2.htm i gimnazjum.htm - na stronie htm-2 wstaw link do pierwszej strony – index.htm Zad dodatkowe: utwórz stronę barcin.htm, wstaw zdjęcia i linki. HTML - 4 <table border="2" width="100" height="70"> <tr> <td> <p align="center">treść1</td> </tr> </table> Tabela - <table> - Wiersz - <tr> - Komórka - <td> Parametry pomocnicze: - Grubość obramowania – border=”x” - Położenie obiektu w komórce – valign=”middle” Middle – środek, top – u góry, bottom – na dole - align=”center” - położenie obiektu w komórce (left, right) - wysokość komórki – height=”y” - szerokość komórki – width=”x” - kolor wypełnienia – bgcolor=”kolor” - kolor obramowania – bordercolor=”kolor” Lewy i prawy margines – marginwidth=”x” Dolny i górny margines – marginheight=”y” <table border="1" width="23%" height="76"> <tr> <td align="center" width="100" valign="top">treść 1</td> <td align="center" width="100" valign="bottom">treść 2</td> </tr> </table> Ćwiczenie: <table border="1" width="298" height="90"> <tr> <td height="60" align="center" bgcolor="blue">treść1</td> <td height="60" align="center">treść2</td> <td height="60" align="center" bgcolor="green">treść3</td> </tr> <tr> <td height="60" align="center">treść4</td> <td height="60" align="center" bgcolor="red">treść5</td> <td height="60" align="center">treść6</td> </tr> </table> Korzystając z NOTATNIKA utwórz stronę pod nazwą - kolor strony – dowolne, - wstaw tabele wg wzoru, - połącz linkiem ze stroną główną (z 1 ćwiczenia) tabela.htm z następującymi elementami:
