Gözəl üfüqi xətt html. HTML-də üfüqi və şaquli xətlər

25.08.2023

Əsasən, üfüqi xətlər veb-saytın HTML səhifələrini bəzəmək üçün istifadə olunur və onlara daha cəlbedici görünüş verir. Lakin onlar həm də məlumatları bitişik bölmələrdən vizual olaraq fərqləndirə bilər, onu öyrənərkən oxuculara rahatlıq əlavə edə bilərlər. Əsasən, ehtiyac duyduğunuz yerə üfüqi xətlər çəkin, hamısı budur.

Üfüqi bir xətt necə çəkmək olar?

HTML-də üfüqi xətlərin çəkilməsi üçün xüsusi etiket var


. Və odur blok etiketi, yəni özündən əvvəl və sonra sətir fasilələri yaradır, ona görə də xətt həmişə ayrıca sətirdə bitir. Müvafiq olaraq, o, yalnız məsələn, blok elementləri ehtiva edə bilən teqlərin içərisində göstərilə bilər və ya
. Amma burdayam
məzmun ola bilməz, çünki onun sadəcə bağlanma teqi yoxdur, yəni boşdur.

HTML-də üfüqi xətlərin çəkilməsi nümunəsi

Üfüqi xətlərin çəkilməsi


Paraqraf.

Paraqraf.


Paraqraf.



Brauzerdə nəticə

Paraqraf.

Paraqraf.

Paraqraf.

Gördüyünüz kimi, xətlər çox incə, cəlbedici deyil və tam mövcud genişliyə çəkilir, buna görə də indi onları daha cəlbedici etmək üçün onları necə dəyişdirəcəyimizi öyrənəcəyik.

Üfüqi xətlərin rəngini, qalınlığını və enini necə dəyişmək olar?

HTML-in köhnə versiyalarında etiket


üfüqi xətlərin rəngini, qalınlığını və enini dəyişə biləcəyiniz xüsusi atributlar var idi. Bunlar müvafiq olaraq rəng, ölçü və genişlikdir. Ancaq yeni versiyalarda onlar Cascading Style Sheets (CSS) lehinə tərk edildi, buna görə də, yəqin ki, təxmin etdiyiniz kimi, biz yenidən sevimli stil atributumuzdan istifadə edəcəyik. Ümumi sintaksis belədir:


style="background:color" >- xəttin rəngi (daha doğrusu onun fonu).


style="hündürlük:size" >- xəttin qalınlığı.


style="en:size" >- xəttin eni.


stil = "fon:rəng; hündürlük:ölçü; en:ölçü"> - və ya bütün parametrləri bir anda təyin edə bilərsiniz, sadəcə nöqtəli vergül (;) haqqında unutmayın.

