Dreamweaver-da HTML kodunu yazmaq

Yalnız WYSIWYG istifadə etməyə ehtiyac yoxdur

Dreamweaver böyük bir WYSIWYG redaktoru , ancaq "nə gördüyünüz nədir" mühitində veb səhifələr yazmağı maraqlandırmıyorsanız, Dreamweaver'dan da istifadə edə bilərsiniz, çünki bu da böyük bir mətn redaktoru. Lakin Dreamweaver kod redaktoru daxilində yol kənarında sürüşən bir çox xüsusiyyət var, çünki əsas diqqət məhsulun "dizayn görünüşü" və ya WYSIWYG redaktor hissəsidir.

Dreamweaver Kod Görünüşünə Nasıl Getirsiniz?

Əgər Dreamweaver-ı heç bir zaman HTML redaktoru kimi istifadə etməmisinizsə, bu səhifənin üst hissəsindəki üç düyməni heç görməmisiniz: "Kod", "Split" və "Dizayn". Dreamweaver default olaraq "Design view" ya da WYSIWYG rejimində başlayır. Ancaq HTML kodunu görüntüləmək və redaktə etmək asandır. Yalnız "Kod" düyməsini basın. Və ya View menyusuna daxil olun və "Kod" seçin.

Yalnız HTML yazmağı öyrənirsinizsə və ya dəyişikliklərinizin sənədinizə necə təsir edəcəyi barədə bir fikir əldə etmək istəyirsinizsə, eyni zamanda kod görünüşü və dizayn görünüşünü aça bilərsiniz. Bu metodun gözəlliyi, hər iki pəncərədə də düzəldə bilərsiniz. Beləliklə HTML-də şəkil etiketinizin kodunu HTML-də yaza bilərsiniz və sonra sürüşmə və buraxma ilə səhifədə başqa bir yerə daşımaq üçün dizayn görünüşünü istifadə edə bilərsiniz.

Həm dərhal, həm də:

HTML kodunuzu düzəltmək üçün Dreamweaver istifadə edərək rahat olandan sonra Dreamweaver'ı kod görünüşündə default olaraq açmaq üçün seçimlərinizi dəyişə bilərsiniz. Kodun görünüşünü bir iş sahəsi olaraq saxlamaq ən asan yoludur. Dreamweaver istifadə etdiyiniz son iş yerində açılacaqdır. Əgər deyilsə, sadəcə Window menyusuna gedin və istədiyiniz iş yerini seçin.

Kod Görünüş Seçimləri

Dreamweaver çox çevikdir, çünki onu özelleştirmek üçün çox yollar var və onu istədiyiniz şəkildə işlədir. Seçenekler penceresinde kod renklendirme, kodu biçimlendirme, kod ipuçları ve ayarlayabileceğiniz kod yazma variantları var. Ancaq kodu görünüşü içərisində bəzi xüsusi variantları da dəyişə bilərsiniz.

Kod görünüşündə olduğunuzda, Toolbar-də "Görünüş Seçimləri" düyməsinə var. Görünüş menyusuna daxil olmaq və "Kod Görünüşü Seçimləri" ni seçərək variantları da görə bilərsiniz. Seçimlər:

Dreamweaver Kod Görünüşündə HTML Kodunu Düzenleme

HTML kodu Dreamweaver kod görünüşündə redaktə etmək asandır. Sadəcə HTML yazmağa başlayın. Amma Dreamweaver sizə əsas HTML redaktorundan kənara çıxartan əlavə əlavələrlə təmin edir. Bir HTML etiket yazmağa başladığınızda <. Bu simvoldan dərhal sonra durdurursanız, Dreamweaver sizə HTML tags siyahısını təqdim edəcəkdir. Bunlara kod göstərişləri deyilir. Seçimi daraltmak üçün məktub yazmağa başlayın - Dreamweaver açılan siyahıdan yazdığınıza uyğun olan etiketə daraldıracaq.

HTML-yə yeni baxırsınızsa, HTML teqləri siyahısına keçin və nə etdiklərini görmək üçün müxtəlif variantları seçə bilərsiniz. Dreamweaver, bir etiketi yazdıqdan sonra özniteliklerinizi size vermeye davam edəcək. Məsələn, " HTML etiketinə, aşağıda göstərilən digər etiketləri ilə birlikdə açılır. Əgər "m" hərfini yazaraq davam etsəniz, Dreamweaver bunu etikasına endirəcəkdir.

