Obramowania
Transkrypt
Obramowania
12. Obramowania, listy wypunktowane i numerowane Obramowania Właściwość/wartość border: • • • • • solid double groove dotted dashed border Opis Przykład linia ramki: • ciągła • podwójna ciągła • wypukła • kropki • kreski p { grubość obramowania p { border: dashed; } border: dashed 1pt; } • • • • border-top border-bottom border-left border-right krawędzie ramki: • górna • dolna • lewa • prawa p { border-top: double; border-bottom: double; } przykład <html> <head> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <p> Informatyka jest obszerną i podstawową dziedziną o zasadniczym znaczeniu dla społeczeństwa w dobie rewolucji informacyjnej. Jej głównym celem jest badanie praw i ich zasięgu, praw rządzących procesami informacyjnymi i ich realizacjami. Dodatkowym celem informatyki jest opracowywanie nowych i skutecznych narzędzi intelektualnych, niezbędnych do rozwiązywania problemów przetwarzania informacji we wszystkich dziedzinach aktywności ludzkiej. Informatyka już teraz ma znaczący wpływ na rozwój innych nauk, na przemysł i nowoczesną technologię, na rolnictwo, ekonomię, kształcenie, a także na poszerzanie granic pojmowania wszechświata. </p> </body> </html> Zawartość pliku o nazwie style.css p { border-top: double; border-bottom: double; text-align: justify; border-color: gray; } wynik w przeglądarce internetowej opracował: Aleksander Piętowski 1/3 12. Obramowania, listy wypunktowane i numerowane Lista wypunktowana Właściwość/wartość Opis list-style-type: • disc • circle • square • none typ listy: • koło • okrąg • kwadrat • żaden Przykład ul { list-style-type: square; } przykład Cztery działania arytmetyczne: <ul> <li>dodawanie <li>odejmowanie <li>mnożenie <li>dzielenie </ul> Zawartość pliku o nazwie style.css ul { list-style-type: square; } Lista numerowana Właściwość/wartość list-style-type: • decimal • lower-roman • upper-roman • lower-alpha • upper-alpha • none Opis typ listy: • liczebniki arabskie • małe liczebniki rzymskie • duże liczebniki rzymskie • małe litery alfabetu • duże litery alfabetu • żaden Przykład ol { list-style-type: decimal; } przykład Cztery działania arytmetyczne: <ol> <li>dodawanie <li>odejmowanie <li>mnożenie <li>dzielenie </ol> Zawartość pliku o nazwie style.css ol { list-style-type: lower-alpha; } opracował: Aleksander Piętowski 2/3 12. Obramowania, listy wypunktowane i numerowane Położenie tekstu listy wypunktowanej i numerowanej • wewnątrz – inside • na zewnątrz – outside przykład <ol> <li>przykład pierwszej pozycji listy przykład pierwszej pozycji listy przykład pierwszej pozycji listy przykład pierwszej pozycji listy przykład pierwszej pozycji listy <li>przykład drugiej pozycji listy przykład drugiej pozycji listy przykład drugiej pozycji listy przykład drugiej pozycji listy przykład drugiej pozycji listy przykład drugiej pozycji listy </ol> Zawartość pliku o nazwie style.css ol { list-style-type: decimal; list-style-position: inside; } Obraz znaku punktora listy przykład <ol> Cztery działania arytmetyczne: <li>dodawanie <li>odejmowanie <li>mnożenie <li>dzielenie </ol> Zawartość pliku o nazwie style.css ol { list-style-image: url(spinacz.gif); } opracował: Aleksander Piętowski 3/3