Rəng ingilis dilindəki adı ilə və ya heş (#) ilə gələn rəngin HEX kodu ilə müəyyən edilə bilər. Yaxşı, siz artıq dərsdən bu barədə bilirsiniz mətn və fon rəngini dəyişdirin.

Ancaq ölçüsünü dəyişdirmək haqqında daha çox danışacağıq. Sizdən xatırladığınız kimi şriftlərin dəyişdirilməsi dərsi, CSS-də təxminən on ölçü vahidi var, lakin xəttin eni yalnız piksel (px) və faiz (%) ilə müəyyən edilə bilər və qalınlığıümumiyyətlə yalnız piksellərlə. Digər ölçü vahidlərini qoyursanız, bu, səhv olmayacaq, lakin brauzerlər sadəcə onlara məhəl qoymayacaqlar.

Ölçüləri piksellərlə göstərsəniz, xəttin qalınlığı və eni saytınızın baxıldığı monitorun qətnaməsindən asılı olacaq (ekran həlli nə qədər yüksəkdirsə, xətt daha incə və dardır).

Artıq dediyim kimi, yalnız xəttin eni faizlə göstərilə bilər. Faiz ölçüləri həmişə asılıdır və etiketin yerləşdiyi əsas konteyner elementinin ölçüsünə əsasən hesablanır.


. Bu halda, valideynin ölçüləri 100% olaraq qəbul edilir. Məsələn, etiketi yerləşdirsək
style="en:50%" > daxili element
, onda brauzer pəncərəsinin ölçüsünü və ya monitor həllini necə dəyişdirməyimizdən asılı olmayaraq, xəttin eni həmişə blokun eninin yarısı olacaq
.

Üfüqi xətlərin rənginin, qalınlığının və eninin dəyişdirilməsi nümunəsi.

Üfüqi xətlərin rəngini, qalınlığını və enini dəyişdirin.







Brauzerdə nəticə

Üfüqi xətlərin mövqeyinin dəyişdirilməsi

Üfüqi xəttin enini dəyişdikdə, brauzerlərin həmişə onu mərkəzə yerləşdirdiyini aydın görə bilərsiniz. Onun mövqeyini dəyişdirmək istəyirsinizsə, sadəcə içəridən istifadə edin


atributu aşağıdakı dəyərlərə uyğunlaşdırın:

  • mərkəz- xətt mərkəzə düzülür (standart dəyər).
  • sol- sol kənara basır.
  • sağ- sağ kənara basır.

Üfüqi xətlərin düzülməsinə misal.

Üfüqi xətlərin yerini dəyişdirin.






Brauzerdə nəticə

Bir xətt ətrafındakı çərçivəni necə çıxarmaq olar?

Bu dərsin ilk nümunəsinə baxın. Sizcə bu xətlər hansı rəngdədir? Amma bu doğru deyil. Onlar şəffafdır, fon rəngi göstərilməyən hər hansı bir səhifə elementi kimi! Mənə inanmırsan? Sonra xətlərin rəngini dəyişdirdiyimiz nümunəyə baxın. Birincisi üçün rəngi təyin etmədik, ancaq ölçüsünü artırdıq və bu xətt şəffaf deyilmi? Budur!

İndi izah edəcəyəm. Varsayılan olaraq, brauzerlər üçölçülü effekt yaradan xətlərin ətrafında çərçivələr çəkirlər. Beləliklə, üfüqi xətlərin qalınlığını artırmadıqda, brauzerlər bizə yalnız bu çərçivələri göstərir, çünki xəttin özünün qalınlığı 0px-dir.

Tez-tez yalnız xarab olan xəttin ətrafındakı çərçivəni çıxarmaq üçün görünüş, stil atributunu yenidən tətbiq edəcəyik. Və belə yazılmışdır:


Ev tapşırığı.

  1. Məqalə, bölmə və alt bölmə başlıqları yaradın. Hamısını mərkəzə qoyun.
  2. Şrifti bütün səhifə üçün Arial, başlıqlar üçün isə Courier seçin.
  3. Bütün səhifədəki şrift ölçüsü standart brauzer ölçüsünün 85%-i olsun. Və başlıqlar səhifədəki şrift ölçüsünün müvafiq olaraq 145%, 125% və 110% -ə malikdir.
  4. Birinci başlığın altına abzas, ikincinin altına uzun sitat, üçüncünün altına isə şeir yazın. Və şeir səhifənin mərkəzində yerləşsin.
  5. Vurğulayın qalın şriftlə bir sitatda üç söz.
  6. Məqalənin başlığı altında, səhifənin bütün eni boyunca üç piksel qalınlığında üfüqi qırmızı xətt çəkin.
  7. Şeirin yuxarı və aşağı hissəsində qara rəngdə bir piksel qalınlığında xətlər çəkin. Üst xəttin eni təxminən ayənin eninə bərabər olsun, alt hissəsi isə yarısı qədər olsun.
  8. Xətlərdən lazımsız çərçivələri çıxarın.

Belə görünür ki, niyə dörd üsula ehtiyac ola bilər? Axı, demək olar ki, hər bir insan vərdiş etdiyi bir üsuldan istifadə edir. Məsələn, Shift və tire düyməsini bir neçə dəfə basdım və buna görə də üfüqi bir xətt aldım.

Bəs bu nöqtəli xəttlə nəticələnsə, ancaq möhkəm birinə ehtiyacınız olarsa?
- Çox güman ki, klaviaturada Shift düyməsi nasazdır. Burada xilasetmə üçün başqa üsullar gələcək.

3.
4.
5.

Bəlkə də Word-də sətir düzəltməyin ən ümumi yolu klaviaturada bir neçə düymədən istifadə etməkdir.

I Klaviaturadan istifadə edərək nazik, qalın, ikiqat, nöqtəli xətt

Aşağıda ingilis tərtibatı olan, lakin rus dilində tərtibatı olmayan bir klaviatura şəkli var, lakin bunun əhəmiyyəti yoxdur, çünki bizi yalnız üç düymə maraqlandırır: Shift, tire və Enter.

düyü. 1. Klaviaturada üç düymə: Word-də davamlı üfüqi xətt üçün Shift, tire və Enter

Bu üç düymə ilə Word-də davamlı üfüqi xətt çəkə bilərsiniz: nöqtəli və ya bərk, nazik və ya qalın, uzun və ya qısa.

1) “-” (tire) düyməsini bir neçə dəfə basdığınız zaman Söz redaktoru istənilən uzunluqda nöqtəli xətt alırıq.