Ancaq kod ipuçları etiketlərdə bitmir. Daxil etmək üçün kodu göstərişlərdən istifadə edə bilərsiniz:

Kodun göstərişləri görünməzsə, onları göstərmək üçün Ctrl-boşluq çubuğuna (Windows) və ya Cmd-boşluq çubuğuna (Macintosh) vurun. Bir kod işarəsinin görünməyəcəyi ən ümumi səbəb etiketi tamamlamadan əvvəl fərqli bir pəncərə açdığınız təqdirdədir. Dreamweaver, xarakterin yazılmasını dayandırdığından <, pəncərədən ayrılaraq geri dönsəniz, kodu göstərişlərini yenidən başlatmalısınız.

Escape düyməsini basaraq kod göstərişləri menyusunu söndürə bilərsiniz.

Açılış HTML etiketinizi yazdıqdan sonra onu bağlamanız lazımdır. Dreamweaver bunu təbii bir şəkildə edir. "Yaxınlarınıza ən uyğun olanları bağla" seçimini yazarsanız.

HTML-də səhifələrinizi redaktə etmək üçün keçid etməyə hazır deyilik, lakin kodu yazdığınız kimi izləmək istəsəniz, kod müfəttişini sınamalısınız. Bu, HTML kodunu ayrı bir pəncərədə açır. Kod görünüşü kimi işləyir və əslində, əsasən, mövcud sənəd üçün ayrılan kod görünüşü pəncərəsidir. Kod müfəttişini açmaq üçün Pəncərə menyusuna gedin və "Kod müfəttişi" ni seçin və ya klavyənizdə F10 düyməsini basın.

Dreamweaver HTML kodunu formatlaşdırır, ancaq onu göstərmək istəyirəm. Məsələn, 3 boşluğu indent üçün istifadə etsəniz, ancaq IMG etiketlərindən heç vaxt istifadə etməsəniz, kodu yenidən yazma seçimində bu formatlama məlumatını təyin edə bilərsiniz. Sonra Komutlar menyusuna gedin və "Mənbə Biçimini Uygula" seçin. Bu sizin üçün tanış olan formata başqası tərəfindən yazılmış kod əldə etmək üçün yaxşı bir yoldur.

Çox HTML kodlaşdırıcısı haqqında bilmədikləri və ya istifadə etmədikləri bir xüsusiyyət HTML kodu yıxmaq qabiliyyətidir. Bu, yazıları sənəddən çıxarmaz, ancaq görünüşündən çıxarın ki, onlar işlədiyinizə diqqət yetirmirlər. Kodunuzu daraltmak üçün:

  1. Gizlətmək istədiyiniz kod bölməsini seçin
  2. Düzen menüsünden "Kod Çöküşü" alt menüsünden "Seçimi daralt" ı seçin

Daha asan bir şəkildə kodu seçmək və sonra nizamda görünən kod çökmə simgelerini basın. Həmçinin seçilmiş kodu üstündən sağa vuraraq "Seçimi daralt" seçin.

Vurgulandığınız şeylərdən başqa hər şeyi gizlətmək istəyirsinizsə, yuxarıda göstərilən üsullardan hər hansı birində "Xarici Seçimləri Çökdürün" seçin.

Çökmüş kodu genişləndirmək üçün sadəcə cüt basın. Bu kodu açır və seçir. Sonra seçimi hərəkətə keçirə və ya silin və ətrafında əlavə etiket əlavə edə bilərsiniz.

Xarici şablonları düzəltmək istəmədiyiniz yerlərdə çökməni istifadə edərək hər zaman xüsusiyyətləri genişləndirə bilərsiniz. Yalnız xaricində düzəliş etmək və daraltmaq istədiyiniz məzmun sahəsini seçəcəksiniz. Sonra HTML yaz. Hal-hazırda səhifəni Tasarım görünümündə görə bilərsiniz və ya brauzerdə önizleyebilirsiniz. Çökmüş kod, görünüşdən gizlədilən sənəddən silinmir. Bir sıra maddələr üzərində işləyərkən də istifadə edə bilərsiniz. Biri bitirdikdən sonra onu yıxın. Göstərdiyiniz kod olmadığında işin bitdiyini bilirsiniz.