Hər kəsə xeyirli gün, əziz dostlarım və oxucularım. Ümid edirəm ki, siz mənim müsabiqəmdə iştirak etmək qərarına gəldiniz və artıq bloq səyahətiniz haqqında yazırsınız. Yaxşı, mən html dilini öyrənməyimizi davam etdirmək istərdim və bu gün sizə ən vacib komponentlərdən biri, yəni hiperlinklər haqqında danışmaq istərdim.

Bəli, belə hiperlinklər olmadan İnternet o qədər də rahat olmazdı. Xeyr, yalan deyirəm. Naviqasiya etmək heç də asan olmayacaq. İnterneti onlarsız təsəvvür edə bilərsinizmi? Mən şəxsən etmirəm.

Və bu gün biz html-də hiperlink daxil etməyi öyrənəcəyik. Ancaq əvvəlcə sizdən soruşmaq istərdim: Hiperlinkin nə olduğunu və adi keçiddən nə ilə fərqləndiyini bilirsinizmi? Burada hər şey əslində sadədir: keçid sənədə istinad edən sadə məlumat parçasıdır. Eyni zamanda, bu mətnə ​​klikləyə bilməzsiniz (heç nə olmayacaq), ancaq məlumatı harada axtaracağınızı bilirsiniz.

Nümunə: Photoshop-da saçların necə vurğulanacağını //site/adobe-photoshop/kak-vydelit-volosy/ ünvanında tapa bilərsiniz.

Hiperlink eyni mətndir, yalnız onun mahiyyəti ondan ibarətdir ki, siz bu mətnin üzərinə klikləyib istədiyiniz səhifəyə, sayta və ya hər hansı digər obyektə keçə bilərsiniz. Üstəlik, mətnin özü hər hansı bir şey ola bilər, ünvan ayrıca içəridə yazılır və tamamilə fərqli ola bilər. Ancaq nə olursa olsun, danışıq nitqində onlara hələ də sadəcə bağlantılar deyilir. Budur bir hiperlink nümunəsi:

Photoshop-da saçları necə düzgün vurğulamaq barədə dərslərimdən birində oxuya bilərsiniz.

Oh yaxşı. Yaxşı nəzəriyyə. İndi məşqə keçək və görək bütün bu məsələlərdə hansılar məsuldur.

Qoşalaşmış etiket hiperlink üçün cavabdehdir, lakin özü heç nəyi təmsil etmir. Həmişə bir atributla birlikdə gedir. Və bu halda, biz daim eyni href yazmaq lazımdır. Atribut dəyərində biz istədiyiniz resursun özünə keçid qoyuruq. Məzmunun özündə biz mətnin özünü yazırıq ki, bu da tıklanabilir olmalıdır (kliklədikdə işləyir). Nümunəyə baxın və məncə hər şeyi başa düşəcəksiniz.

Yandex axtarış sistemi

Anladığınız kimi, bu misalda mən yazdım ki, “Yandex axtarış sistemi” mətninin üzərinə kliklədiyiniz zaman bir şəxs href atributunun dəyərində yazılmış ünvana yönləndiriləcək.

Düşünürəm ki, bir çoxunuz daxili və xarici bağlantıların olduğunu bilirsiniz. Daxili bağlantılar bir kataloq, yəni sayt daxilində həyata keçirilir və xarici keçidlər bəzi üçüncü tərəf resursuna səbəb olur. İndi mən sizə hər ikisini necə edəcəyinizi göstərəcəyəm.

Daxili keçidlər

Eyni qovluqda fayl

Lakin belə keçid o şərtlə işləyəcək ki, əlaqə qurduğunuz fayl linki yerləşdirdiyiniz faylla eyni qovluqda olsun. Digər variantlar üçün hər şey bir az fərqlidir.

Fayl başqa qovluqda

1. Pushkin.html faylını Notepad++ proqramında açın
2. İndi şəkil sözünü tapın və onu etiketlərə sarın<a href> .
3. İndi diqqət! Atribut dəyərində redaktə olunan fayla, yəni pushkin.html-nin özünə nisbətən yolu müəyyənləşdiririk. Siz belə bir şeylə bitirməlisiniz:

Foto