Etmək nazik səhifənin bütün eni boyunca uzun bir xətt:

  • Klaviaturada "tire" düyməsini tapırıq ("sıfır" düyməsinin sağında, Şəkil 1-də yaşıl çərçivədə).
  • Word-də yeni (!) sətirdən bu düyməni bir neçə dəfə basın: -
  • Və sonra "Enter" () düyməsini basın. Bir neçə çap edilmiş tire qəflətən səhifənin bütün eni boyunca davamlı üfüqi nazik xəttə çevriləcək.

2) Shift və “-” (tire) düymələrini eyni vaxtda basdığınız zaman tire DEYİL, alt xətt _________ çap olunur. Beləliklə, sənədin istənilən yerində ixtiyari uzunluqda davamlı bir xətt çəkə bilərsiniz.

düyü. 2. Word-də nazik və qalın üfüqi xətt

İndi çap edək yağ səhifənin bütün eni boyunca üfüqi xətt:

  • Yenə eyni "tire" düyməsini, həmçinin Shift düyməsini (istədiyiniz kimi solda və ya sağda) tapırıq. Shift düyməsini basıb saxlayın və buraxmayın.
  • İndi isə yeni (!) sətirdən tire üzərinə bir neçə dəfə klikləyin (məsələn, 3-4 dəfə) (Shift-i buraxmadan): ___. Shift-i buraxın.
  • İndi vurun Açarı daxil edin. Qalın üfüqi möhkəm bir xətt görəcəksiniz.

Bəzi nəticələri cədvəl şəklində ümumiləşdirək:

(Böyütmək üçün klikləyin) Klaviaturadan istifadə edərək Word-də xətlər

­­­­­­­­­­­­­­­­­­­­­

II Cədvəldən istifadə edərək Word-də sətir

Yalnız yuxarı və ya alt haşiyənin rəngli olduğu (görünəcək) və cədvəlin digər üç tərəfinin rəngsiz haşiyələrə malik olduğu (görünməz olacaq) bir hüceyrədən (1x1) ibarət bir cədvəldən istifadə edərək üfüqi xətt əldə edilə bilər. .

Kursoru xəttin olması lazım olan yerə qoyun. IN yuxarı menyu Söz klik:

  • Daxil edin (Şəkil 3-də 1),
  • Cədvəl (Şəkil 3-də 2),
  • Bir hüceyrə (şəkil 3-də 3).

düyü. 3. Word proqramında 1x1 cədvəli (bir xanadan) necə daxil etmək olar

Nəticə bir böyük hüceyrədən ibarət bir cədvəl olacaq (1x1):

Yalnız 1x1 cədvəlində üç tərəfdən sərhədləri çıxarmaq qalır. Bunun üçün

  • “Ev” sekmesine keçin (Şəkil 4-də 1),
  • sonra “Şrift”in yanında “Paraqraf” və haşiyələri tapırıq (şəkil 4-də 2),
  • “Sərhədsiz” (Şəkil 4-də 3) üzərinə klikləməklə bütün sərhədləri silin;
  • “Yuxarı haşiyə” və ya “Aşağı sərhəd” seçin (Şəkil 4-də 4).

düyü. 4. Word cədvəlindən haşiyə seçimini necə silmək olar (sərhədləri görünməz etmək)

Bunu videoda (məqalənin sonunda) açıq şəkildə göstərirəm.

Yeri gəlmişkən, Şek. 3 daha asan bir yol olduğu aydındır. Kursoru Word-də sətrin əvvəlinə yerləşdirə və “Üfüqi Xətt” düyməsini sıxa bilərsiniz (Şəkil 4-də 5):

III Rəsmdən istifadə edərək Word-də xətt

Insert (Şəkil 5-də 1) - Formalar (Şəkil 5-də 2) - bu Word-də üfüqi xətt əldə etməyin başqa bir yoludur.

