ถ้าคุณยังใหม่กับการออกแบบเว็บและการพัฒนาหน้าเว็บ (HTML, CSS, Javascript) คุณสามารถเลือกเริ่มต้นใช้งานตัวแก้ไข WYSIWYG ได้ คำย่อนี้ย่อมาจาก "สิ่งที่คุณเห็นคือสิ่งที่คุณได้รับ" และโดยทั่วไปหมายถึงซอฟต์แวร์ที่ช่วยให้คุณสร้างเว็บเพจโดยใช้เครื่องมือภาพขณะที่ซอฟต์แวร์เขียนโค้ดไว้เบื้องหลังตามสิ่งที่คุณกำลังสร้างขึ้น เครื่องมือ WYSIWYG ที่เป็นที่นิยมมากที่สุดคือ arguably Adobe's Dreamweaver
Dreamweaver เป็นตัวเลือกที่ดีสำหรับผู้ที่เพิ่งเริ่มต้นใช้งาน
แม้ว่าผู้เชี่ยวชาญด้านเว็บจำนวนมากที่ มีทักษะด้านการกลั่นมากขึ้น มองลงมาใน Dreamweaver และแนวโน้มที่จะสร้างมาร์กอัพ HTML แบบพองและสไตล์ CSS ความจริงง่ายๆก็คือแพลตฟอร์มนี้ยังคงเป็นตัวเลือกที่ดีสำหรับผู้ที่เพิ่งเริ่มต้นออกแบบเว็บไซต์ เมื่อคุณเริ่มใช้ตัวเลือก "มุมมองการออกแบบ" ของ Dreamweaver ในการสร้างเว็บเพจหนึ่งในคำถามที่คุณน่าจะมีคือสร้างเส้นแบ่งบรรทัดเดียวสำหรับเนื้อหาในมุมมองนั้น
เมื่อคุณเพิ่มข้อความ HTML ลงในเว็บเพจเว็บเบราเซอร์จะแสดงข้อความนั้นเป็นเส้นยาวจนกว่าจะถึงขอบของหน้าต่างเบราเซอร์หรือองค์ประกอบคอนเทนเนอร์ ณ จุดนั้นข้อความจะห่อไปที่บรรทัดถัดไป นี่คล้ายกับสิ่งที่เกิดขึ้นในซอฟต์แวร์ประมวลผลคำใด ๆ เช่น Microsoft Word หรือ Google Docs เมื่อบรรทัดข้อความไม่มีที่ว่างมากขึ้นในแนวนอนเส้นจะห่อหุ้มไว้เพื่อเริ่มต้นบรรทัดอื่น แล้วจะเกิดอะไรขึ้นถ้าคุณต้องการกำหนดเส้นแบ่งบรรทัด?
เมื่อคุณกดปุ่ม [ENTER] ในมุมมองการออกแบบของ Dreamweaver ย่อหน้าปัจจุบันจะถูกปิดและจะเริ่มย่อหน้าใหม่ขึ้น สายตาจะหมายความว่าทั้งสองเส้นแยกออกจากกันด้วยระยะห่างแนวตั้งเล็กน้อย ทั้งนี้เนื่องจากตามค่าเริ่มต้น ย่อหน้า HTML มีช่องว่างหรือส่วนขอบ (ขึ้นอยู่กับเบราว์เซอร์เอง) ที่ด้านล่างของย่อหน้าซึ่งจะเพิ่มระยะห่างดังกล่าว
นี้สามารถปรับได้ด้วย CSS แต่ความจริงก็คือคุณต้องการให้มีการเว้นวรรคระหว่างย่อหน้าเพื่อให้ สามารถอ่านเว็บไซต์ได้ หากคุณต้องการบรรทัดเดียวและไม่มีระยะห่างแนวตั้งระหว่างบรรทัดคุณไม่ต้องการใช้ [ENTER] สำคัญเนื่องจากคุณไม่ต้องการให้บรรทัดเหล่านั้นเป็นแต่ละย่อหน้า
สำหรับช่วงเวลาเหล่านี้เมื่อคุณไม่ต้องการให้ย่อหน้าใหม่เริ่มต้นคุณจะต้องเพิ่มแท็ก
ใน HTML บางครั้งก็เขียนเป็น
โดยเฉพาะสำหรับรุ่น XHTML ซึ่งต้องการให้องค์ประกอบทั้งหมดถูกปิด การต่อท้าย / ในไวยากรณ์ที่ self-closing องค์ประกอบเนื่องจากแท็ก
ไม่มีแท็กปิดของตัวเอง นี่เป็นสิ่งที่ดีและดี แต่คุณกำลังทำงานในมุมมองการออกแบบใน Dreamweaver คุณอาจไม่ต้องการข้ามไปที่โค้ดและเพิ่มช่วงพักเหล่านี้ นั่นเป็นสิ่งที่ดีเพราะคุณสามารถเพิ่มเส้นแบ่งใน Dreamweaver ได้โดยไม่ต้องหันไปใช้โค้ด
เพิ่มเส้นแบ่งในมุมมองการออกแบบของ Dreamweaver:
- วางเคอร์เซอร์ไว้ที่ที่คุณต้องการให้บรรทัดใหม่เริ่มทำงาน
- กดปุ่ม shift ค้างไว้และกด [ENTER]
แค่นั้นแหละ! การบวกปุ่ม "Shift" ที่เรียบง่ายพร้อมด้วย [ENTER] จะเป็นการเพิ่มรูปแบบแทนแทนย่อหน้าใหม่ ตอนนี้คุณรู้ว่านี่เป็นอย่างไรคุณควรพิจารณาว่าจะใช้ที่ใดและควรหลีกเลี่ยงที่ไหน โปรดจำไว้ว่า HTML หมายถึงการสร้างโครงสร้างของไซต์ไม่ใช่รูปลักษณ์ คุณไม่ควรใช้แท็กหลายแท็กเพื่อสร้างระยะห่างแนวตั้งภายในองค์ประกอบในการออกแบบของคุณ
นั่นคือสิ่งที่ CSS คุณสมบัติสำหรับ padding และระยะขอบเป็นสำหรับ ตำแหน่งที่คุณจะใช้แท็ก
คือเมื่อคุณเพียงแค่ต้องการแบ่งบรรทัดเดียว ตัวอย่างเช่นหากคุณกำลังเข้ารหัสที่อยู่ทางไปรษณีย์และคุณได้ตัดสินใจใช้วรรคแล้วคุณสามารถเพิ่มแท็ก
เช่น:
ชื่อ บริษัท
ที่อยู่บรรทัด
เมืองรัฐ ZIP
รหัสนี้สำหรับที่อยู่เป็นวรรคเดียว แต่มองเห็นมันจะแสดงสามบรรทัดในแต่ละบรรทัดที่มีช่องว่างขนาดเล็กระหว่างพวกเขา