From a065e04d529da1d847b5062a12c46d916408bf32 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 21:46:22 -0500 Subject: update based on https://github.com/mdn/yari/issues/2028 --- .../css/na_pocz\304\205tek/dane_xml/index.html" | 191 --------------------- 1 file changed, 191 deletions(-) delete mode 100644 "files/pl/web/css/na_pocz\304\205tek/dane_xml/index.html" (limited to 'files/pl/web/css/na_początek/dane_xml/index.html') diff --git "a/files/pl/web/css/na_pocz\304\205tek/dane_xml/index.html" "b/files/pl/web/css/na_pocz\304\205tek/dane_xml/index.html" deleted file mode 100644 index 3352d21184..0000000000 --- "a/files/pl/web/css/na_pocz\304\205tek/dane_xml/index.html" +++ /dev/null @@ -1,191 +0,0 @@ ---- -title: Dane XML -slug: Web/CSS/Na_początek/Dane_XML -tags: - - 'CSS:Na_początek' -translation_of: Archive/Beginner_tutorials/XML_data ---- -

-

Ta strona zawiera przykład tego, jak możesz używać CSS z danymi XML. -

Stworzysz przykładowy dokument XML oraz arkusz stylów, którego możesz użyć do wyświetlenia tego dokumentu w przeglądarce. -

-

Informacja: Dane XML

-

XML (Rozszerzalny Język Znaczników) jest językiem ogólnego przeznaczenia dla wszelkiego typu danych strukturalnych. -

Domyślnie, Twoja przeglądarka Mozilla wyświetla XML w formacie bardzo podobnym do ułożenia danych w oryginalnym pliku XML. -Dzięki temu możesz obejrzeć znaczniki, które określają strukturę danych. -

Przez podpięcie arkusza stylów CSS do dokumentu XML, może określić inne sposoby wyświetlenia go. -Aby to zrobić, Twój arkusz stylów używa reguł, które mapuje znaczniki w dokumencie XML, aby były wyświetlane w typach znanych HTML-owi. -

- - -
Przykład -
Dane w dokumencie XML używają tagu <INFO>. Chcesz, aby wszystkie elementy INFO w dokumencie były wyświetlane jak HTML-owe akapity. -

W arkuszu stylów dokumentu, określasz jak wyświetlane będą elementy INFO: -

-
-
INFO {
- display: block;
- margin: 1em 0;
- }
-
-
-
-

Najczęstszymi wartościami własności display są: -

- - - - -
blockWyświetlane jak HTML-owy DIV (nagłówki, akapity itp.) -
inlineWyświetlany jak HTML-owy SPAN (dla typów tekstowych) -
-

Dodaj własne reguły stylów, które określą krój, odstępy i inne szczegóły w taki sam sposób, jak dla HTML-a. -

- - -
Więcej szczegółów -
Inne wartości własności display pozwalają wyświetlać element jako punkt listy lub jako komponent tabeli. -

Pełną listę typów wyświetlania można znaleźć w specyfikacji CSS na stronie The display property. -

Jeśli korzystasz wyłącznie z CSS, struktura wyświetlania musi być taka sama jak struktura dokumentu. -Inne technologie pozwalają modyfikować strukturę wyświetlania—na przykład XBL może dodawać treść, a JavaScript może modyfikować DOM. -

Aby dowiedzieć się więcej o XML-u w Mozilli, zajrzyj na stronę XML w tym wiki. -

-
-

Zadanie: Demonstracja XML-a

-

Stwórz nowy plik XML, doc9.xml. -Skopiuj i wklej do niego poniższy kod, upewniając się, że zaznaczyłeś(aś) cały: -

-
<?xml version="1.0"?>
-<!-- XML demonstration -->
-
-<?xml-stylesheet type="text/css" href="style9.css"?>
-
-<!DOCTYPE planet>
-<planet>
-
-<ocean>
-<name>Arctic</name>
-<area>13,000</area>
-<depth>1,200</depth>
-</ocean>
-
-<ocean>
-<name>Atlantic</name>
-<area>87,000</area>
-<depth>3,900</depth>
-</ocean>
-
-<ocean>
-<name>Pacific</name>
-<area>180,000</area>
-<depth>4,000</depth>
-</ocean>
-
-<ocean>
-<name>Indian</name>
-<area>75,000</area>
-<depth>3,900</depth>
-</ocean>
-
-<ocean>
-<name>Southern</name>
-<area>20,000</area>
-<depth>4,500</depth>
-</ocean>
-
-</planet>
-
-

Stwórz nowy plik CSS, style9.css. -Skopiuj i wklej do niego poniższy kod, upewniając się, że zaznaczyłeś(aś) cały: -

-
/*** XML demonstration ***/
-
-planet:before {
-  display: block;
-  width: 8em;
-  font-weight: bold;
-  font-size: 200%;
-  content: "Oceans";
-  margin: -.75em 0px .25em -.25em;
-  padding: .1em .25em;
-  background-color: #cdf;
-  }
-
-planet {
-  display: block;
-  margin: 2em 1em;
-  border: 4px solid #cdf;
-  padding: 0px 1em;
-  background-color: white;
-  }
-
-ocean {
-  display: block;
-  margin-bottom: 1em;
-  }
-
-name {
-  display: block;
-  font-weight: bold;
-  font-size: 150%;
-  }
-
-area {
-  display: block;
-  }
-
-area:before {
-  content: "Area: ";
-  }
-
-area:after {
-  content: " million km\B2";
-  }
-
-depth {
-  display: block;
-  }
-
-depth:before {
-  content: "Mean depth: ";
-  }
-
-depth:after {
-  content: " m";
-  }
-
-

Otwórz dokument w swojej przeglądarce: -

- - -
-

Oceans

-

Arctic
-Area: 13,000 million km²
-Mean depth: 1,200 m

-

Atlantic
-Area: 87,000 million km²
-Mean depth: 3,900 m

-

. . .

-
-
-


-Uwagi dotyczące tej demonstracji: -

- -


-

- - -
Wyzwanie -
Zmień arkusz stylów, aby wyświetlał dokument jako tabelę. -

(Zajrzyj na stronę Tables w specyfikacji CSS, aby znaleźć przykłady.) -

-
-

Co dalej?

-

Jeżeli masz problemy ze zrozumieniem tej strony, lub jeżeli masz jakieś komentarze na jej temat, pomóż nam dopisując się na stronie Dyskusji. -

To jest ostatnia strona tego kursu. -Więcej informacji na temat CSS w Mozilli możesz znaleźć na głównej stronie CSS-a na tym wiki. -

{{ languages( { "en": "en/CSS/Getting_Started/XML_data", "fr": "fr/CSS/Premiers_pas/Donn\u00e9es_XML", "pt": "pt/CSS/Como_come\u00e7ar/Dados_XML", "ko": "ko/CSS/Getting_Started/XML_data" } ) }} -- cgit v1.2.3-54-g00ecf