İndi nə etdik? Və biz bunları etdik: çünki fotoqrafiyaya gedən yol içəridədir ayrı qovluq pushkin.html faylı ilə eyni qovluqda yerləşən img, sonra atribut dəyərində əvvəlcə qovluğun adını, sonra isə slash (/) vasitəsilə sənədin tam adını (içində) yazmalıyıq. işimiz, fotoşəkillər).

İndi brauzerinizdə pushkin.html faylını saxlayıb işə salın. “Foto” sözünün mavi rənglə vurğulandığını və klik edilə bilən hala gəldiyini görəcəksiniz, bu o deməkdir ki, bu linkə klikləməklə biz img qovluğunda yerləşən fofo.jpg faylına keçəcəyik.

Bəs necə? Hər şey aydındır? Bir şey olarsa, soruşmaqdan çəkinməyin.

Xarici keçidlər

Və əlbəttə ki, biz kliklədikdən sonra tamamilə fərqli bir sayta aparılacağımız xarici bağlantıları qeyd etməyə bilmərik. Ancaq burada mürəkkəb bir şey yoxdur. Məsələ ondadır ki, siz saytın və ya veb səhifənin tam ünvanını href dəyərinə daxil edirsiniz. Yuxarıda Yandex ilə bir nümunə göstərdim. Ancaq başqa bir nümunə:

Sosial layihələrin ustası olmaq üçün oxuyacağam.

Burada konkret saytın xüsusi səhifəsinə keçirik.

Yeni pəncərədə açılır

Varsayılan olaraq, bir keçidə tıkladığınız zaman, sənəd səhifənizlə eyni pəncərədə açılır, yəni. Səhifəniz qapanacaq. Və bu yaxşı deyil. Xüsusilə, təbliğ olunan məzmun layihələri və ya bloqlar üçün, linkə kliklədiyiniz zaman sənədin səhifənizi bağlamadan yeni pəncərədə və ya tabda açılması tövsiyə olunur.

Bu işdə bizə “_blank” dəyərli hədəf atribut kömək edəcək. Burada mürəkkəb bir şey yoxdur. Bunu sadəcə açılış etiketinin içərisinə daxil etməlisiniz href atribut dəyərindən sonra. Pushkin.html səhifəsinə keçid etdiyimiz lukomorye.html faylından həmin çıxarışı götürək, yalnız indi məhz bu atributu yazacağıq. Bu belə görünməlidir:

Ruslan və Lyudmila poemasından (Müəllif - A.S. Puşkin)

Yaxşı, burada hər şey aydındır. İndi məzmunun üzərinə kliklədiyiniz zaman yeni pəncərədə istədiyiniz səhifə açılacaq. Bu çox zəruridir, çünki onu qeydiyyatdan keçirməsəniz, istifadəçi sadəcə səhifənizi tərk edəcək. Və beləliklə, hər halda, o, yalnız onu xüsusi olaraq bağlamasa, onun üzərində qalacaq. Hər şeyi özünüz etməyə çalışın, sadəcə hər şeyi öz əllərinizlə gözəlləşdirin. Kopyalayıb yapışdırmağa ehtiyac yoxdur.

Yaxşı, buna bənzər bir şey. Deyəsən, sizə ən vacib şeyləri söylədim, amma bu istiqamətdə hərəkət etmək və peşəkar veb-saytlar, bloglar və hətta onlayn mağazalar yaratmaq üçün HTML və CSS öyrənmək istəyirsinizsə, mütləq yoxlayın. əla video kurs bu mövzuda. Dərslər həqiqətən əladır və həqiqətən də veb saytın qurulması ilə hələ də az tanış olan və ya tanış olmayan insanlar üçün deyilib.

Beləliklə, bugünkü dərsimizi yekunlaşdırır. Ümid edirəm məqaləmi bəyəndiniz və daimi oxucum olsanız şad olarsınız. Maraqlı bir şeyi qaçırmamaq üçün blog yeniləmələrimə abunə olmağı unutmayın. Yaxşı, bütün işlərində uğurlar arzulayıram. Əlvida!

Hörmətlə, Dmitri Kostin.

Bu dərsdə biz danışacağıq HTML-də necə bir keçid etmək olar. Linklər vebsaytlarda çox istifadə olunur, onlar sizə veb-saytın bir səhifəsindən digərinə keçməyə imkan verir; Bağlantıların özəlliyi ondan ibarətdir ki, onlar təkcə veb-səhifəyə deyil, həm də fayllara, şəkillərə və s.