Xətti ciddi şəkildə üfüqi saxlamaq üçün Shift düyməsini basıb saxlayın və eyni zamanda xətti çəkin.

düyü. 5. Word proqramında xətt necə çəkilir

IV Ekran klaviaturasından istifadə edərək Word-də Xətt

Ekran klaviaturasını tapmaq üçün Axtarışda “ekran klaviaturası” ifadəsini daxil edin, Windows 7 və Windows 8 üçün ətraflı məlumatı daxil edin.

Windows 10 üçün Axtarış çubuğuna “ekran klaviaturası” yazmaqla ekran klaviaturasını da tapa bilərsiniz.

düyü. 6. Ekran klaviaturası

Adi klaviatura ilə birinci variantda olduğu kimi üfüqi bir xətt yaradacağıq. Ekrandakı klaviaturada üç düyməyə ehtiyacınız olacaq: tire, Shift və Enter.

1 Tire və Daxil edin

İLƏ yeni xətt Word-də tire (Şəkil 6-da 1) üzərinə bir neçə dəfə vurun və Enter düyməsini basın. İncə bir üfüqi xətt alacaqsınız.

2 Shift, tire və Enter

Word-də yeni sətirdən əvvəlcə Shift (Şəkil 6-da 2), sonra Dash (Şəkil 6-da 1) düyməsini basın. Siz alt xətt alacaqsınız. Bunu daha 2 dəfə təkrarlayacağıq və sonra Enter düyməsini sıxacağıq. Nəticədə qalın bir üfüqi xətt görəcəyik.

Bütün oxuculara salamlar. Zaman zaman ustalar HTML və ya istifadə edərək üfüqi və ya şaquli xətt çəkmək problemi ilə qarşılaşırlar. CSS istifadə edərək. Bu gün sizə danışacağım şey budur.

CSS-də xətlər

Xətt düzəltməyin bir neçə yolu var. Bu yollardan biri CSS istifadə edərək. Daha doğrusu, Sərhəddən istifadə etməklə. Bir nümunəyə baxaq.

Və nəticədə belə olacaq.

Css istifadə edərək üfüqi və şaquli xətt.

CSS-də Border operatorundan istifadə etməklə xətlər çəkilə bilər. Əgər sizə sadəcə sabit çərçivə eni olan düzbucaqlı lazımdırsa, onda siz sadəcə bu operatordan istifadə edib ona dəyər verə bilərsiniz. Məsələn, sərhəd: 5px bərk #000000; blok haşiyələrinin qara rəngin 5 pikselinə bərabər eninə malik olması deməkdir.

Bununla belə, bütün sərhədləri deyil, yalnız bəzilərini təyin etməlisinizsə, o zaman hansı sərhədlərin lazım olduğunu və onların hər birinin hansı dəyərə sahib olacağını dəqiqləşdirməlisiniz. Bunlar operatorlardır:

  • border-top – yuxarı haşiyənin dəyərini təyin edir
  • border-bottom – alt haşiyənin dəyərini təyin edir
  • border-left – sol sərhədin dəyərini təyin edir
  • border-right – sağ sərhədin dəyərini təyin edir.

HTML-də şaquli və üfüqi xətt

Siz HTML-nin özündə xətlər yarada bilərsiniz. Bunun üçün hr etiketindən istifadə edə bilərsiniz.

Bu halda, bir piksel yüksəklikdə və tam eni olan üfüqi bir xətt çəkiləcəkdir.

Lakin bu etiketə bəzi dəyərlər də verilə bilər.

  • Genişlik– xəttin eni dəyərini təyin edir.
  • Rəng– xəttin rəngini təyin edir.
  • Hizalayın– sola, mərkəzə, sağa düzülməni təyin edir
  • Ölçü– xəttin qalınlığının dəyərini piksellə təyin edir.

Hr etiketindən istifadə edərək şaquli xətt də təyin edə bilərsiniz. Ancaq bu vəziyyətdə, yenidən üslublara müraciət etməli olacaqsınız.

Bu halda, yüz piksel yüksəklikdə, bir piksel qalınlığında və beş piksel girintili bir şaquli xətt çəkiləcəkdir.

Nəticə.

