Firefoxdakı Elementi İnkişaf etdirmə vasitəsi, veb səhifənizdə gördüyünüz hər şey üçün HTML kodunu təyin etməyə imkan verir. Bu alətlər açıldıqdan sonra HTML və onunla birlikdə gələn CSS üslub cədvəli tam redaktə edilə bilər. İstədiyiniz dəyişiklikləri sınayın, sonra veb səhifənin nəzərdə tutulan görünüşünə qayıtmaq üçün səhifəni yeniləyin.
Addımlar
2 -dən 1 -ci hissə: Elementlərin yoxlanılması
Addım 1. Hər hansı bir veb səhifəsi elementini sağ basın
Şəkilləri, mətni, arxa planları və ya hər hansı digər elementi sağ vura bilərsiniz. İki düyməli siçanınız yoxdursa, Control düyməsini basıb saxlayın.
Addım 2. Açılan menyudan Elementi Təftiş et düyməsini basın
Pəncərənizin altında bir alət çubuğu görünməlidir. Alətlər çubuğunun altında səhifənin HTML kodunu göstərən bir bölmə də görünəcək.
Addım 3. Alət çubuqlarını və panelləri müəyyənləşdirin
Elementi Yoxla düyməsini tıkladığınızda, pəncərənizin altında bir neçə bölmə açılacaq. İşdə onların istifadə və adlarının bölüşdürülməsi:
- Üst sıra Toolbox Toolbar -dır. Bunun bir neçə geliştirici vasitəsi var, ancaq soldakı Müfəttişlə maraqlanırıq. Bütün bələdçi üçün bu seçilmişi (mavi rənglə vurğulanmış) saxlayın.
- Alətlər çubuğunun altında, seçilmiş elementlə əlaqəli tam yolu göstərən HTML elementlərinin tək bir Breadcrumbs satırı var.
- Bu sətrin altındakı bölmə səhifənin HTML ağacını və ya "İşarələmə Görünüşünü" göstərir. Seçdiyiniz element üçün HTML bu bölmədə vurgulanır və mərkəzləşdirilir.
- Sağdakı bölmə bu səhifə üçün CSS üslub cədvəlini göstərir.
Addım 4. Başqa bir element seçin
Alətlər paneli açıldıqdan sonra başqa bir element seçmək asandır. Bunu etmək üçün üç yol var:
- Müvafiq elementi vurğulamaq üçün HTML xəttinin üzərinə gedin (Firefox 34+ tələb olunur). Bu elementi seçmək üçün HTML düyməsini vurun.
- Alətlər çubuğunun ən solundakı Element Seçmə alətini vurun: simge bir kvadrat üzərində bir imlecdir. Elementləri vurğulamaq üçün imlecinizi səhifənin üzərinə aparın, sonra element seçmək üçün vurun.
Addım 5. Kodu keçin
HTML bölməsində hər hansı bir yerə vurun. Kodu keçmək üçün klaviaturanızdakı sol və sağ oxlardan istifadə edin (Firefox 39+ tələb olunur). Əl ilə seçilməsi çox kiçik olan elementlər üçün faydalıdır.
- Boz HTML səhifədə göstərilməyən elementlərə aiddir. Bura şərhlər, bəzi qovşaqlar və CSS görüntü xüsusiyyəti ilə gizlədilmiş elementlər daxildir.
- Məzmununu genişləndirmək və ya gizlətmək üçün konteynerlərin solundakı oxu vurun. Bütün məzmunu genişləndirmək üçün tıklayarkən alt="Image" və ya seçimini basıb saxlayın.
Addım 6. Bir element axtarın
Çörək qırıntıları satırının ən sağındakı axtarış çubuğunu (böyüdücü şüşə işarəsi) axtarın. Genişləndirmək üçün bu düyməni basın, sonra axtardığınız HTML kodunu yazın. Siz yazarkən, uyğun elementlərin siyahısını göstərən bir popup görünəcək. Bu elementi seçmək və HTML bölməsini koduna keçmək üçün birini vurun.
2 -dən 2 -ci hissə: HTML -ni redaktə etmək
Addım 1. İstənilən vaxt yenidən başlamaq üçün səhifəni yeniləyin
Veb tərtibat alətlərində yenisinizsə, heç bir qalıcı dəyişiklik etmədiklərini anlayın. Düzəlişləriniz yalnız ekranda görünəcək və yalnız səhifəni bağlayana və ya yeniləyənə qədər. Nə olacağından əmin deyilsinizsə də sınaqdan çəkinməyin.
Addım 2. Mətni redaktə etmək üçün HTML -ni iki dəfə vurun
Bir HTML xəttini iki dəfə vurun. Yeni mətni daxil edin və dəyişiklikləri saxlamaq üçün enter düyməsini basın.
Addım 3. Daha çox seçim üçün çörək qırıntılarını basıb saxlayın
Unutmayın ki, Breadcrumb alət çubuğu tam HTML ağacı ilə yuxarı alət çubuğu arasında sıxışdırılır. Geniş bir menyu açmaq üçün bu sıradakı elementlərdən birini basıb saxlayın. Bu variantlara dair natamam bir bələdçi:
- "HTML olaraq redaktə et", hər sətri ayrı -ayrılıqda redaktə etmək əvəzinə, düyünü və bütün məzmununu HTML ağacında düzəliş edir.
- "Daxili HTML Kopyala" düyünün bütün məzmununu kopyalayır, "Xarici HTML Kopyala" düyünü də kopyalayır (və ya
- "Yapıştır →" harada yapışdırılacağına dair bir neçə varianta gətirib çıxarır, məsələn, bu qovşaqdan əvvəl və ya düyünün ilk uşağından sonra.
- : hover,: active və: focus istifadəçi onunla ünsiyyət quranda elementin görünüşünü dəyişir. Dəqiq təsir CSS üslub cədvəli ilə müəyyən edilir (sağ bölmədən düzəliş edilə bilər).
Addım 4. Çək və burax
Koddakı elementləri yenidən düzəltmək üçün HTML -ni vurun və kəsikli bir xətt görünənə qədər saxlayın. Ağacı yuxarı və ya aşağı hərəkət etdirin və kəsilmiş xətt istədiyiniz yerdə olduqda buraxın.
Bunun üçün Firefox 39 və ya daha yeni bir versiyası lazımdır
Addım 5. Geliştirici alət çubuğunu bağlayın
Bütün bu xülya pəncərələri bağlamaq üçün CSS panelinin üstündəki alətlər çubuğunun ən sağ küncündəki X düyməsini basmaq kifayətdir.
İpuçları
- Alətlər çubuğunu bu üst menyu seçimləri ilə də aça bilərsiniz:
- Windows: Firefox → Web Developer → Alətləri dəyişdirin
- Mac və ya Linux: Alətlər → Veb Geliştirici → Alətləri dəyişdirin
- Firefox 40, HTML redaktə edərkən sizə daha çox yer vermək üçün CSS bölməsini gizlətmə seçimini təqdim etdi. Axtarış çubuğunun sağındakı Breadcrumbs satırının ən sağındakı ox işarəsini axtarın. CSS bölməsini gizlətmək üçün bu nişanı vurun və yenidən genişləndirmək üçün yenidən vurun.
- CSS bölməsi də redaktə edilə bilər, lakin bu təlimatın əhatə dairəsindən kənardır. Bu məqalə CSS əsaslarını öyrədir.