Bağlantılar daxili və xarici ola bilər. Daxili keçidlər bir saytdakı səhifələrə və fayllara aparır. Xarici bağlantılar üçüncü tərəfin saytlarına, sənədlərinə və fayllarına aparır. Eyni zamanda, bu növ bağlantılar demək olar ki, eyni şəkildə qurulur.

HTML-də necə keçid etmək olar, nümunələr

1. HREF— linkin hara aparacağına görə məsuliyyət daşıyır. Standart keçid aşağıdakı kimi qurulur: Link mətni.

2. HƏDƏF— sənədin açılacağı pəncərəyə görə məsuliyyət daşıyır. Varsayılan olaraq, cari brauzer pəncərəsində yeni sənəd açılır. “Hədəf” atributu yeni brauzer pəncərəsində linki açmağa imkan verir. Bu atribut aşağıdakı parametrlərə malikdir:

• _blank - səhifəni yeni pəncərədə yükləyir;
• _self - cari pəncərədə səhifəni yükləyir;
• _parent - səhifəni ana çərçivəyə yükləyir;
• _top - bütün çərçivələri ləğv edir və səhifəni yeni pəncərədə yükləyir.

3. NAME- səhifə daxilində müəyyən sahəyə getmək üçün istifadə olunur. Hash simvolundan sonra açar söz (əlfəcin və ya etiket) dırnaq içərisində göstərilir. Bu etiketə getmək üçün bu etiketin yazıldığı linkdən istifadə edin.

Veb saytına keçin

Veb saytına keçin

Pulsuz wordpress dərsləri

Nümunə 4: Şəkillər keçid kimi.

Mətnə keçin

Səhifə mətni...

IN bu misalda səhifə “ad” atributundan istifadə edərək “siyahı” ilə etiketlənir. Bu etiketə olan keçid sizi bu yerə aparacaq xüsusi sahə səhifələr.

Faylı endirin

Məktub yaz

Parametrlər kimi “bədən” etiketində göstərilən atributlardan istifadə edərək keçidlərin rəngini təyin edə bilərsiniz. Bu atributları nəzərdən keçirin:

• link - ziyarət edilməmiş keçid, standart olaraq mavi rəngdə göstərilir;
• alink - aktiv keçid, standart olaraq qırmızı;
• vlink - ziyarət edilmiş link, standart olaraq bənövşəyi.

...

Beləliklə, biz HTML-də keçidlərin yaradılma prinsipini anladıq. Linklərə xüsusi üslublar verilə bilər. Bu barədə linkə daxil olaraq dərsdə tanış ola bilərsiniz.

Salam, blog saytının əziz oxucuları. Bu bölmənin növbəti məqaləsində etiketlərə baxmağa davam edəcəyik. Əvvəllər öyrəndik ), şərhlərin formatlanması haqqında danışdıq və ) və həmçinin məkan simvolları mövzusuna toxunduq. HTML kodu Və . Bəli, biz də imkanları müzakirə etdik.

Bu gün mən veb layihənizdə işləyərkən tez-tez rastlaşacağınız hipermətn işarələmə dilinin elementləri üzərində daha ətraflı danışmaq istəyirəm. haqqında danışıram şəkillərin və hiperlinklərin daxil edilməsi veb səhifələrin koduna daxil edilir. Bunu bilmədən veb-sayt dizaynı üzərində məhsuldar işləmək çox çətin olacaq. Bu teqlər həm məqalələr yazarkən, həm dizayn edərkən, həm də mühərrik çərçivəsi üzərində uzanan bir şablon tərtib edərkən fəal şəkildə istifadə olunur.

Şəkili necə daxil etmək olar - html Img teqləri

Deyək ki, siz məqalələr yazmaq üçün vizual redaktordan istifadə edirsiniz ki, bu da şəkillər və hiperlinklərin kodda dəqiq necə yazıldığını düşünməməyə imkan verir. Ancaq fakt budur ki, heç bir redaktor ideal deyil və tez-tez məqalənin mətninin dizaynında başqa bir səhvi düzəltmək üçün sadəcə olaraq html redaktor rejiminə keçməli və şəkillərin etiketlərində birbaşa dəyişiklik etməlisiniz. özlərini əlaqələndirir.

