Skip to main content

Kaip parašyti HTML kodą "Dreamweaver" - be WYSIWYG

Anonim

"Dreamweaver" yra puikus "WYSIWYG" redaktorius, tačiau jei jus domina rašyti tinklalapius "aplinkoje, ką matote yra tai, ką gaunate", vis tiek galite naudoti "Dreamweaver", nes tai taip pat puikus teksto redagavimo priemonė. Tačiau "Dreamweaver" kodo redaktoriuje yra daugybė funkcijų, kurios dažniausiai paslydo, nes pagrindinis dėmesys skiriamas "dizaino rodinyje" arba produkto WYSIWYG redaktoriaus daliai.

Kaip patekti į "Dreamweaver" kodo vaizdą

Jei niekada nenaudojote "Dreamweaver" kaip HTML redaktoriaus, kol niekada net nepastebėjote trijų mygtukų puslapio viršuje: "Kodas", "Skirtas" ir "Dizainas". "Dreamweaver" paleidžiamas pagal numatytuosius nustatymus "Dizaino rodinyje" arba "WYSIWYG" režime. Tačiau lengvai pereiti prie HTML kodo peržiūros ir redagavimo. Tiesiog spustelėkite ant Kodas mygtukas. Arba eikite į Vaizdas meniu ir pasirinkite Kodas.

Jei mokate rašyti HTML ar norite sužinoti, kaip jūsų pakeitimai turės įtakos jūsų dokumentui, galite vienu metu atidaryti kodo peržiūrą ir dizaino vaizdą. Šio metodo grožis yra tas, kad jūs galite redaguoti ir iš vieno lango. Taigi HTML galite įrašyti savo vaizdo žymos kodą, tada naudokite dizaino vaizdą, kad perkeltumėte jį į kitą puslapio vietą su vilkimo ir perkėlimo funkcija.

Jei norite peržiūrėti vienu metu:

  • Spustelėkite ant Splitas mygtukas (tarp Kodas ir Dizainas).
  • Viduje konors Vaizdas meniu pasirinkite Kodas ir dizainas.

Kai jaučiatės patogus "Dreamweaver" redaguoti savo HTML kodą, galite pakeisti nustatymus, kad numatytuoju būdu atidarytumėte Dreamweaver kodo peržiūrą. Lengviausias būdas išsaugoti kodo vaizdą kaip darbo vietą. "Dreamweaver" atidarys paskutinę jūsų naudojamą darbo vietą. Jei taip nėra, tiesiog eikite į "Window" meniu ir pasirinkite norimą darbo vietą.

Kodo peržiūros parinktys

"Dreamweaver" yra toks lankstus, nes turi tiek daug būdų, kaip jį pritaikyti ir pritaikyti tai taip, kaip to nori. Parinkčių lange yra kodo spalvos, kodo formatavimas, kodo užuominos ir kodo perrašymo parinktys, kurias galite koreguoti. Tačiau taip pat galite keisti tam tikras specialias parinktis pačiame kodo rodinyje.

Kai esate kodo rodinyje, yra a Peržiūrėti parinktis mygtukas įrankių juostoje. Taip pat galite peržiūrėti parinktis, eidami į Vaizdas meniu ir pasirinkimas Kodo peržiūros parinktys. Pasirinkimai yra:

  • Word Wrap - apgaubia HTML kodą, kad galėtumėte jį peržiūrėti, nesukeldami horizontaliai. Atkreipkite dėmesį, kad ši parinktis į savo kodą neįtraukia jokio vežimėlio grąžinimo, o tik parodo kodą, kad jį būtų lengviau skaityti.
  • Linijos numeriai - rodo kodo eilutės numerius. Tai rodo eilutės apvyniojimo simbolį linijoms, kurios apvyniojamos ilgiau nei peržiūros langas.
  • Paslėpti simboliai - rodomi specialūs simboliai, o ne tarpai, kurie rodomi tinklalapyje. Pavyzdžiui, taškas pakeičia erdvę, dviguba chevron pakeičia kiekvieną skirtuką, o pilkrokas ar pastraipos žymeklis pakeičia kiekvieną eilutę.
  • Pažymėkite netinkamą kodą - pabrėžia neteisingą geltoną HTML tekstą. Jei pasirinksite geltoną žymą, nuosavybės inspektorius pateiks patarimų, kaip tai išspręsti.
  • Sintaksės dažymas - įjungia arba išjungia kodo spalvinį kodavimą. Jūs keičiate savo spalvų kodavimo spalvas pasirinkčių spalvų kodo skyriuje.
  • Automatinis įtraukimas - automatiškai praleidžia kodo atspaudą po vežimėlio grąžinimo, jei virš jo esantis kodas yra įtraukiamas. Galite pakeisti taško dydį, pakeisdami skirtukų dydį į parinkčių skirsnį kodo formatavimo.

HTML kodo redagavimas "Dreamweaver" kodo rodinyje

