W układzie miejscu należy rozmieścić wszystkie elementy, tak aby stanowiły one spójną strukturę i są łatwe do zrozumienia użytkownikowi końcowemu. Wykonywanie layoutów stron HTML - najłatwiejszy sposób na uczynienie witryny łatwą i czytelną.
dostosowywanie elementów strony
Na przykład, tekst nagłówka może zapewnić nie tylko pogrubione lub większa czcionka, ale umieszczone w środku, a menu blokowego, przesunął się w lewo lub w prawo, pomaga precyzyjnie zidentyfikować główne łącze. Najłatwiejszym sposobem dopasowania szerokości jest użycie znaczników HTML lub narzędzi CSS.
wyrównania z wykorzystaniem HTML
Poniżej znajduje się przykład kodu, który wyświetli przykłady podstawowych metod formatowania w celu dostosowania szerokości w HTML. Umieszczenie tekstu odpowiada atrybutowi align, który działa z takimi tagami jak ,,
i inne. Składnia jest następujący:
W pierwszym tytułowy w tym przykładzie jest usytuowane w centrum
wyrównania, napisów na prawej
(28 ) Dla długiego elementu tekstu składającego się z kilku zdań odpowiednia jest opcja z wyrównaniem szerokości.
Poprawia to czytelność tekstu.
po lewej napisów
Kopia powyższy przykład w notatniku i zapisać jako plik HTML. Otwierając go w dowolnej przeglądarce, zobaczysz w praktyce, jak pracować z wyrównaniem.
Można go stosować nie tylko do tekstu, ale także do obrazów, kod będzie wyglądał następująco:
W tym przykładzie wyrównanie jest wyśrodkowane w HTML. Spróbuj eksperymentować i przesuwać obraz w prawo lub w lewo przy użyciu odpowiednich wartości atrybutów.wyrównaj.
& lt; script type = "text /javascript" & gt;
zmienna blockSettings2 = {blockID "R-A-271049-5" renderTo "yandex_rtb_R-A-70350-39" asynchroniczny :! 0};
jeśli (document.cookie.indexOf ("abmatch =") i GT = 0) blockSettings2.statId = 70350;
! Zastosowanie (a, b, c, d, e) {A [c] = A [c] || [] A [c] .Push (funkcja () {Ya.Context.AdvManager.render (blockSettings2)}), e = b.getElementsByTagName ("scenariusz")d = b.createElement ("scenariusz") d.type = "text /JavaScript" d.src = „//an.yandex .ru /System /context.js "d.async = 0e.parentNode.insertBefore (d, e)} (to this.document," yandexContextAsyncCallbacks „);
Wyrównanie CSS
Odpowiednio pozycjonuj elementy strony, nie tylko przy pomocy HTML, ale także narzędzi CSS. Aby wykonać to zadanie, używana jest właściwość stylu, taka jak wyrównanie tekstu. On przepisał lub w tagu bezpośrednio do ciała dokumentu HTML lub wykupić oddzielny plik z rozszerzeniem .css arkusza stylów, który jest następnie podłączony.
Pierwsza opcja jest lepsza do użycia na stronach, które są słabo załadowane stylami. Jeśli liczba kodu CSS jest bardzo duża, zaleca się utworzenie osobnego dokumentu zawierającego arkusz stylów.
Składnia wyrównania elementów tekstowych będzie wyglądać następująco.
p {
wyrównanie tekstu: centrum; /* Wyrównanie środka * /
}
h1 {
wyrównanie tekstu: w prawo; /* Prawidłowe wyrównanie * /
}
h2 {
wyrównanie tekstu: w lewo; /* Wyrównanie do lewej * /
}
Można zauważyć, że wartości tej właściwości będą podobne do wartości ustawionych podczas wyrównywania w środku w HTML. To samo dotyczy lokalizacji tekstu na prawej i lewej krawędzi lub na całej szerokości strony.
Utwórz dokument tekstowy i skopiuj tam kod. W tym przykładzie główne akapity zawarte w tagu
zostanie umieszczony na środku strony, nagłówki pierwszego poziomu pojawią się po prawej stronie, a podtytuł drugiego poziomu po lewej stronie.
& lt; script type = "text /javascript" & gt;
zmienna blockSettings3 = {blockID "R-A-271049-6" renderTo "yandex_rtb_R-A-70350-44" asynchroniczny :! 0};
jeśli (document.cookie.indexOf ("abmatch =") i GT = 0) blockSettings3.statId = 70350;
! Zastosowanie (a, b, c, d, e) {A [c] = A [c] || [] A [c] .Push (funkcja () {Ya.Context.AdvManager.render (blockSettings3)}), e = b.getElementsByTagName ("scenariusz")d = b.createElement ("scenariusz") d.type = "text /JavaScript" d.src = „//an.yandex .ru /System /context.js "d.async = 0e.parentNode.insertBefore (d, e)} (to this.document," yandexContextAsyncCallbacks „);
Wśród współczesnych twórców stron internetowych i specjalistów od layoutów wykorzystanie arkuszy stylów jest uważane za najlepszy sposób optymalizacji strony internetowej.
inne sposoby formatowania
Dodatkowo do powyższych sposobów wykonania uzasadnienie HTML są przez drugi znak, który może być umieszczony w razie potrzeby.
Na przykład znacznik
Wzrost lewego wcięcia
znajduje się w podobny sposób, aby wielki odwrót od lewej wartość za pomocą CSS. Aby to zrobić, użyj następującej właściwości stylu.
,Wzrost lewego wcięcia
,Wykorzystując ten sam sposób może przepisać wartość, która odpowiada szerokości odwrót. Spróbować tej metody i zmienić wielkość wcięcia na dowolny inny, aby zrozumieć zasadę. Kolejny ciekawy tag, który może być użyty do formatowania tekstu, ale wnasz czas prawie całkowicie stracił znaczenie - jest. Jego zadaniem jest wyłączenie automatycznego transportu liniowego, nawet jeśli ta linia jest większa niż szerokość okna przeglądarki.