Əgər HTML sənədinə şəkillər və keçidlər daxil etməyi bilirsinizsə, bu, həyatınızı xeyli asanlaşdıra və vaxtınıza qənaət edə bilər. Üstəlik, on ən ümumi elementi öyrənmək çətin deyil. Əslində, o qədər də çox etiket qalmayıb və əlbəttə ki, günümüzün qəhrəmanları ən çox yayılmış və tez-tez istifadə olunanlardandır.

Digər tərəfdən, eyni elementlər istifadə etdiyiniz şablonun dizaynında da fəal şəkildə istifadə olunur - keçidlər, şəkillər, konteynerlər, siyahılar (onlardan danışırıq), müxtəlif və s.

Və buna görə də, şablonun strukturunu başa düşmək üçün (burada Joomla şablonları və haqqında WordPress mövzuları) və lazım gələrsə, ona dəyişikliklər edin, yenə də ən azı az sayda kod elementini bilməlisiniz. İnanın, buna sərf olunan vaxt gələcəkdə öz bəhrəsini verəcək. Tutaq ki, mən sizi işarələmə dili ilə tanış olmağın zəruriliyinə inandırdım və birbaşa bugünkü nəşrimizin qəhrəmanlarına keçməyin vaxtı gəldi.

Şəkillər daxil etmək üçün Səhifədə HTML Img teqindən istifadə olunur. Aşağıdakı şəkil ondan istifadə edərək daxil edilmişdir:

Src atributu təsvir faylının adını və saxlanma yerini (başqa sözlə, ona gedən yolu) təyin etməyə imkan verir. Bu halda, o, təsviri olan bir fayla yönəldilə bilər. Yollar şəkil fayllarının saxlandığı alt kataloqların adları arasında ayırıcı rolunu oynayan "/" simvolundan istifadə etməklə müəyyən edilir.

Src-ə mütləq yol http://vash_sait.ru saytından başlayacaq (bloqum üçün -). Bundan sonra, alt qovluqların adlarını ayırmaq üçün "/" istifadə edərək, şəkil faylına tam yol yazılır, sonunda faylın adı və uzantısı ilə bitir. Məsələn,

Src-də nisbi yol HTML sənədinin özünün faylını ehtiva edən və təsviri açmağa çalışdığınız mənbə qovluğundan qrafik fayla nisbi yolu təyin etməklə təyin edilir. Bu fayl serverdə onun daxil olduğu sənədlə eyni qovluqda yerləşirsə, ona gedən yolu göstərməyə ehtiyac yoxdur - yalnız qrafik faylın adını göstərməlisiniz (hərflərin hərflərini qoruyaraq). ).

Bu fayl eyni serverdə yerləşirsə, lakin başqa qovluqdadırsa, onun daxil olduğu sənədin yerləşdiyi qovluqdan ona gedən yolu göstərməlisiniz (yuxarıda göstərilən nümunədə nisbi yol istifadə olunur - image/finik.jpg).

Width və Height atributlarından istifadə edərək şəklin enini və hündürlüyünü təyin edin

Html atributları Width və Height sizə bu şəkil üçün səhifədə ayrılacaq sahənin ölçüsünü (müvafiq olaraq en və hündürlük) təyin etməyə imkan verir. Onlar Img etiketinin içərisinə daxil edilir, məsələn:

Bu sahə uyğun gəlmirsə faktiki ölçü daxil etmək istədiyiniz şəkil, şəkil göstərilən ölçüyə uyğun olaraq uzanacaq və ya daralacaq. Bununla belə, məsələn, sənədə daxil edilmiş şəklin ölçüsünü azaltmaq üçün bu üsuldan istifadə etməməlisiniz. Axı, onun çəkisi hələ də böyük qalacaq və bu, veb səhifənin yüklənməsini ləngidir.

Əvvəlcə şəklin ölçüsünü dəyişmək daha yaxşıdır qrafik redaktoru(hətta bunu edə bilərsiniz ) və yalnız bundan sonra onu sənədə daxil edin. Həmçinin qrafik faylı saxlayarkən onun son çəkisinə diqqət yetirmək lazımdır. Çox böyük olmamalıdır. Bəzən son çəki azaltmaq üçün bir az görüntü keyfiyyətini qurban vermək daha yaxşıdır (xoşbəxtlikdən, kiçik ölçülərdə praktiki olaraq görünməz olacaq).