"Dreamweaver" kodo rodinyje lengva redaguoti HTML kodą. Tiesiog pradėkite rašyti savo HTML. Tačiau "Dreamweaver" suteikia jums papildomų priedų, kurie išplečia jį per pagrindinį HTML redaktorių. Kai pradedate rašyti HTML žymą, įvedate <. Jei pristabdysite iškart po šio simbolio, "Dreamweaver" parodys jums HTML žymų sąrašą. Tai vadinami kodo užuominomis. Norėdami susiaurinti pasirinkimą, pradėkite rašyti raides - "Dreamweaver" susiaurins išskleidžiamąjį sąrašą prie žymos, atitinkančios tai, ką rašote.

Jei esate naujas HTML vartotojas, galite peržiūrėti HTML žymų sąrašą ir pasirinkti įvairius, kad pamatytumėte, ką jie daro. Dreamweaver ir toliau jus paragins, kai įvesite žymą. Pavyzdžiui, jei įvedate <>"Dreamweaver" nukris iki HTML žyma su kitomis ženklais, prasidedančiomis po to. Jei tęsite rašydami laišką m"Dreamweaver" susiaurins jį iki žyma

Tačiau kodo užuominos neužbaigiamos žymėse. Galite naudoti kodo patarimus, norėdami įterpti:

  • HTML atributai
  • Klasės ir ID vardai
  • CSS savybės

Jei kodo patarimai nerodomi, galite paspausti Ctrl tarpo klavišas ("Windows") arba Cmd-tarpo klavišas ("Macintosh"), kad jie būtų rodomi. Dažniausia priežastis, kodėl kodo užuominą gali nepasirodyti, yra tai, jei prieš baigdami žymą pereidavote prie kito lango. Kadangi "Dreamweaver" įjungia rašytojo rašymą <, jei paliksite langą ir grąžinsite, turėsite iš naujo paleisti kodo užuominas.

Galite išjungti kodo patarimų meniu, pataikydami į pabėgimo klavišą.

Įvesdami savo HTML HTML žymą, turėsite ją uždaryti. "Dreamweaver" tai daro natūraliu būdu. Jei įvesite Uždaryti žymes kuri geriausiai tinka jūsų poreikiams.

Jei nesate pasiruošę pereiti prie HTML puslapių redagavimo, bet norėtumėte žiūrėti kodą, kaip parašyta, turėtumėte pabandyti kodo inspektorių. Tai atidaro HTML kodą atskirame lange. Tai veikia taip pat, kaip kodo vaizdas, ir tai iš esmės yra nuimamas kodo peržiūros langas dabartiniam dokumentui.Norėdami atidaryti kodo inspektorių, eikite į Langas meniu ir pasirinkite Kodo inspektorius arba paspauskite F10 raktas ant klaviatūros.

Dreamweaver formatuos HTML kodą, tačiau norėtumėte, kad jis būtų rodomas. Pvz., Jei naudojate 3 tarpus, kad įtrauktumėte, bet niekada nenukryptų IMG žymes, galite nurodyti kodavimo perrašymo parinkčių formatavimo informaciją. Tada eisi į Komandos meniu ir pasirinkite Taikyti šaltinio formatavimą. Tai puikus būdas gauti kito asmens parašytą kodą į jums žinomą formą.

Funkcija, kurią daugelis HTML koduotojų nežino ar nenaudoja, yra galimybė sutraukti HTML kodą. Tai nepašalina žymes iš dokumento, bet tiesiog pašalina juos iš žvilgsnio, kad nebūtų blaškomi tai, su kuo dirbate. Sutraukti savo kodą:

  1. Pasirinkite kodo dalį, kurią norite paslėpti.
  2. Viduje konors Redaguoti meniu pasirinkite Sutraukti pasirinkimą nuo Kodo sutraukimas submeniu

Paprastesnis būdas yra pasirinkti kodą ir tada spragtelėti ant kodo sutraukti piktogramose esančias piktogramas. Taip pat galite dešiniuoju pelės klavišu spustelėti pasirinktą kodą ir pasirinkti Sutraukti pasirinkimą.

Jei norite paslėpti viską išskyrus kas paryškinta, pasirinkite Sutraukti išorinę parinktį bet kuriuo iš aukščiau aprašytų metodų.

Norėdami išplėsti sugadintą kodą, tiesiog dukart spustelėkite jį. Tai atveria kodą ir pasirenka jį. Tada galite perkelti šį pasirinkimą arba jį ištrinti arba pridėti papildomų žymių.

Visą laiką galite naudoti žlugimo ir išplėtimo funkciją tose svetainėse, kuriose nenorite redaguoti išorinio šablono. Jūs tiesiog pasirinkite turinio sritį, kurią norite redaguoti ir žlugti išorėje. Tada parašyk savo HTML. Vis tiek galite peržiūrėti puslapį Dizainas peržiūrėkite arba peržiūrėkite jį naršyklėje. Sugadintas kodas nepašalinamas iš dokumento, tiesiog paslėptas nuo peržiūros. Taip pat galite jį naudoti, kai dirbate su keletu elementų. Kai baigsite vieną, sutraukite jį. Jūs žinote, kad baigėte, kai nerodomas kodas.