Yaxşı, indi şaquli və üfüqi bir xətt qura biləcəyinizi bilirsiniz. Xəttlər həm HTML-dən istifadə edərək adi saytlarda, həm də CMS-dən istifadə edən saytda, məsələn, WordPress-də quraşdırıla bilər, lakin bu halda HTML rejiminə keçməli olacaqsınız.

Yaxşı, daha çox sualınız varsa, şərhlərdə soruşun.

Müəllifdən: sizi salamlayıram. Veb-səhifədə bir neçə bloku bir sətirdə təqdim etmək zərurəti layout dizaynerlərinin qarşılaşdıqları çox yaygın bir işdir. Bu, demək olar ki, hər bir şablonun tərtibatı zamanı baş verir, buna görə də hər halda, hamımız blokların davranışını dəyişdirməyin əsas üsullarını bilməliyik və tətbiq etməliyik.

Ən ümumi texnikaya baxmadan əvvəl bir az nəzəriyyəni xatırlamaq istərdim. Veb səhifənin elementləri blok və daxili elementlərə bölünür. Və onların arasındakı fərq çox sadədir - kiçik hərflər bir sətirdə yerləşdirilə bilər, lakin blok olanlar bilməz. Əlbəttə ki, fərqlər bununla bitmir, amma əsas fərq budur. Blokların yuxarı və aşağı hissəsində artıq abzaslar ola bilər (sətir daxilində olanlar yoxdur) və onlara daha çox xassə tətbiq oluna bilər.

CSS-də blokları sıralamağın əsas yolları

Heç nəyi çətinləşdirməyəcəyik, 3 əsas yol var:

Blokları daxili elementlərə çevirin. Bu halda blok xassələri itir, ona görə də bu seçim demək olar ki, istifadə edilmir

Lazımi elementləri blok xətti edin. Bu, elementin öz xüsusiyyətlərini saxladığı xüsusi bir növdür, lakin eyni zamanda digər blokların yaxınlıqda yerləşməsinə imkan verir.

Float xassəsindən istifadə edərək elementləri üzən edin.

Bu variantlara diqqət yetirək. Flexbox, masa ekranı və digər aspektləri nəzərdən keçirməyəcəyik. Beləliklə, tutaq ki, 3 alt başlığımız var.

Başlıq 1

Başlıq 2

Başlıq 3

Təbii ki, bütün css xassələri yazılmalıdır ayrı fayl(style.css), html sənədinə qoşulmaq lazımdır. Bu faylda mən minimal üslub yazacağam ki, alt başlıqlarımız sadəcə görünsün.