Çizimləri saxlayarkən kompakt tiplərdən GIF (sxematik şəkillər daxil etmək üçün) və ya JPG (şəkillər daxil etmək üçün) istifadə edin. Genişlik və Hündürlük, Src atributundan fərqli olaraq (Img teqində yeganə məcburidir) isteğe bağlıdır. Çoxları sadəcə onları göstərmir, amma buna baxmayaraq, bir az icazə verirlər sənədlərin yüklənməsini sürətləndirin.

Fakt budur ki, əgər brauzer html Img teqində Genişlik və Hündürlük tapmırsa, o zaman şəklin ölçüsünü tapmaq, yükləmək və yalnız bundan sonra sənədin qalan məzmununu yükləməyə davam etmək üçün vaxt lazımdır. . Hündürlük və Eni göstərdiyiniz halda, brauzer avtomatik olaraq bu atributlarda göstərilən ölçülərin təsviri üçün yer saxlayır və veb səhifəni daha da yükləməyə davam edir.

Qrafik faylları çıxarsa bu səhifəçox ağırdır və onların çoxu var, sonra Hündürlük və Eni daxil etmək istifadəçilərə saytın mətnini oxumağa başlamağa imkan verəcək, qrafiklər hələ də yüklənərkən.

Həmçinin, Şəkil daxilində Genişlik və Hündürlüyü göstərməsəniz, kiçik bir şəkil və çox uzun alternativ mətnlə (aşağıda müzakirə olunan Img teqində Alt atributu ilə təyin olunan) müvəqqəti yerdəyişmə baş verəcək bir vəziyyət yarana bilər. qrafika yüklənmədən əvvəl veb sayt dizaynı, çünki uzun alt mətn lazım olduğu qədər yer tutacaq.

En və Hündürlük istifadə edilərsə, alternativ mətnin göstərilməsi üçün yer onlarda göstərilən ölçülərlə məhdudlaşacaq. Çox vaxt buna görə də bu atributları Img teqində yazmağa çalışıram.

Html Img teqində Alt və Başlıq

Daxili baxımdan çox faydalıdır axtarış motorunun optimallaşdırılması sayt Alt və Başlıq atributlarıdır. Saytı özünüz və ya “” nəşrində oxuyun və təbliğ edin.

Onlardan birincisi şəkil üçün sözdə alternativ mətni təyin edir. Brauzerinizdə qrafikləri söndürsəniz, bu mətni görə bilərsiniz. Alt bunun üçün nəzərdə tutulmuşdur - deyin axtarış motorları nə cür rəsm olmalıdır. Başlıq istifadəçini şəklin məzmunu haqqında məlumatlandırmaq məqsədi daşıyır.

Istifadəçi siçanı şəklin üzərinə apararsa, Img teqindəki Başlıq məzmunu pop-up xəttində göstərilir. Bu atributların hər ikisi (əgər siz onları qeyd etmisinizsə) sizə veb layihənizin şəkillərini . Buna görə də, bu fürsəti laqeyd qoymamalı və ən azı Alt-a qeydiyyatdan keçməyinizə əmin olun. Şəkillərinizin formatı belə olmalıdır:

Əslində, ola biləcək çox sayda atribut var və ən azı təqdim olunan keçiddən istifadə edərək hamısını görə bilərsiniz. Ancaq praktikada, çox güman ki, yalnız bu məqalədə sadalananlardan istifadə edəcəksiniz.

Teqlərin yazılması qaydalarını bir daha xatırlatmaq istəyirəm. Açılan üçbucaqlı mötərizədən sonra həmişə boşluq qoyulmadan onun adı yazılır, sonra boşluqla ayrılaraq ona icazə verilən atributun adı yazılır. Atribut adından sonra boşluq olmadan bərabər işarəsi qoyulur və onun parametri dırnaq içərisində yazılır (məsələn, Genişlik üçün piksellə eni).

Html teqinin içindəki növbəti atribut əvvəlkindən boşluqla ayrılır. Sonda bağlanan üçbucaqlı mötərizə var. Nəzərə alın ki, Img qoşalaşdırılmayıb, yəni. onun bağlama etiketi yoxdur.

