Başlayanlar üçün HTML TəlimatıBir HTML öyrənmək istərdiniz?


Çox gözəl bir fikir kimi səslənir. Bu HTML dərsliyini yeni başlayanlar üçün bir yerə yığmağımızın səbəbi.

Bu gün dünyada ən azı 1,7 milyard veb sayt var. Praktiki olaraq bütün bu veb saytlar HTML-dən bu və ya digər şəkildə istifadə edirlər.

P.S: HTML öyrənmək və veb saytınızı dərhal kodlaşdırmadan qurmağa başlamaq istəmirsinizsə, bu təlimata nəzər yetirin: PULSUZ Veb saytı necə hazırlamaq (HTML öyrənmədən).

HTML-yə giriş


HTML nədir?

HTML nədirHTML, HyperText İşarələmə Dili üçün bir qısaltma, veb saytlar və veb tətbiqləri yaratmaq üçün kompüter dilidir. Adətən bir mətn sənədində yazılan və HTML olaraq qeyd olunan bir sıra kodlardan ibarət olan HTML dilində yazılmış kod, brauzer vasitəsilə baxıldıqda gözəl, yaxşı formatlaşdırılmış bir mətnə ​​və ya mətn və media birləşməsinə çevrilir..

HTML ilk dəfə 1990-cı ildə İngilis fiziki Tim Berners-Lee tərəfindən hazırlanmışdır və o vaxtdan bəri o qədər təkamül yolu keçmişdir ki, ən yeni versiya dil ilk dəfə icad edildiyi zaman təsəvvür ediləndən daha çox şey əldə edə bilər..

Bu dərslikdə HTML dilinin əsaslarından keçəcəyik və HTML ilə yeni başlayan kimi başlamaq üçün bilmək lazım olan bütün şeylər.

HTML versiyaları

Birincisi, HTML icad edildiyi vaxtdan etibarən bütün HTML versiyalarının qısa bir qisası.

  • HTML 1.0: Bu HTML-nin çılpaq sümükləri və dilin ilk versiyası idi.
  • HTML 2.0: Bu versiya 1995-ci ildə təqdim edildi. Tədricən inkişaf etdi, əlavə əsas imkanlar şəklinə əsaslanan fayl yükləmə, masalar, müştəri tərəfi xəritələri və beynəlmiləlləşmə daxil edildi.
  • HTML 3.2: Ümumdünya Veb üçün standartların inkişafını təmin etmək məqsədi ilə, 1994-cü ildə Tim WareCersium (W3C) Tim Berners-Lee tərəfindən təsis edildi. 1997-ci ilə qədər HTML 3.2 nəşr etdilər..
  • HTML 4.0: Daha sonra 1997-ci ildə W3C HTML 4.0 – bir çox brauzerə aid element növləri və atributlarını qəbul edən bir versiya buraxdı.
  • HTML 4.0 daha sonra 1998-ci ildə kiçik düzəlişlərlə yenidən nəşr edildi.
  • HTML 4.01: 1999-cu ilin dekabr ayında HTML 4.01 buraxıldı.
  • XHTMLXüsusiyyətlər 2000-ci ildə təqdim edildi və HTML 4.01 ilə ortaq standart olaraq istifadə edilməsi tövsiyə edildi. Kodun düzgün yazıldığını və proqramlaşdırma dilləri arasında qarşılıqlı əlaqəni təmin etmək üçün XML-i özündə birləşdirdi.
  • HTML5: W3C 2014-cü ilin oktyabrında HTML5 tövsiyəsi olaraq nəşr etdi və daha sonra 2016-cı ilin noyabrında HTML 5.1-i buraxdı.

HTML redaktorunuzu seçmək

HTML redaktorunu seçinHTML-də veb səhifələr yaratmağı düşünürsənsə, HTML redaktoruna ehtiyacınız var. Bir HTML redaktorunu istifadə etməyin bir neçə faydası var.

Yaxşı bir HTML redaktoru kodunuzu təmiz və mütəşəkkil saxlayacaqdır. Ayrıca yeni bir etiket açdığınızda aşkar edər və səhv bir koda sahib olmamağınız üçün avtomatik olaraq bağlanar və nəticədə nə qədər yazmağı azaltmış olarsınız. Bu gün əksər HTML redaktorları veb səhifənizi WYSIWYG xüsusiyyətindən istifadə edərək veb brauzerində necə görünəcəyini görmək üçün imkan verir..

Bir çox pulsuz və pullu HTML redaktorları var, aşağıda seçim edə biləcəyiniz ən yaxşı seçimlərdən bəziləri var:

HTML-nin əsas tikinti blokları


Istifadə etmək istədiyiniz HTML redaktoru barədə qərar verdikdən sonra növbəti addım HTML-nin tikinti bloklarını başa düşməkdir. HTML-də kodlaşdırarkən bu tikinti bloklarını başa düşmək vacibdir. Bunlara etiketlər, atributlar və elementlər daxildir. Bunları aşağıda nəzərdən keçirəcəyik:

Etiketlərə giriş

HTML-yə girəndən sonra anlamaq lazımdır ilk şey etiketlərdir. Əslində etiketlər normal mətni HTML kodundan ayırır.

Nəticə etibarilə, HTML-yə gəldikdə, etiketlər sənədinizin adi mətn kimi göstərilməməsi və ya bir sıra şeyləri (hiperlink, şəkillər, media və ya digərləri) göstərmək üçün görünən mətn kodu olan “dəyişdirilmiş mətn” arasında fərq yaradır. biçimlendirme metodları) etiketlərə əsaslanaraq göstərilməsi üçün göstəriş verdiyinə əsaslanaraq.

Nümunə olaraq “O oğlandır” sözünə nəzər salaq:

  • Adi mətn formatında, əldə edirsiniz: O oğlandır.
  • Qalın mətn formatında, əldə edirsiniz: Oğlan uşağıdır

Qalın bir formatda olan şeyə çatmaq üçün istifadə etməlisiniz etiket.

html-də mətni qalın hala gətirmək

Xam HTML-də var Oğlan uşağıdır sonra brauzer bunu tərcümə edir: Oğlan uşağıdır.

“O oğlandır” da italiv olaraq çıxa bilər.

Bu istifadə edərək əldə edilir etiket.

mətni html-də itivləşdirilmiş etmək

Bizdə: Oğlan uşağıdır bundan sonra ortaya çıxır Oğlan uşağıdır.

İstifadəsi ilə istifadə olunur etiket.

mətni html-də hiperedləşdirmək

Xam HTML-də var: O, oğlan olduğunu göstərən oğlandır.

Etiketlər haqqında başa düşməli olduğunuz bir neçə şey var:

  • Etiketlər, demək olar ki, HTML’nin bina blokudur – HTML etiket olmadan edə bilməzsiniz! Hansı etiketin istifadə ediləcəyi üzərində yapışmış olsanız, HTML dövri cədvəlimizdən əmin olun.
  • Demək olar ki, hər açıq etiket bağlanmalıdır. Unutmayın ki, istisnalar var. Bağlanmaq məcburiyyətində olmayan bir etiket nümunəsi, xətt kəsilməsi kimi boş bir etiketdir:
    .
  • Etiketlər daha az yerdədir (“<”) and greater than (“>”) Bucaq mötərizəsi. Bağlayıcı etiketlərdə etiketin adı bağlanmazdan əvvəl yaranan cızıq var. Açıq etiket nümunəsi: . Qapalı etiket nümunəsi .
  • Hər HTML faylı açılış etiketi ilə başlayır və bağlama etiketi ilə bitir. HTML sənədinin birinci sətri sənədin növünü elan etməlidir ki, brauzer istifadə etdiyiniz HTML ləzzətini bilsin. Buna görə HTML səhifələrin ““HTML kodu başlamazdan əvvəl.

Məzmun əlavə edilmədən əvvəl, HTML sənədlərinin əksəriyyəti əsasən belə görünür:

HTML--

Aşağıdakı bölmə etiket adətən sənədin adı, meta etiketləri və CSS sənədini harada tapmaq olar – brauzer səhifəsində birbaşa görünməyən məzmun. Arasındakı bölmə və“(” MAIN CONTENT “ilə təmsil etdiyimiz) tamaşaçının brauzerdə görəcəyi HTML sənədinin əsas məzmununun yerləşdiyi yerdir. Buraya birinci abzasdan tutmuş hiperlinkə qədər bütövlükdə multimedia və hər şey daxil edilir.

Elementlərə giriş

elementlərə giriş

HTML-də bir “element” açılış və bağlama etiketindən, etiketlər arasındakı məzmundan ibarətdir.

İçində “Oğlan uşağıdır“(Qalın) misal üçün, HTML-də bu var: Oğlan uşağıdır. “O bir oğlandır” mətni açıq və qapalı etiket ilə əhatə olunmuşdur. Açılış etiketi, məzmun və yaxın etiket daxil olmaqla hər şey bir elementdir.

Etiket açıldıqda, məzmun təqdim olunur və etiket bağlanırsa, bir elementimiz var.

Bir element təməl şəklində və ya kompleks bir formada ola bilər. Niyə? Çünki açıq etiket və bağlama etiketi arasındakı hər hansı bir şey bir elementdir. Bir element içərisində bir şeyə sahib ola biləcəyimiz deməkdir. Mövcud nümunəmizdə “o oğlandır” (Oğlan uşağıdır) bir elementdir.

Daha əvvəl HTML sənədlərinin tərkibində olduğunu söylədiyinizi görəcəksiniz məzmun başlamazdan əvvəl etiket edin. Məzmun yüzlərlə müxtəlif elementi əhatə edə bilər, lakin bütün bu elementlər “bədən” elementidir (bədən elementi açıq olduğundan, tərkib hissəsi var və sonra bağlanır)..