h3( fon: #EEDDCD; )

h3 (

fon: #EDDCD;

Budur onlar səhifədə:

Onlar blok kimi davranırlar. Hər biri öz xəttində yerləşir, onların arasında girintilər var. İstəyirsinizsə, siz də istənilən daxili padding qura və istədiyinizi edə bilərsiniz.

Gəlin onu sətirlərə çevirək və dərhal abzas əlavə edək. Bunun üçün h3 seçicisi aşağıdakı xüsusiyyətləri əlavə etməlidir:

ekran: inline; doldurma: 30px;

Bu texnikadan istifadə edərkən yaranan 2 əsas problem var. Birincisi, minimum boşluqdur. Kodda bloklar arasında bu girinti təşkil edən bir boşluq olması səbəbindən formalaşır. Bu problemi həll etmək lazımdırsa, 2 əsas seçim var:

Html-də tələb olunan blokların kodunu boşluq qoymadan bir sətirdə yerləşdirin

Sağa mənfi kənar əlavə edin -4 piksel. Bir yer nə qədər tutur.

İkinci problem odur ki, elementlər müxtəlif hündürlüklərə malikdirsə, ekran problemləri yarana bilər. Ümumiyyətlə, ən yaxşı seçim üzən bloklardır. Display: inline-block əvəzinə bunu yazırıq:

Çərçivədən istifadə edərək bir xəttdə bloklar

Dərhal deyim ki, hər hansı bir normal CSS çərçivəsini (məsələn, Bootstrap) istifadə edəcəksinizsə, onda hər şey hələ də daha sadədir. Elementlərin təşkilinə cavabdeh olan bütün CSS kodu artıq yazılmışdır və sizə lazım olan tək şey düzgün sinifləri təyin etməkdir. Bunun üçün sadəcə şəbəkə sistemini öyrənin və siz çox çətinlik çəkmədən çox sütunlu cavab verən şablonlar hazırlaya biləcəksiniz. Ən azından sıfırdan css yazmaqdan daha asan olacaq.

Sıfırdan kod yazmağın başqa bir problemi cavab verən dizayna ehtiyacınız olduqda ortaya çıxır. Əlbəttə ki, media sorğularına sahib olmaqla bunu özünüz həyata keçirə bilərsiniz, lakin mürəkkəb şablonunuz varsa, bu, daha çətin olacaq.

Məsələn, sizdə olanda böyük ekranlar 4 sütun olmalıdır, ortada - 3 və daha sonra mobil telefonlar— 2. Bootstrap kimi çərçivələrin köməyi ilə, daha doğrusu, onun gridinin köməyi ilə belə bir şeyin həyata keçirilməsi bir neçə dəqiqəlik məsələdir.

Mövzunu rəvan şəkildə Bootstrap çərçivəsinə köçürərək bir daha qeyd edəcəm ki, əgər mürəkkəb adaptiv şablon hazırlamaq vəzifəsi ilə qarşılaşırsınızsa, o zaman şəbəkədən istifadə etməmək sadəcə günahdır. Bunu etmək üçün hətta qoşulmağa ehtiyac yoxdur. tam versiyaçərçivə - onu fərdiləşdirə və yalnız həqiqətən ehtiyac duyduğunuzu orada dayandıra bilərsiniz.

istifadə edərək çərçivə ilə işləməyi öyrənə bilərsiniz. Orada nəzəriyyə izah olunur, amma ən əsası praktika var. Siz 3 adaptiv şablon yaradacaqsınız və sifariş vermək və ya özünüz üçün veb saytlar hazırlamağa imkan verəcək əla təcrübə əldə edəcəksiniz. Çərçivənin üstünlükləri və imkanları ilə pulsuz tanış olmaq istəyirsinizsə, Bootstrap haqqında, eləcə də sadə tərtibat dizaynı ilə bağlı məqalələr silsiləsi ilə tanış olmağı təklif edirəm. Sizə layout və ümumiyyətlə veb saytın qurulmasında uğurlar arzulayıram.

Tapşırıq

Səhifədə üfüqi bir xətt çəkin.

Həll

Üfüqi xətlər bir mətn blokunu digərindən ayırmaq üçün yaxşıdır. Üst və aşağı üfüqi xətləri olan kiçik mətn oxucunun diqqətini adi mətndən daha çox cəlb edir.

Etiketdən istifadə


üfüqi bir xətt çəkə bilərsiniz, görünüşü istifadə olunan atributlardan, həmçinin brauzerdən asılıdır. Teq blok elementlərinə aiddir, ona görə də xətt həmişə yeni sətirdən başlayır və ondan sonra bütün elementlər növbəti sətirdə göstərilir. Çoxlu etiket atributları sayəsində
bu etiket vasitəsilə yaradılan xətti idarə etmək asandır. Üslubların gücünü də birləşdirsəniz, sənədə xətt əlavə etmək sadə bir işə çevrilir.

Defolt xətt


boz rəngdə və həcm effekti ilə göstərilir. Bu tip xətt həmişə saytın dizaynına uyğun gəlmir, buna görə tərtibatçıların üslublar vasitəsilə xəttin rəngini və digər parametrlərini dəyişdirmək istəyi başa düşüləndir. Bununla belə, brauzerlərdə bu məsələyə qarışıq yanaşmalar var, buna görə də bir anda bir neçə üslub xüsusiyyətlərindən istifadə etməli olacaqsınız. Xüsusilə, brauzerin köhnə versiyaları Internet Explorer

Xəttin rəngi üçün rəng xassəsindən, digər brauzerlər isə background-color istifadə edir. Ancaq bu, hamısı deyil, siz xəttin qalınlığını (hündürlük xassəsini) sıfırdan fərqli olaraq təyin etməlisiniz və sərhəd xassəsini heç biri olaraq təyin edərək xəttin ətrafındakı çərçivəni çıxartmalısınız.

Saat seçicisi üçün bütün xassələri bir araya gətirməklə biz məşhur brauzerlər üçün universal həll əldə edirik (nümunə 1).

Nümunə 1: Üfüqi xətt


HTML5 CSS 2.1 IE Cr Op Sa Fx




Üfüqi xətt rəngi Mətn sətri Nəticə

bu misal