İdeal olaraq, veb layihənizdə istifadə olunan bütün şəkillər belə tərtib edilməlidir. Bu görünüş hər bir şəkil üçün HTML kodunu əl ilə redaktə etmədən əldə edilə bilər. Müxtəlif CMS-lərin (Joomla, WordPress və s.) vizual redaktorları bütün bu sərvəti istifadəçi dostu bir şəkildə qurmağa imkan verir. qrafik interfeys, lakin sınaq quraşdırmasından sonra kodu yoxladığınızdan əmin olun (hər hansı bir vizual redaktor məqalənin html kodunu göstərməyə keçə bilərsiniz).

"A" html keçid etiketindən istifadə edərək hiperlinklər yaradın

Link HTML-də sənədlərin təşkilinin əsas elementlərindən biridir. Onlar olmadan bir veb səhifə sadəcə bir səhifə olardı. Onlar "A" etiketindən istifadə etməklə yaradılmışdır. Tək tələb olunan atribut Href-dir. O, bu hiperlinkə klikləməklə istifadəçinin getməli olduğu URL-i (yolu) müəyyən edir.

Bağlantı ya öz resursunuzun daxili səhifəsinə (daxili optimallaşdırmada çox vacib bir məqam xüsusi olaraq bağlıdır) və ya başqa bir layihənin səhifəsinə apara bilər. HTML etiketi A qoşalaşmışdır və müvafiq olaraq bağlanma elementinə malikdir. Hiperlink mətni (lövbər - təbliğat baxımından bu barədə ətraflı yazılmışdır SEO təşviqi) açılış və bağlanma "A" teqləri arasında yerləşdirilir.

Axtarış motorları təkcə lövbərin özünü deyil, həm də onu əhatə edən sözləri təhlil edir. Digər resurslarda saytınıza keçidlər yerləşdirərkən bu nəzərə alınmalıdır. Daha təbii görünməsi üçün mətnin bir hissəsini lövbərdən kənara köçürə bilərsiniz, məsələn:

Yeni pəncərədə açılır və şəkildən keçid (şəkil)

Yaxşı, biz yenidən axtarış motorunun optimallaşdırılması ilə diqqətimizi yayındırdıq. Qayıdaq etiketlərə. "A" html etiketi üçün bu keçidin apardığı səhifəni açmağa imkan verən çox vacib bir atribut var. yeni pəncərədə. Bir səhifədən çoxlu xarici sənədlərə keçid etsəniz, bu lazım ola bilər. Bu halda, ziyarətçi üçün səhifənizi daim açıq saxlamaq daha rahat olardı.

Hədəf bu məqsədlə səhifəni adlı yeni pəncərədə açmağa imkan verən bir seçimə malikdir _BOŞ. Əgər Hədəf A etiketində göstərilməyibsə, o zaman link eyni pəncərədə açılacaq. İstifadə nümunəsi Hədəf atributu:

Çapa (əgər keçid daxili keçid üçün istifadə olunursa, bu mətndə bu hiperlinkin apardığı məqaləni tanıtmaq istədiyiniz açar sözlər olmalıdır)

Nəzərə alın ki, etiketlər daxilində atributların sırası heç bir şəkildə tənzimlənmir. Eyni müvəffəqiyyətlə yaza bilərsiniz:

Belə bir fikir var ki, axtarış sistemləri şəkillərdəki bağlantıları daha yüksək qiymətləndirir, lakin bəzi məlumatlara görə bunun əksi doğrudur. Ancaq bu tip bağlantılardan istifadə edərkən, lazım olanı daxil edə biləcəyiniz lövbər yoxdur açar sözlər. Bu halda siz A teqi üçün Title atributundan istifadə edə bilərsiniz.

Ru/image/finik.jpg" Eni="200" Hündürlük="150">

Başlıq adi mətn ankeri vəziyyətində də istifadə edilə bilər. Bu halda, siçan kursorunu hiperlinkin üzərinə aparsanız, orada yazılmış məlumat görünəcək. Əslində, bu atribut demək olar ki, bütün teqlərdə istifadə edilə bilər HTML dili, lakin çox yaxşı olmayacaq.

Burada bu hiperlinkin apardığı məqaləni tanıtmaq istədiyiniz açar sözləri yazmalısınız

Çapaların və hash bağlantıların yaradılması

Başqa bir maraqlı atribut NAME-dir ki, əvvəllər sözdə link ankerləri yaratmaq üçün kifayət qədər geniş istifadə olunurdu və bunlara hash keçidlərindən istifadə etməklə daxil olmaq olar. Bir az qarışıqdır, amma indi aydınlaşdırmağa çalışacağam. Tutaq ki, ehtiyacınız var sənədin mətnində müəyyən bir yerə istinad edin(əvvəlində deyil), müəyyən bir məsələnin müzakirə olunduğu yerdə.