Atributlara giriş

HTML sənədlərində əsasən hər şey üçün etiketlərdən istifadə edilsə də, bəzən bir element daxilində əlavə məlumat ötürmək istəyirik. Bu vəziyyətdə bir atributdan istifadə edirik. Atribut bir elementin xüsusiyyətlərini müəyyən etmək üçün istifadə olunur, elementin açılış etiketində istifadə olunur. Xüsusiyyətlər bir ad və bir dəyərdən ibarətdir.

Diqqət yetirin ki, bir atributun dəyəri formatdan istifadə edərək bir kotirovka nişanına yerləşdirilir Mətniniz.

bir atribut nümunəsi

Nümunə:

Oğlan uşağıdır

Bu misalda, sənədin mərkəzində “O oğlan” olduğunu göstəririk.

HTML ilə işə başlamaq


HTML ilə başlayınBu gün öz əsas HTML sənədinizi yaratmaq istəsəniz, necə başlamısınız? Səhifələrin adlarını yaratmadan formalar yaratmağa qədər, aşağıda HTML ilə necə başlamağınız barədə sizə məlumat verəcəyik.

HTML yaratmaq Element

HTML sənədini yaratarkən ilk yaradacağınız şeylərdən biridir element. Bu metadata (və ya HTML sənəd haqqında məlumatlara) malikdir. Buraya simvol dəsti, sənəd başlığı, sənəd tərzi, skript və s. Kimi məlumatlar daxildir.

Bəzi elementlər ilə yaradılmış başlığı daxil edin etiket.</p><p><strong>Nümunə</strong>:</p><pre><title>Bu səhifə başlığıdır

Bu başlıq brauzer sekmesinde göstərilir. Axtarış motorları botları veb saytınızı sürüklədikdə səhifənin adı kimi indekslənəcəkdir.

Buraya da daxildir tez-tez məlumat axtarış motorlarını siyahılarında məzmunu təsvir etmək üçün istifadə edə bilən element. Buraya təsvir, açar sözlər, müəllif məlumatı və s. Daxildir element həmçinin HTML sənədinin istifadə etdiyi simvol dəstini müəyyənləşdirir.

HTML-də başlıqlar yaratmaq

html-də başlıqlar yaratmaq

Bir veb saytın müvəffəqiyyətində başlıqlar böyük rol oynayır. Birincisi, oxucuların səhifələrinizin məzmununu skan etməsini asanlaşdırırlar. İkincisi, bəlkə də daha əhəmiyyətlisi, veb səhifələrinizin quruluşunu axtarış motorları ilə əlaqələndirirlər və buna görə də tez-tez məzmununuzun axtarış sisteminin nəticələrində sıralanmasına təsir göstərir..

Dediyiniz kimi, mətninizi böyük və ya qalın hala gətirmək üçün başlıq yazılarından istifadə etməmək vacibdir. Bunun üçün istifadə edilə bilən digər etiketlər də var (bu bölmədə daha sonra əldə edəcəyik). Bunun əvəzinə başlıq etiketləri yalnız quruluş üçün istifadə edilməlidir.

HTML-də altı baş etiketi var:

üçün

, ilə

ən vacib başlığı və yeri göstərən etiket

ən az əhəmiyyətli başlığı göstərən etiket.

Başlıqlar yaratmaq üçün nə başlıq yaratdığınıza qərar verin, adi başlıq etiketi ilə başlığı açın və etiketləri bitirdikdən sonra da unutmağı unutmayın..

HTML başlıqları nümunəsi:

  • Bu, ilk HTML başlığınızdır

    (ən böyük)

  • Bu, ikinci HTML başlığınızdır

  • Bu Üçüncü HTML başlığınızdır

  • Bu Dördüncü HTML başlığınızdır

  • Bu, Beşinci HTML başlığınızdır
  • Bu Altıncı HTML başlığınızdır

Paraqraflar yaratmaq

HTML-də paraqraflar yaratmaq

Növbəti addım paraqraflar yaratmağa başlamaqdır. Paraqraflar ilə yaradıla bilər

etiket.

Nümunə:

Bu, birinci abzasınızdır.

Bu ikinci abzasınızdır və daha çox paraqraf yaradacaqsınız.

Unutmayın ki, HTML-də yazmaq təmiz mətnlə yazmaqdan çox fərqlidir. Buna görə, yeni bir paraqraf başlamadan HTML içərisindəki mətni parçalatsanız, mətn brauzer tərəfindən göstərildiyi zaman heç bir əhəmiyyət kəsb etməz. Bunun əvəzinə, ilə təmsil olunan bir xətt fasiləsindən istifadə etmək istəyirsiniz
etiket.

Nümunə:

Bu yeni bir abzasdır. Və bir sıra yeni xətlərdən istifadə etmək istəyirəm. Buna görə onu parçalayıram.

Bu aşağıdakı kimi çıxmayacaq:

Bu yeni bir abzasdır.
Və bir sıra yeni xətlərdən istifadə etmək istəyirəm.
Buna görə onu parçalayıram.

Bunun əvəzinə bu cür çıxacaq:

Bu yeni bir abzasdır. Və bir sıra yeni xətlərdən istifadə etmək istəyirəm. Buna görə onu parçalayıram.

Beləliklə, mətnləri yeni sətirlərə necə parçalayırsınız ki, belə görünsün:

Bu yeni bir abzasdır.
Və bir sıra yeni xətlərdən istifadə etmək istəyirəm.
Buna görə onu parçalayıram.

Xətt fasilələrindən istifadə etməklə.

Nümunə:

Bu yeni bir abzasdır.
Və bir sıra yeni xətlərdən istifadə etmək istəyirəm.
Buna görə onu parçalayıram.

Dedi, xəttin qırıldığını qeyd etmək vacibdir (
) etiket boş bir etiketdir, buna görə onu bağlamaq lazım deyil.

HTML-də mətni formatlaşdırmaq

HTML-də mətni formatlaşdırmaq

Növbəti addım mətninizi HTML formatında formatlaşdırmaqdır. Mətninizin qalın, işarələnmiş, alt altına alınmış, alt yazıya alınmış, üstün yazılmış və s. Çıxmağını istəməyinizi göstərə biləcəyiniz yer budur. Bu əsas bələdçidir, ona görə də bu bölmə formatlaşdırma üçün hamısı sona çatmayacaqdır. Bunun əvəzinə yalnız bir neçə əsas format etiketini daxil edəcəyik. Digər formatlaşdırma formalarından istifadə prosesi sadədir – sadəcə istədiyiniz etiketi tapın və davam edin:

Cəsarətlə istifadə olunur: Oğlan uşağıdır kimi çıxır Oğlan uşağıdır

Kursiv istifadə: Oğlan uşağıdır kimi çıxır Oğlan uşağıdır

Alt mətn: Oğlan uşağıdır kimi çıxır Oğlan uşağıdır. Qeyd etmək lazımdır etiket HTML 4.01-də ləğv edildi və HTML5-də stilistik olaraq fərqli mətni təmsil etmək üçün yenidən təyin olundu. Nəticədə vurğulanmalı olan mətni göstərmək üçün CSS-dən istifadə etmək tövsiyə olunur. Bu məqalə əsas bələdçi olduğundan onu sadə saxlayırıq.

Alt yazıdan istifadə: Oğlan uşağıdır kimi çıxır Oğlan uşağıdır

Üstün yazı istifadə olunur: Oğlan uşağıdır kimi çıxır Oğlan uşağıdır

Formatlaşdırmaq üçün istifadə edilə bilən digər etiketlər üçün çoxlu sayda müvafiq HTML etiketini daxil etdiyimiz bu mənbənin sonundakı lüğətə nəzər salmaq istəyə bilərsiniz..

Sifarişli və qaydasız siyahılar

Gec-tez siyahılar yaratmalı olacaqsınız. Siyahılar sifariş verilə bilər (yəni nömrələnmiş) və ya nizamlanmamış (yəni nömrəsiz).

Bir sifariş siyahısına bir nümunə:

  1. 1-ci bənd
  2. 2-ci bənd
  3. 3-cü bənd

Bunu necə yaratmaq olar:

  1. 1-ci bənd
  2. 2-ci bənd
  3. 3-cü bənd

Sıralanmamış bir siyahının nümunəsi:

  • 1-ci bənd
  • 2-ci bənd
  • 3-cü bənd

Bunu necə yaratmaq olar:

  • 1-ci bənd
  • 2-ci bənd
  • 3-cü bənd

Onsuz da bəlli deyilsə. Budur qəza:

The

  • etiket siyahıdakı hər bir elementi göstərmək üçün istifadə olunur. Bir siyahı tərtib edərkən istifadə edə bilərsiniz
      sifariş edilmiş bir siyahını göstərmək üçün etiket (“o” = sifariş edilmiş və “l” = siyahı) və ya

        tənzimlənməmiş bir siyahını göstərmək üçün etiket (“u” = tənzimlənməmiş və “l” = siyahı). Gist almısan?

        Daxil siyahıları

        Ayrıca iç iç siyahılar və ya bir siyahı içərisində bir siyahı da ola bilər.

        Misal:

        • 1-ci bənd
          • 1-ci element iç içə
          • Maddə 2 iç içə
        • 2-ci bənd
        • 3-cü bənd

        Bu ilə yaradıla bilər:

        • 1-ci bənd
          • 1-ci element iç içə
          • Maddə 2 iç içə
          • Maddə 3 iç içə
        • 2-ci bənd
        • 3-cü bənd

        Gördüyünüz kimi, sadəcə başqa bir etiket etiketini açırsınız – sifarişli (

          ) və ya tənzimlənməmiş (

            ) – yuva qurmaq istədiyiniz elementi bağlamadan əvvəl nə istədiyinizə bağlıdır.

            HTML-də hiperlink yaradır

            İnternet, kütləvi şəkildə bir-biri ilə əlaqəli səhifələr şəbəkəsidir. Bir veb sayt yaratsanız – istər daxili, istər xarici, istərsə də hər ikisi – digər səhifələrə bağlanmalı olacaqsınız. Veb saytınızdakı daxili bir səhifəyə və ya vebdəki xarici bir səhifəyə bir keçid deyilir. İnsanlar ümumiyyətlə bir mətn bağlasalar da, hər hansı bir HTML elementi – məsələn, bir şəkil bağlana bilər.

            The etiket HTML-də əlaqələri təyin etmək üçün istifadə olunur, “href” atributu isə bir keçidin təyinatını təyin etmək üçün istifadə olunur. Bundan sonra etiket bağlandıqdan əvvəl “bərabər” işarəsindən sonra bir təklif qoyulur.

            Nümunə:

            Bir keçid yaratmaq üçün bu: SİZİN LİNƏNİN MƏKTƏBİ BURA SİZİN MİN Mətniniz BURADA çıxacaq

            İndi eyni qovluqdakı bütün HTML səhifələrinizin olduğu bir yerli faylla əlaqələndirdiyinizi düşünün. Bu vəziyyətdə veb sayt URL əlavə etməyiniz lazım deyil. Yalnız fayl yolunu əlavə edin. Məsələn, haqqında-səhifə.html adlı bir faylla əlaqələndirsəniz, sizin keçidiniz olur SİZİN LİNƏDƏN MƏNFƏ, ki, səhifə -htt.html faylı ilə əlaqələndirir.

            Bağlamaq istədiyiniz HTML faylı yerli olsa da əsas qovluqdan fərqli bir qovluqdadırsa, sadəcə fayl yolunu göstərəcəksiniz. Məsələn, sənəd cari sənədinizin olduğu əsas sənədin altındakı “sənədlər” qovluğunda olarsa, gipolunuz bu kimi bir şeyə keçir SİZİN LİNƏDƏN MƏNFƏ

            Bağlantının necə açılmasını istədiyinizi göstərə bilərsiniz, məsələn. yeni bir pəncərədə / nişanda. Bunun üçün hədəf atributundan istifadə edəcəksiniz.

            Nümunələr:

            SİZİN LİNƏDƏN MƏNFƏ əlaqənin yeni bir sekmədə açılacağını göstərir.

            SİZİN LİNƏDƏN MƏNFƏ əlaqənin eyni sekmədə açılacağını göstərir.

            Bir keçidin açılmasının fərqli yolları ilə əlaqə qurmaq üçün istifadə edilə bilən digər xüsusiyyətlər var:

            • _blank – Yeni nişanda açın.
            • _ özü – eyni sekmədə açın.
            • _parent – Ana çərçivədə açın
            • _top – Pəncərənin tam bədənində açın
            • çərçivə adı – Adı verilən bir çərçivədə açın

            Bir keçid üçün bir görüntü nöqtəsinə də sahib ola bilərsiniz.

            Nümunə:

            Oğlan uşağıdır
            

            Bu brauzerə “images / html-tutorial-for-beginners-3.jpg” görüntü faylı üzərindən çəkilmiş bir görüntünün görüntülənməsini və onu https://websitesetup.org saytına bağladığını bildirir. “Alt” atributu görüntünün göstərilə bilməyəcəyi təqdirdə nə göstərilməsini əks etdirir (brauzer parametrləri və ya görüntülərin qarşısını alan bəzi digər məlumatlar səbəbindən).

            Şəkillərdən istifadə

            HTML-də şəkillərdən istifadə etməklə

            Şəkillər HTML sənədinə əlavə olunur etiket. The etiket boş bir etiketdir, buna görə bağlanmağa ehtiyac yoxdur.

            Nümunə:

            Oğlan uşağıdır

            Bu brauzerə HTML sənəd ilə eyni qovluqdan çəkilmiş “images / html-tutorial-for-beginners-3.jpg” adlı bir görüntünün göstərilməsinin əsas nümunəsidir. “Alt” atributu, brauzer və ya internet parametrləri nədənsə brauzerin görüntüləməsini maneə törədirsə, “O oğlandır” adlı bir mətn (“alternativ mətn” kimi tanınır) göstərməsini söyləyir. Başqa bir qovluqda və ya xarici bir saytda bir şəkil çəkmək istəyirsinizsə, tam ünvan / yol göstərilməlidir.

            Əsaslardan kənara çıxmaqla, görüntünü daha yaxşı tənzimləmək üçün digər xüsusiyyətlərdən də istifadə edə bilərik. Məsələn, “stil” atributu eni, boyu və ya hər ikisini təyin etmək üçün istifadə edilə bilər.

            Nümunə:

            SİZİN ALTERNATİV Mətniniz

            (itivallaşdırılmış “genişlik” və “hündürlük” şəkilləriniz üçün istədiyiniz “px” (məsələn, “20px”) dəyərləri ilə əvəz olunmalıdır.)

            Masaların yaradılması

            HTML-də masalar yaratmaq

            HTML’yi daha dərinə getdikcə məlumatları daha mütəşəkkil bir şəkildə təqdim etməyin müxtəlif yollarını öyrənmək istəyəcəksiniz. Belə üsullardan biri masaların istifadəsidir.

            İlə masalar yaradılmışdır

            etiket. Bir cədvəlin hər başlığı ilə göstərilmişdir

            (“Masa sıra”) etiketi. Bundan sonra cədvəl məlumatları ilə göstərilir

            (“Masa başlığı”) etiketi, hər bir sıra ilə göstərildiyi zaman

            etiket.

            Nümunə:

            Cədvəl başlığı 1 Cədvəl başlığı 2 Cədvəl başlığı 3
            Başlıq 1 altına 1 daxil edin Başlıq 2 altına 1 daxil edin Başlıq 3 altına 1 daxil edin
            Başlıq 1 altına 2 daxil edin Başlıq altına 2 daxil edin Başlıq 3 altındakı 2 giriş
            Başlıq 1 altına 3 daxil edin Başlıq 2 altına 3 daxil edin Başlıq 3 altına 3 daxil edin

            Bu bizə belə bir şey verir:

            masa nümunəsi 1

            Gördüyünüz kimi, masamız var, bir az mütəşəkkil deyil. Təşkil etmək üçün koda bəzi üslub əlavə edə bilərik. Bu vəziyyətdə genişliyi artırırıq:

            Cədvəl başlığı 1 Cədvəl başlığı 2 Cədvəl başlığı 3
            Başlıq 1 altına 1 daxil edin Başlıq 2 altına 1 daxil edin Başlıq 3 altına 1 daxil edin
            Başlıq 1 altına 2 daxil edin Başlıq altına 2 daxil edin Başlıq 3 altındakı 2 giriş
            Başlıq 1 altına 3 daxil edin Başlıq 2 altına 3 daxil edin Başlıq 3 altına 3 daxil edin

            Bu daha mütəşəkkil bir şeyə səbəb olur:

            masa nümunəsi 2

            Daha inkişaf etmiş və sərhədlərdən istifadə etmək, cədvəlin məzmunu üçün üfüqi və ya şaquli uyğunlaşdırma qurmaq, bölücülər, padding və s təqdim etmək istəyə bilərsiniz. Lakin bu kimi işləri görmək üçün bəzi CSS-lər öyrənməlisiniz. Biz bu təlimatı əsas tuturuq və bu məqaləyə daxil ola bilmərik.

            HTML-də kotirovkalar

            HTML-də kotirovkalar

            Fərqli kotirovkalar mövcuddur və bu kotirovkalar fərqli elementlərlə təmsil olunur.

            Əsas kotirovka üçün bir nümunə var:

            Bu bir nümunədir. Və Budur bizim təklifimiz

            Bu ortaya çıxır: Bu bir nümunədir. Və “Budur bizim təklifimiz”

            İstifadə edərkən etiket, kotirovkalar avtomatik olaraq etiket daxilinə əlavə olunur.

            Bununla yanaşı, bloknotlardan da istifadə edə bilərsiniz

            etiket.

            Misal:

            Bu bir nümunədir. Və

            Budur bizim blokumuz. Bu nümunədə HTML-də bir bloknotu göstərmək üçün mətni necə formatlaşdırmağı göstərməyə çalışırıq. Bu, adi kotirovkalardan fərqlidir ki, CSS üslubundan asılı olaraq faktiki "sitat" simvolu əlavə oluna bilər və ya əlavə olunmur, lakin mətn vurğulanır.

            Bu belə olacaq:

            blockquote nümunəsi 1

            HTML-də Şərhlərdən istifadə

            Kodlaşdırmanın hər hansı bir formasını edərkən kodunuza şərhlərin necə daxil edilməsini öyrənmək vacibdir. Şərhlər kodunuzu daha mütəşəkkil etmək üçün istifadə olunur. İşlərinizi asanlaşdırmaq üçün özünüzə bir öyüd-nəsihət və ya başqalarına bir qeyd əlavə edə bilərsiniz.

            Başlanğıcda, bu əhəmiyyətli görünə bilməz, ancaq yüzlərlə və ya minlərlə sətir şifrə yazmağa başlayanda və işlərin çətinləşməyə başladığı görünəndə şərhlər lazımlı olacaq.

            Şərhlər brauzer tərəfindən izləyiciyə göstərilmir. Unutmayın ki, bunları mənbə kodunda görmək mümkündür.

            Şərhlər kodun hər hansı bir yerində də istifadə edilə bilər. Kodunuzun funksiyasını heç bir şəkildə dəyişdirə bilməzlər.

            İkiqat defis də daxil olmaqla mötərizə açaraq şərhinizi əlavə edə bilərsiniz, başqa qoşa defis də daxil etməklə və mötərizəni bağlamaqla.

            Nümunə:

            Xüsusilə diskussiya zamanı da bunu qeyd etmək lazımdır, kod xətlərini şərh edə bilərsiniz. Bu şəkildə kod sənəddə qalır, ancaq şərh verdiyinizdən bu yana işləmir.

            Nümunə:

            Bu vəziyyətdə, “O bir oğlan” olduğu üçün şərh etdiyimiz cəsarətli olaraq ortaya çıxacaq və brauzer tərəfindən rədd ediləcəkdir. Bu ssenaridə, brauzerə gəlincə, bizdə heç nə yoxdur.

            Bu da bu şəkildə istifadə edilə bilər:

            O oğlan göstərir ki Oğlan. Bu “bir” olduğunu şərh etdiyimiz üçün. Sadəcə bir elementin daxilində və ya xaricində hər hansı bir şeyin şərh edilə biləcəyini göstərmək üçün çalışırıq. İstinad üçün şərhinizə bir qeyd əlavə edə bilərsiniz – göstərilənlərin xarakterini dəyişdirmir.

            HTML-də rənglərdən istifadə

            HTML-də rənglərdən istifadə

            Gec-tez HTML sənədinizin müəyyən elementlərini göstərmək üçün rənglərdən istifadə etmək istəyəcəksiniz. Bu üç əsas yolla edilə bilər: HEX dəyəri ilə, RGB dəyəri ilə və ya rəngin adı ilə.

            HTML-də rəng istifadə ümumiyyətlə stil atributu ilə aparılır.

            Nümunə 1:

            Bu mavi rəngdir

            Mavi rəng üçün “# 0000FF” üçün HEX dəyərindən istifadə edərək brauzerə mavi rəngdən istifadə edərək mətninizi göstərməyinizi söyləyirik (bu vəziyyətdə “Bu mavi rəngdir”).

            Misal 2:

            Bu yaşıl rəngdir

            RGB dəyərindən istifadə edərək mətni yaşıl rəngdə vurğulamaq üçün təlimat veririk.

            Misal 3:

            Bu rəng sarıdır

            HSL dəyərindən istifadə edərək mətnin sarı rəngdə vurğulanmasını istədik.

            Misal 4:

            Bu rəng narıncı

            Mətnin narıncı rəngdə vurğulanmasını xahiş etmək üçün HTML rəng adından istifadə edirik (bu vəziyyətdə “narıncı” – kodu işarələyərək qeyd etdik). Aydındır ki, bu yalnız rəng adlarını bildiyiniz mətnlər üçün mümkündür və HEX kodu və ya RGB dəyəri ilə asanlıqla edilə bilən müəyyən rəng çalarları üçün çətin ola bilər. Nə olursa olsun, bir siyahısını tapa bilərsiniz 140 HTML rəng adları HTML Rəng Kodları tərəfindən tərtib edilmişdir.

            Bütün rənglər üçün lazımi məlumatlarınız yoxdur – HEX kodu, RGB dəyəri və s. Panik etməyin – rəng seçicisi tərəfindən W3Məktəblər hər hansı bir rəng seçməyə imkan verən və HEX kodu, RGB dəyəri və HSL dəyəri daxil olmaqla bu rəng haqqında bütün məlumatları göstərən əla bir vasitədir.

            HTML-də iFrames-dən istifadə

            HTML sənədində bir sənədin cari sənədə daxil edilməsi üçün bir iFrame (daxili çərçivə) istifadə edilə bilər. Əslində, başqa bir veb saytı və ya mövcud veb saytdakı məzmunu göstərmək üçün istifadə edə bilərsiniz.

            Nümunə:

            Yuxarıda göstərilən kodla brauzerə https://websitesetup.org məzmununu birbaşa bu səhifənin içərisində göstərməyinizi söyləyirik..

            Iframes veb saytı, video, şəkillər və ya hər hansı digər məzmun şəklini göstərmək üçün istifadə edilə bilər.

            Bunun kodu sadədir:

            (göstərmək üçün istədiyiniz veb sayt / məzmun bağlantısı ilə “URL” əvəz edin.)

            İframın müəyyən dəyərlərini, hündürlüyü və enini təyin etmək üçün daha da fərdiləşdirə bilərsiniz.

            Nümunə:

            Brauzerə 350px və eni 400px eni istifadə edərək iframe göstərməsini söyləyirik.

            HTML şriftləri

            HTML-də şriftlərdən istifadə etməklə

            Şriftlərin necə işlədiyini başa düşmək, effektiv HTML sənədlərini yaratmaq üçün vacibdir. Birinə görə, şriftlər mətninizin ölçüsünü təyin etməyi asanlaşdırır. Həm də rənginizi həm məzmununuzun üzünü (və ya yazı tipini) təyin etməyi asanlaşdırır.

            HTML sənədinizin istifadə edəcəyi şrifti göstərmək üçün istifadə etməlisiniz etiket. “Ölçək”, “rəng” və ya “üz” atributlarından istifadə edərək şrift ölçüsünü, şriftin rəngini və ya yazı tipini təyin edə bilərsiniz..

            Ayarlama ölçüsü – Məsələn:

            Şrift ölçüsü 6 istifadə edərək bu mətni göstərin

            Bu nümunədə, brauzerə mətnimizi 6 şrift ölçüsündən istifadə edərək göstərməyimizi söyləyirik. Qəbul edilmiş şrift ölçülərinin diapazonun 1 ilə 7 olduğunu qeyd etmək vacibdir. şrift ölçüsü 3-dür.

            Şrift rəngi – məsələn:

            Mətnimizi mavi rəngdə göstərin

            Biz istifadə edirik etiket, brauzerdən mətnimizi rəngli mavi rəngdə göstərməsini xahiş et. Bu vəziyyətdə HTML rəng adından (“mavi”) istifadə etdik. İstəsəniz bu HEX kodu və ya RGB dəyəri ilə əvəz edilə bilər.

            Şrift üzü – məsələn:

            Times New Romans əvəzinə Verdana üstünlük verirsinizmi? Bunu necə təyin etdiniz:

            Bu mətni Verdana şriftində göstərin

            Brauzerə mətnimizi Verdana şriftində göstərməsini söyləyirik. Istifadə etmək istədiyiniz hər hansı bir şrifti göstərmək üçün sadəcə font nominalını dəyişdirə bilərsiniz.

            Alternativ şrift üzləri:

            Qeyd etmək vacibdir ki, insanlar mətninizi kompüterinizdə quraşdırılmış bu şrift varsa, göstərdiyiniz şriftdə göstərə biləcəklər. Yoxdursa, standart şrift üzü – ümumiyyətlə Times New Roman – göstərilir. Bu səbəbdən “veb təhlükəsiz” şriftlərdən istifadə etmək tövsiyə olunur.

            Mümkün qədər çox alternativ şriftlərin daxil olmasına kömək edə bilər. Bu yolla, əgər əsas şriftləriniz yoxdursa, əhəmiyyəti üçün digər şriftləri də göstərə bilərsiniz. Bu vergül istifadə edərək edilir.

            Misalımıza qayıdaq:

            Bu mətni əvvəlcə Verdana şriftində göstərin, ya da Helvetica, ya Arial, və ya Comic Sans ... əsas şrift mövcud deyilsə, bu qaydada göstərin.

            Brauzerə mətni Verdanada göstərməsini tapşırdıq. Verdana olmadıqda, əvəzolunmaz Times New Romans-a qayıtmaq əvəzinə Helvetica və ya Arial mövcud deyilsə Helvetica ya Arial ya da Comic Sans göstərə bilər..

            Nəticə

            Nəticə olaraq, HTML bu təlimatda olduğunuzdan daha mürəkkəbdir. Ümiddən vaz keçməyin – bu təlimatda əsas anlayışları dərk edə bilsəniz, yaxşı bir başlanğıcındadır. Bir dilin ABC-ni bilmək kimidir və hər şey daha asan olur.

            Çarpıcı bir veb sayt yaratmaq məqsədi ilə bu dərslikdən keçmisinizsə, məyus olmağınız üçün üzr istəyirik – sadəcə bu şəkildə işləmir. Bu əsas HTML dərsidir. Burada inşa edə biləcəyiniz bir təməl hazırlamağa kömək etmək üçün buradadır. Əmin ola bilərsiniz ki, görkəmli bir veb sayt yaratmaq üçün daha çox səy göstərəcək – və tez-tez dillərin birləşməsindən istifadə etməklə bir çox inkişaf vaxtı.

            Veb sayt yaratmaqla bağlı bələdçiliyimizdə geniş məlumat verdiyimiz WordPress ilə bir neçə dəqiqə ərzində əla veb sayt hazırlaya bilərsiniz..

            HTML Resursları

            • HTML Dövri Cədvəl – Bu, bütün HTML etiketlərini dövri cədvəl şəklində sadalayır, onları öyrənməyi / istifadə etməyi asanlaşdırır.
            • W3Məktəblər / Etiketlər – Əlifba sırası ilə sifariş edilmiş bütün HTML yazılarının siyahısı.
            • Mozilla / HTML Atribut edilmişdir – Əlifba sırası ilə sifariş edilmiş bütün HTML atributlarının siyahısı.
            • HTML fırıldaqçı vərəqi
            • HTML Rəng kodları / Rəng Adları – HEX kodu, RGB dəyəri və HSL dəyəri daxil olmaqla 140 HTML rəng adlarının siyahısı.

            Jeffrey Wilson Administrator
            Sorry! The Author has not filled his profile.
            follow me
              Adblock
              detector