เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ · HTML บรรณาธิการ WYSIWYG
จาก <font> แท็กเป็น CSS: การจัดรูปแบบเว็บย้ายออกจากมาร์กอัปอย่างไร
· พื้นหลัง
html ซีเอสเอส การล้างข้อความ
เล่าว่าการนำเสนอ HTML เช่น แบบอักษร การจัดกึ่งกลาง และคุณลักษณะการจัดแนวทำให้เกิด CSS ได้อย่างไร และเหตุใดประวัติศาสตร์ดังกล่าวจึงอธิบายการอภิปรายในรูปแบบอินไลน์ของบรรณาธิการในปัจจุบัน
การนำเสนอ HTML ในหน้าเก่า — ไม่มีการอ้างสิทธิ์วันที่ที่นี่
ส่วนของหน้าเก่ามักจะแสดงลักษณะที่ปรากฏโดยตรงผ่านองค์ประกอบ เช่น แบบอักษรและกึ่งกลาง หรือคุณลักษณะ เช่น bgcolor และ align สมุดงานแนบลำดับเหตุการณ์ในช่วงกลางทศวรรษ 1990 แต่ไม่มีแหล่งเก็บข้อมูลที่ยืนยันวันที่เหล่านั้น การใช้งานสามารถแสดงให้เห็นเฉพาะวิธีที่ตัวแก้ไขนี้ปฏิบัติต่อมาร์กอัปดังกล่าวในปัจจุบัน
ToolAcre ไม่อนุญาตให้ใช้แบบอักษรหรือกึ่งกลาง และไม่คงคุณสมบัติการนำเสนอไว้ Wrapper แบบธรรมดาที่ไม่รองรับจะถูกแกะออก ดังนั้นคำที่มองเห็นได้อาจยังคงอยู่ได้ในขณะที่คำสั่งการจัดรูปแบบหายไป ผลลัพธ์นั้นเป็นฉบับร่างที่สะอาดแล้ว ไม่ใช่การคืนค่าหน้าเดิมอย่างซื่อสัตย์
แบบอักษร ตรงกลาง และ bgcolor: การนำเสนอในแท็ก — อธิบายองค์ประกอบและคุณลักษณะที่เบราว์เซอร์เพิ่มเพื่อให้ปรากฏ
เมื่อการนำเสนออยู่ในแท็กและคุณลักษณะ เนื้อหาและการออกแบบจะเปลี่ยนแปลงได้ยาก การเลือกสีที่ทำซ้ำในบทความจะต้องได้รับการแก้ไขในทุกส่วน และส่วนหัวที่อยู่ตรงกลางจะไม่มีความหมายทางโครงสร้างโดยธรรมชาติ การคัดลอกโครงสร้างเหล่านั้นยังนำเข้าสมมติฐานจากเค้าโครงที่ล้าสมัยด้วย
บทบาทของชื่อมาร์กอัปความหมาย เช่น หัวเรื่อง ย่อหน้า รายการ และเครื่องหมายคำพูด สไตล์ชีตปลายทางสามารถนำเสนอเหตุการณ์ทั้งหมดอย่างสม่ำเสมอ ToolAcre รองรับคำศัพท์ที่มีขนาดเล็กลงและลบคลาสและสไตล์ออกไปด้วย ทำให้ระบบการรับมีหน้าที่รับผิดชอบเลเยอร์การนำเสนอของตัวเอง
CSS แยกโครงสร้างออกจากการนำเสนอ วันที่มาตรฐานเป็นหลักฐานที่เก็บข้อมูลภายนอก
CSS จัดเตรียมตัวเลือกและการประกาศแยกจากแผนผังเนื้อหา แผนกสถาปัตยกรรมดังกล่าวอนุญาตให้การเปลี่ยนแปลงการออกแบบเพียงครั้งเดียวส่งผลต่อเอกสารจำนวนมากโดยไม่ต้องเขียนใหม่ในแต่ละเนื้อหา บทความนี้ไม่ได้สร้างวันที่แนะนำครั้งแรกหรือลำดับมาตรฐานเนื่องจากการกล่าวอ้างในอดีตดังกล่าวจำเป็นต้องมีข้อกำหนดเฉพาะจากภายนอก
กฎการปฏิบัติยังคงทดสอบได้: ส่วนที่คัดลอกมาจาก ToolAcre ไม่มีแอตทริบิวต์สไตล์หรือชื่อคลาส เอกสารฉบับสมบูรณ์ที่ดาวน์โหลดมีสไตล์ชีตแบบ wrapper ของ ToolAcre ของตัวเอง แต่ CSS ไม่ได้แทรกเข้าไปในส่วนที่ผ่านการฆ่าเชื้อแล้วซึ่งส่งกลับโดยสำเนา HTML
องค์ประกอบการนำเสนออยู่นอกรายการที่อนุญาตนี้ โดยไม่มีการอ้างลำดับเหตุการณ์ตามมาตรฐานชีวิต
สมุดงานจะอธิบายการเสื่อมค่าและการถอดออกจากมาตรฐานการครองชีพ โมดูลนี้ไม่มีการเก็บถาวรมาตรฐาน ดังนั้นบทความจึงหยุดที่นโยบายปัจจุบัน: ไม่รองรับองค์ประกอบการนำเสนอ และแกะหรือลบออกตามหมวดหมู่ความเสี่ยง มันไม่ได้ทำการอ้างลำดับเหตุการณ์เชิงบรรทัดฐาน
รายงานการนำออกถือเป็นหลักฐานที่เป็นประโยชน์ วางแท็กแบบอักษรรอบๆ ข้อความและสังเกตว่า wrapper ถูกปฏิเสธในขณะที่คำยังคงอยู่ วางคอนเทนเนอร์สไตล์ที่เป็นอันตรายและเนื้อหาจะถูกลบออกทั้งหมด เนื่องจากเนื้อหาสไตล์ดิบสามารถสร้างคำขอและแยกวิเคราะห์พื้นผิวที่อยู่นอกเหนือขอบเขตของตัวแก้ไขนี้
สไตล์อินไลน์มีอยู่ที่อื่น แต่ตัวแก้ไขนี้จะลบออก
รูปแบบอินไลน์เป็นกลไกทางไวยากรณ์สมัยใหม่ แต่ ToolAcre ปฏิเสธไปโดยสิ้นเชิง ดังนั้นตัวแก้ไขนี้จึงไม่สามารถแสดงให้เห็นถึงคุณลักษณะสไตล์ "ประนีประนอม" ที่ยังหลงเหลืออยู่ หรือแนะนำโหมดเอาต์พุตโหมดใดโหมดหนึ่งของตัวเองได้ สไตล์ที่มีในตัวเองเพียงอย่างเดียวเท่านั้นที่ปรากฏในเอกสารแสดงตัวอย่างที่สร้างขึ้นรอบเนื้อหาที่กรอง HTML
บริบทอื่นๆ โดยเฉพาะการผลิตอีเมล อาจต้องมีการประกาศแบบอินไลน์ ข้อกำหนดนั้นเรียกร้องให้มีไปป์ไลน์แยกต่างหากพร้อมการทดสอบไคลเอนต์และนโยบาย CSS การเพิ่มรูปแบบตามใจชอบที่นี่จะขัดแย้งกับรายการที่อนุญาตในปัจจุบัน และขยายขอบเขตความรับผิดชอบของน้ำยาฆ่าเชื้อโดยไม่มีหลักฐานหรือการทดสอบ
ตัวอย่างการทำงาน: การปรับปรุงตัวอย่างข้อมูลของปี 1990 ให้ทันสมัย - เขียนมาร์กอัปแท็กแบบอักษรใหม่เป็น semantic HTML บวกคลาสและเปรียบเทียบทั้งสอง
ปรับปรุง `<center><font color="red"><b>Maintenance</b></font></center><p align="left">Tonight</p>` ให้ทันสมัยโดยเลือกส่วนหัวและย่อหน้าจริง ToolAcre คลายการนำเสนอที่ไม่รองรับ แมป b ให้ชัดเจน ลบการจัดตำแหน่งและคง p ไว้ แต่ไม่สามารถอนุมานได้ว่าการบำรุงรักษาควรเป็น h2
เขียนความหมายใหม่อย่างชัดเจนเป็น `<h2>Maintenance</h2><p>Tonight</p>` จากนั้นเพิ่มคลาสปลายทางหรือกฎสไตล์ชีตที่ได้รับอนุมัติไว้ภายนอกตัวแก้ไข หากเน้นความสำคัญในประโยค เน้นความเข้มแข็งอาจเหมาะสม หากตัวหนาเป็นเพียงน้ำหนักตัวอักษร อย่าเก็บความหมายที่ทำให้เข้าใจผิด
สิ่งนี้ไม่ครอบคลุม — CSS การอภิปรายเกี่ยวกับระเบียบวิธีหรือการกำหนดรูปแบบเฉพาะกรอบงาน
บทความนี้ไม่ได้เปรียบเทียบวิธีการ เฟรมเวิร์ก คลาสยูทิลิตี้ หรือโทเค็นการออกแบบของ CSS ไม่อ้างสิทธิ์วันที่ในอดีตสำหรับแบบอักษร CSS หรือการเปลี่ยนมาตรฐาน นอกจากนี้ยังไม่มีตัวแปลงอัตโนมัติที่สามารถอนุมานบทบาทเชิงความหมายจากมาร์กอัปแบบเห็นภาพได้
การกรองไม่ใช่การป้องกัน XSS แบบสากล โทเค็นไนเซอร์ที่เขียนด้วยลายมือของ ToolAcre ถูกจำกัด และการดูตัวอย่างจะถูกแซนด์บ็อกซ์แยกกัน เซิร์ฟเวอร์ที่ยอมรับ HTML แบบเดิมหรือที่ผู้ใช้สร้างขึ้นจำเป็นต้องมีโปรแกรมฆ่าเชื้อแบบแยกวิเคราะห์ที่ได้รับการดูแล การทดสอบการย้ายข้อมูล และรายการที่อนุญาตเฉพาะปลายทาง
ประเด็นสำคัญ: รู้ว่าเหตุใดจึงมีกฎนี้ — สรุปประวัติและวิธีที่ตรวจสอบเอาต์พุตในตัวแก้ไข HTML WYSIWYG ของ ToolAcre ช่วยให้การนำเสนอไม่อยู่ในมาร์กอัปของคุณ
รู้ว่าเหตุใดโครงสร้างและการนำเสนอจึงถูกแยกออกจากกัน: ความหมายควรยังคงอยู่ต่อจากการออกแบบใหม่ ในขณะที่รูปลักษณ์ควรได้รับการควบคุมอย่างสม่ำเสมอ ToolAcre บังคับใช้ขอบเขตนั้นอย่างจริงจังโดยลบทั้งการนำเสนอแบบเดิมและสไตล์อินไลน์หรือคลาสที่ทันสมัยออกจากส่วนที่คัดลอก
ใช้มุมมองแหล่งที่มาเพื่อระบุสิ่งที่สูญหาย จากนั้นกู้คืนความหมายด้วยตนเองและจัดรูปแบบที่ปลายทาง กระบวนการนี้อาจไม่คงรูปลักษณ์เก่าไว้ แต่จะสร้างเนื้อหาที่ง่ายต่อการตรวจสอบ โยกย้าย และปรับใช้ โดยไม่ต้องดำเนินการตัดสินใจที่ล้าสมัยในทุกธีมในอนาคต