Bu məqaləyə sadə bir keçid qoysanız, üzərinə kliklədikdən sonra məqalə ən əvvəlində açılacaq və istifadəçi orada diqqəti cəmləmək istədiyiniz yeri tapmalı olacaq. Beləliklə, lövbərlərin və hash bağlantıların köməyi ilə məqalənin tam olaraq nəzərdə tutduğunuz yerdə açılmasına və istifadəçinin lazımsız materialı qazmağa ehtiyac qalmamasına əmin ola bilərsiniz.

Html sənədində hiperlinklərin yaradılmasının təsvir edilmiş üsulunu həyata keçirmək üçün əvvəllər hash keçidinin aparacağı məqaləyə lövbər daxil etmək lazım idi. Lövbər adi halqanı xatırladan struktur idi, lakin eyni zamanda ziyarətçi üçün görünməz olaraq qalırdı. O, belə görünürdü:

Bunlar. belə çıxır ki, lövbər yalnız “A” açılış və bağlanış teqindən ibarət idi, halbuki onun tərkibində lövbər yox idi və tək tələb olunan NAME atributuna malik idi. Bu atributun parametri etiket idi, adını özünüz təyin etməli idiniz. Bu etiket sonradan hash linki yaratmaq üçün istifadə edilmişdir.

İndi lövbərləri daxil etməyin yolu budur köhnəlmiş hesab olunur və Html kodu təsdiqləyicisi kimi qəbul ediləcək kobud səhv. Xahiş edirəm buna diqqət yetirin. Çapalar indi ən yaxın etiketə əlavə edilərək yerləşdirilir.

Deyək ki, məqalənin başlığı üçün bu belə görünə bilər:

Başlıq

Beləliklə, məqalənin mətnində bütün lazımi lövbərləri yerləşdirdikdən sonra məqalənin mətnində yuxarıda göstərilən qaydada əvvəllər qeyd edilmiş yerlərə istinad edəcək hash bağlantıları yaratmağa başlaya bilərik (ID seçicisindən istifadə etməklə) .

Hiperlink standart şəkildə yaradılmışdır, istisna olmaqla, Href-də yazılmış URL-in sonunda hash işarəsi (kəskin işarə və ya hash simvolu) yerləşdirilir və ondan sonra lövbərin etiketinin adı gəlir. ki, məqalənin mətnində tələb olunan yerdədir.

Çapa

Çapa hash linki ilə eyni Html sənədindədirsə, yalnız lövbər müəyyən edilə bilər.

Çapa

Sizə uğurlar! Tezliklə blog saytının səhifələrində görüşənədək

Sizi maraqlandıra bilər

Html kodunda siyahılar - UL, OL, LI və DL teqləri
Html və CSS kodunda rənglərin necə qurulduğu, cədvəllərdə RGB çalarlarının seçimi, Yandex çıxışı və digər proqramlar
HTML formaları sayt üçün - veb forma elementlərini yaratmaq üçün etiketlər Form, Giriş və Seç, Seçim, Mətn sahəsi, Etiket və s.
Img - Şəklin daxil edilməsi (Src), mətnin ətrafına düzülməsi və bükülməsi (hizalanması), həmçinin fonun qurulması (fon) üçün Html etiketi
Hiperlink necə yaradılır (A, Href, Target blank), onu saytda yeni pəncərədə necə açmaq, həmçinin şəkli Html kodunda keçid etmək
Iframe və Frame - bunlar nədir və Html-də çərçivələri necə istifadə etmək daha yaxşıdır
MailTo - bu nədir və E-poçt göndərmək üçün Html-də necə bir keçid yaratmaq olar Açılan siyahılar və mətn sahələri forması üçün seçin, Seçim, Mətn sahəsi, Etiket, Fieldset, Legend - Html teqləri
Yerləşdirmə və obyekt - HTML teqləri veb səhifələrdə media məzmununu (video, flash, audio) göstərmək üçün
Html kodunda şərh direktivləri və Doctype, həmçinin blok və daxili elementlər (teqlər) anlayışı

