สถานการณ์ฝึกหัดที่ดีที่สุดสำหรับการใช้เฟรมเวิร์ก CSS คืออะไร เมื่อใดที่จะ "CSS" ของคุณเอง "ดีขึ้นตั้งแต่เริ่มต้นแทนที่จะใช้เฟรมเวิร์ก
สถานการณ์ฝึกหัดที่ดีที่สุดสำหรับการใช้เฟรมเวิร์ก CSS คืออะไร เมื่อใดที่จะ "CSS" ของคุณเอง "ดีขึ้นตั้งแต่เริ่มต้นแทนที่จะใช้เฟรมเวิร์ก
คำตอบ:
เฟรมเวิร์ก CSS ค่อนข้างยุ่งยากเพราะไม่ใช่เฟรมเวิร์คสำหรับฉันจริงๆ พวกเขาเป็นคลาสที่กำหนดไว้ล่วงหน้าเพียง แต่นี่ไม่ใช่คำถามของคุณ
เฟรมเวิร์ก CSS นั้นยอดเยี่ยมสำหรับ mock-ups และ wire-frames ฉันจะไม่แนะนำให้ใช้พวกเขาในเว็บไซต์สดเพราะพวกเขาเพิ่มคลาสที่ไม่มีความหมายให้กับมาร์กอัปของคุณ ".span3" ไม่ได้บอกอะไรฉันเกี่ยวกับเนื้อหาเพียงแค่การออกแบบ
อย่างไรก็ตามพิมพ์เขียวมีเครื่องมือเจ๋ง ๆ ที่ช่วยให้คุณรวมคลาสเฟรมเวิร์กกับเซกเมนต์ของคุณเมื่อคุณทำเสร็จแล้ว
ฉันจะหมุน CSS ของตัวเองเสมอ
เพียงหลีกเลี่ยงพวกเขาพวกเขาไม่มีอะไรนอกจากน่ารำคาญ
โดยเฉพาะอันนี้
* { margin:0; padding:0; }
ข้อร้องเรียนที่ใหญ่ที่สุดของฉันคือถ้าคุณสืบทอด / ดูแลไซต์ที่ใช้การรีเซ็ตและ / หรือเฟรมเวิร์กคุณต้องเรียนรู้กรอบการทำงานนั้นก่อนที่จะสามารถแก้ไขไซต์ได้
เมื่อฉันเพิ่มแท็ก h1 ฉันคาดหวังบางอย่าง การรีเซ็ตส่วนใหญ่จะใช้การเว้นระยะห่างระยะห่างบล็อกและอื่น ๆ ทั้งหมดเพื่อให้แท็ก h1 ไม่ทำงานตามที่ควรจะเป็นตามค่าเริ่มต้น ดังนั้นฉันต้องย้อนกลับไปและเพิ่มทุกอย่างที่เคยมีมาในตอนแรก
โดยทั่วไป (จากประสบการณ์ของฉัน) ผู้คนที่ไม่เข้าใจ CSS ที่ใช้การรีเซ็ตและเฟรมเวิร์กและทำให้เกิดการทำงานมากขึ้นสำหรับคนที่ทำ
* {margin:0; padding:0;}เป็นการรีเซ็ต CSS ที่สำคัญที่สุดของทั้งหมด มันจะลบmargin-top/maring-bottomใต้แท็กทั้งหมดแม้กระทั่งpแท็กดังนั้นหลังจากคุณจะไม่เห็นช่องว่างขนาดใหญ่ระหว่างแต่ละบรรทัด แม้แต่เว็บไซต์นี้อาจใช้เป็นp {margin:0;}อย่างอื่นเบราว์เซอร์จะมีช่องว่างขนาดใหญ่ระหว่างแต่ละบรรทัด ฉันสงสัยว่าคุณจะบอกว่ามันน่ารำคาญได้อย่างไร
มันเป็นความเห็นของฉันที่บริการ CSS Framework เท่านั้นที่ให้บริการเป็นจุดเริ่มต้นสำหรับผู้ที่ไม่คุ้นเคยกับ CSS
ฉันยังแนะนำให้ใช้ reset.css จาก Eric Meyer แต่ฉันคิดว่า CSS "frameworks" สามารถเป็นประโยชน์สำหรับโครงร่าง พิมพ์เขียว, ตาราง YUI และ 960-grid สามารถช่วยให้คุณประสบความสำเร็จในรูปแบบที่ซับซ้อนมากโดยไม่ต้องเขียน CSS ด้วยตัวคุณเอง
ในขณะที่มีข้อเสียที่ได้รับการกล่าวถึงเดียวกันอาจกล่าวได้เกี่ยวกับการสร้างเว็บไซต์ออกจาก CMS แทนการกลิ้งรหัสที่กำหนดเอง แต่พวกเขายังคงมีประโยชน์และสำหรับเว็บไซต์จำนวนมาก
หากคุณกำลังนำการออกแบบของคุณมาใช้จริงคุณจะต้องเขียน CSS ของคุณเอง (เว้นแต่ว่ามีคนอื่นเขียนการออกแบบที่คุณต้องการอย่างแน่นอน)
สมมติว่าคุณกำลังเขียน CSS ของคุณเอง "frameworks" จะมีประโยชน์เมื่อคุณมีสไตล์ที่:
สำหรับสไตล์ที่เรียบง่ายจริง ๆ ควรใช้คลาสเพื่อระบุว่าบางสิ่งคืออะไร (เช่นclass="navigation") จากนั้นกำหนดรูปลักษณ์ของมันโดยใช้กฎสไตล์กับคลาสนั้นในสไตล์ชีตของคุณ
แต่สำหรับสไตล์ที่ซับซ้อนมากขึ้นซึ่งไม่จำเป็นต้องเชื่อมโยงกับองค์ประกอบใด ๆ (เช่นสไตล์ที่เกี่ยวข้องกับเลย์เอาต์ชนิดที่เฟรมเวิร์กให้ชื่อต้องการ.span3) ไม่มีอะไรผิดปกติในการใส่ไว้ในคลาสและใช้คลาสนั้นใน CSS คุณสามารถใช้ทั้งสองวิธีร่วมกัน
ในไซต์ที่มีขนาดใหญ่และซับซ้อนมากขึ้นซึ่งองค์ประกอบต่างๆมีแนวโน้มที่จะถูกรวมเข้าด้วยกันในรูปแบบที่ไม่สามารถคาดเดาได้วิธีการที่คล้ายกับกรอบสามารถช่วยให้โค้ดของคุณสามารถจัดการได้
ฉันจะบอกว่าคุณอาจเขียน "กรอบ" ของคุณเอง ฉันใส่ "กรอบงาน" ในเครื่องหมายคำพูดเพราะ CSS ไม่ใช่ภาษาที่ใหญ่มาก คุณสามารถอ่าน CSS: The Definitive Guide (Eric Meyer) ในหนึ่งวันจากนั้นอ่านโค้ดทั้งหมดในตัวอย่างเช่นพิมพ์เขียว (CSS“ framework”) และเข้าใจว่าเกิดอะไรขึ้น คุณอาจจำเป็นต้องศึกษาวิธีแก้ปัญหา IE เพียงเล็กน้อย แต่เรากำลังพูดถึงลำดับความสำคัญน้อยกว่าความซับซ้อนน้อยกว่าเช่น jQuery ที่นี่
ฉันใช้พิมพ์เขียวสำหรับ CSS
CSS คือทุกคนที่กล่าวมาข้างต้นตรงไปตรงมาจริงๆ
อย่างไรก็ตามในความเป็นจริงคุณต้องพิจารณาแพลตฟอร์ม
ด้วย CSS เอ็นจิ้นการแสดงผลจะเพิ่มความซับซ้อน
Gecko vs WebKit กับ Presto กับ Trident ... ใครอยากทำทุกอย่าง
สิ่งที่ 'เฟรมเวิร์ก' มอบให้คุณที่นี่คือความสามารถในการเขียนเลย์เอาต์ที่น่าจะทำงานได้กับเบราว์เซอร์ทั้งหมดดังนั้นคุณจะไม่ต้องไปหา 'WTF-am-I-doing = -this-crap' IE 7 quirksmode แก้ไขหรือสิ่งที่น่าหัวเราะในทำนองเดียวกัน
เฟรมเวิร์กจะทำ 90% ของเลย์เอาต์ที่คุณต้องการจากนั้นคุณสามารถเพิ่มในสไตล์ของคุณเองได้ในภายหลัง
ดังนั้นเพื่อตอบคำถามฉันจะบอกว่าเลือกกรอบและดูว่ามันเหมาะกับคุณหรือไม่ มันอาจจะ จากนั้นคุณเป็นสีทองและสามารถกลับไปที่สิ่งที่คุณต้องการจะทำ ถ้าไม่เช่นนั้นให้ขยายโดยใช้ CSS และเปลี่ยนสิ่งที่ไม่ทำงาน ด้วยวิธีนี้คุณจะรักษาผลประโยชน์ข้ามเบราว์เซอร์ แต่ยังสามารถปรับแต่งได้
ในฐานะที่เป็นประโยชน์เล็กน้อยถ้าคุณเลือกและใช้มันตลอดเวลาและจากนั้นก็มีอาการป่วยหรือได้รับการเลื่อนตำแหน่งและต้องฝึกอบรมผู้สืบทอดของคุณคุณสามารถพูดได้ว่า:
"ใช่ฉันใช้เฟรมเวิร์ก ABC เอกสารอยู่ที่นี่รหัสอยู่ที่นั่นฝึกฝนได้ดีโชคดี"
เมื่อมันแก้ได้ทุกความต้องการ (ขึ้นอยู่กับแนวคิดของการตัดเย็บ )
จากหนังสือเล่มเดียวในกรอบ http://www.oreilly.com/web-platform/free/book-of-html-css-frameworks.csp (เฉพาะการเชื่อมโยงเพราะฟรีและมีความเกี่ยวข้องที่นี่)