Ha újak vagyunk a webes tervezéshez és a front-end fejlesztéshez (HTML, CSS, Javascript), akkor választhatsz, hogy elkezdheted a WYSIWYG szerkesztővel. Ez a rövidítés azt jelenti, hogy "amit látsz, amit kapsz", és alapvetően olyan szoftverekre utal, amelyek lehetővé teszik, hogy vizuális eszközök segítségével hozzon létre egy weboldalt, miközben a szoftver az Ön által létrehozott alapján a kód mögötti kódot írja le. A legnépszerűbb WYSIWYG eszköz elérhető az Adobe Dreamweaver .
A Dreamweaver egy jó lehetőség azok számára, akik csak az első lépésekben vannak
Miközben sok kifinomult készséggel rendelkező tapasztalt webszakértő lenyűgözi a Dreamweaveret, és hajlamos arra, hogy puffadt HTML jelölést és CSS stílusokat készítsen, az egyszerű igazság az, hogy a platform továbbra is jó lehetőség azok számára, akik csak elkezdték a weboldal tervezését. Amint elkezdi használni a Dreamweaver "tervezési nézetének" lehetőségét egy weboldal felépítéséhez, az egyik kérdés valószínűleg az, hogy hogyan hozhat létre egyetlen sort a tartalomhoz ebben a nézetben.
Amikor HTML szöveget ad hozzá egy weboldalhoz, a webböngésző hosszú sorként jeleníti meg ezt a szöveget, amíg el nem éri a böngészőablak vagy a konténerelem szélét. Ekkor a szöveg a következő sorba kerül. Ez hasonló a szövegszerkesztő szoftverekhez hasonlóan, például a Microsoft Word vagy a Google Dokumentumokhoz. Ha egy szövegsor nem rendelkezik több helyiséggel a vízszintes vonalon, akkor elkezd egy másik vonalat kezdeni. Mi történik akkor, ha meg akarja rendelni, hogy egy sor megszakadjon?
Amikor megnyomja az [ENTER] gombot a Dreamweaver tervezési nézetében, az aktuális bekezdés lezár és új bekezdés kezdődik. Vizuálisan ez azt jelenti, hogy ez a két vonal elválik egy kis függőleges távolsággal. Ennek az az oka, hogy alapértelmezés szerint a HTML bekezdéseknek vannak kitöltése vagy margóik (amely magától függ a böngészőtől), amelyet a bekezdés aljára helyeznek, amely hozzáadja ezt a távolságot.
Ezt a CSS-sel állíthatjuk be, de az igazság az, hogy a bekezdések között meg kell határozni a bekezdések közötti távolságot, hogy lehetővé tegyük a weboldal olvashatóságát . Ha egyetlen vonalat és a sorok között nincs széles függőleges távolság, akkor nem szeretné használni az [ENTER] mert nem szeretné, hogy ezek a sorok legyenek egyedi bekezdések.
Ezekben az időkben, amikor nem akarsz egy új bekezdést elkezdeni, hozzáadnád a HTML címkét a HTML-ben. Ezt néha
is írják. kifejezetten az XHTML verzióihoz, amelyhez minden elemet le kell zárni. A záró / ebben a szintaxis önzárja az elemet, mivel a címke nem rendelkezik saját zárócímkéjével. Ez mind jó és jó, de a Design View programban dolgozik a Dreamweaverben. Lehet, hogy nem akarsz ugrani a kódra és hozzáadni ezeket a szüneteket. Ez rendben van, mert valójában hozzáadhatsz egy sortörést a Dreamweaver programban, anélkül, hogy kódnézetet használnád.
Áttérés hozzáadása a Dreamweaver tervrajzában:
- Helyezze el a kurzort, ahová az új sort el kívánja kezdeni.
- Tartsa lenyomva a shift billentyűt és nyomja meg az [ENTER] gombot.
Ez az! A "shift" gomb egyszerű kiegészítése az [ENTER] gombbal egy új bekezdés helyett egy új bejegyzést ad hozzá. Tehát most, hogy tudod, hogy van ez, meg kell fontolnod, hogy hol használjam, és hol keressem. Ne feledje, a HTML célja egy webhely struktúrájának létrehozása, nem pedig a vizuális megjelenés. Nem szabad többféle címkét használni ahhoz, hogy létrehozzon elemei alatt a függőleges távolságot.
Ez az, amire a CSS tulajdonságai vannak a padding és a margók számára. Ahol egy címkét használsz, amikor csak szüksége van az egységes sortörésre. Például, ha levelezési címet kódol, és eldöntötte, hogy egy bekezdést használ, hozzáadhat ilyen címkéket:
Cég neve
Címsor
Város, állam, ZIP
A cím kódja egyetlen bekezdés, de vizuálisan az egyes vonalak három sorát jeleníti meg, köztük egy kis helyet.