Hiperlinklər şəbəkədəki sənədləri bir-biri ilə əlaqələndirmək üçün icad edilmişdir və əgər saytınız bir deyil, bir neçə səhifədən ibarətdirsə, onda siz onları yalnız hiperlink yaratmaqla birləşdirə bilərsiniz. Bunun necə göründüyünü bir nümunə ilə birbaşa görək.

Sadə bir hiperlink yaratmaq

Başqa səhifəyə keçin

Burada hər şey sadədir, hiperlink yaratmaq üçün etiketdən istifadə edirik burada href=”” keçidin aparılacağı səhifənin ünvanıdır, bizim halda bu səhifə eyni kataloqda yerləşir. Siz burada həmçinin href=”http://site.ru/page.html“ kimi bir ünvan əlavə edə bilərsiniz və ya bu, saytınızın href=”arj/arhiv.zip” qovluğunda yerləşən arxivə keçid ola bilər. və ya əslində heç bir fərqi olmayan hər hansı digər sənədə. Həmçinin, hər hansı bir hiperlinkin məcburi atributu başlıqdır, bu, keçidin təsviridir, bu, axtarış sisteminin optimallaşdırılmasında çox vacib elementdir və burada keçid etdiyiniz səhifənin və ya sənədin açar sözlərini yazırsınız. Teq arasında yerləşən mətn çapa adlanır və həm də çox vacibdir.

Yeni səhifədə keçidin açılması

Sizin üçün faydalı ola biləcək başqa bir maraqlı atribut var:

Başqa səhifəyə keçin

_blank dəyərli hədəf atributu linki yeni pəncərədə açır; bu, bir insanın səhifənizi itirməsini və eyni zamanda ona lazım olan məlumatı sadəcə yeni tab və ya pəncərədə əldə etməsini istəmirsinizsə, bu, tez-tez istifadə olunur.

Şəkil bağlantıları

Brauzerdə nəticə:

Burada mahiyyət etibarı ilə hər şey sadədir, mən şəkil teqini açılış və bağlanan hiperlink teqləri arasında yerləşdirdim , amma yenə də sadəcə iki şəkil daxil etmədim, img sinifini şəkilin ətrafındakı çərçivəni sıfırladığım birinə təyin etdim, çünki o, hiperlink olduqda görünür, lakin bütün brauzerlərdə deyil, məsələn, siz onu görəcəksiniz. IE-də, lakin Google Chrome-da deyil.

Linklərdə altını çəkmək

Başqa səhifəyə keçin
Başqa səhifəyə keçin

Aydınlıq üçün mən bu problemi həll etmək üçün iki variant verdim, onları sinif seçicisinə tapşırdım və bu sinfi qeydiyyatdan keçirməklə siz konkret yerlərdə lazımsız vurğunu siləcəksiniz. Problemin ikinci həlli, etiketdəki bütün keçidlərdən alt xəttini silməkdir<а>, bu, əlbəttə ki, nadir hallarda ehtiyac yaradır, lakin yenə də bilik artıq deyil.

Sənəd daxilində keçidlər

Sənədin kifayət qədər uzun olması və səhifənin əvvəlində bu səhifənin alt bölmələrinə keçidləri olan kiçik bir menyu olması nadir deyil. Bu keçidlər sənəd daxilində keçidlər adlanır və bütün bunlar olduqca sadə şəkildə həyata keçirilir. Başlamaq üçün, lövbərlər sənədə yerləşdirilir, bunlar etiketlərdir, daxili keçidə kliklədiyiniz zaman onları köçürmək lazım olacaq sənədə yerləşdirilir, bir qayda olaraq bunlar bölmə başlıqlarıdır, etiket belə görünür:

< /a>

Fəsil….< /a>

Hiperlinklər haqqında bilməli olduğumuz son şey elektron poçt qutularına keçidlərdir, o, çox sadə şəkildə həyata keçirilə bilər, sadəcə olaraq mailto: kimi bir giriş və href atributuna poçt qutusu ünvanını əlavə edin:

Mənim poçtum< /a>

Burada mən “HTML-də hiperlinklərin yaradılması” dərsini bitirirəm, yəqin ki, fikir vermisiniz, biz burada CSS olmadan edə bilməzdik, ümumiyyətlə, material kifayət qədər sadədir, məncə hər şey sizin üçün sadə və aydın olacaq sualiniz varsa yazin.

Nəşr tarixi: 2014-04-23

Bu məqaləni paylaşın: