ยินดีต้อนรับกลับ.
มาดูวิธีการเพิ่ม CSS และ JavaScript ให้กับดัชนีของเรากัน html เพราะถ้าคุณจำได้ว่าเรากำลังใช้สคริปต์และ
CSS ในที่นี้
อีกครั้งกับ Flask
ถ้าเราไปที่ CSIS เราจะเห็นว่ามีไฟล์สแตติก
ไฟล์คงที่หมายความว่าเป็นไฟล์ที่ไม่มีวันเปลี่ยนแปลง
นั่นคือ CSS และ JavaScript
โดยปกติเมื่อเราส่งออกไป พวกเขาจะไม่เปลี่ยนสแตติกของพวกเขา
และคุณเห็นตรงนี้ว่าใน Flask เราต้องเก็บไฟล์ไว้บนระบบไฟล์เป็นเอกสารสไตล์สแลชแบบสแตติก ดังนั้นเราจึงจำเป็นต้องสร้างโฟลเดอร์สแตติก
นี่เป็นสิ่งที่คุณต้องทำความคุ้นเคยอีกครั้ง
แต่สมมติว่าในที่นี้ เราจะสร้างเช่นเดียวกับที่เราทำกับเทมเพลต เราจะสร้างโฟลเดอร์คงที่เพื่อให้แอป
Flask รู้ว่าต้องค้นหาไฟล์ CSS และ JavaScript ที่นี่
ดังนั้นฉันจะย้ายไฟล์ JavaScript
ไปยังโฟลเดอร์สแตติก
และทำเช่นเดียวกันกับไฟล์ CSS
ดังนั้นอีกครั้ง ย้ายที่
ให้คงที่
ทีนี้ ถ้าฉันบันทึกและรัน คุณจะเห็นว่ามันใช้งานไม่ได้จริงๆ
นั่นสิ ทำไมล่ะ?
คุณสามารถคิดออก?
อีกครั้งเพราะเราไม่ได้พูดถึง HTML และ CSS และ JavaScript มากเกินไป
อย่ากังวลหากคุณไม่ได้รับข้อมูลนี้ แต่ถ้าคุณจำในไฟล์ HTML ที่จัดทำดัชนีของเรา เราจะอ้างอิงไฟล์เหล่านี้ภายในนี้
แต่เส้นทางของไฟล์ได้เปลี่ยนไปแล้ว
ตอนนี้พวกเขาอยู่ในโฟลเดอร์คงที่
แบบนี้.
เลยต้องบอกว่าสถิตย์
สุนัขสคริปต์
ถ้าฉันกลับไปตอนนี้
และสดชื่น
เฮ้ ดูนั่นสิ
เว็บไซต์สีเขียวที่สวยงามของฉัน สมมติว่านี่คือเว็บไซต์คริสต์มาส ตอนนี้ใช้งานได้แล้ว หากฉันเปิดเครื่องมือสำหรับนักพัฒนา
ไปที่เครือข่ายและรีเฟรช
เฮ้ ตรวจสอบออก
ฉันมีเอกสารของฉัน
จากนั้นฉันก็มีไฟล์ JS ของฉัน
แล้วทำไมไม่มี CSS?
ให้ฉันได้สดชื่นอีกครั้ง
อ๋ออยู่ตรงนั้นนี่เอง
เรามี CSS สไตล์
เรามี JS และเรามีเอกสาร
สุดยอด.
หากคุณสงสัยว่าเหตุใดเราจึงได้รับข้อผิดพลาดเกี่ยวกับไอคอน fab เล็กน้อย ไอคอน fab จะเป็นไอคอนเล็กๆ ที่แสดงบนแท็บต่างๆ
ตรงนี้
ดังนั้นเราจึงสามารถเพิ่มไอคอน fab ของเราเองได้หากต้องการและส่งภาพ
และวิธีที่เราจะทำคือไปที่จุดสิ้นสุดของเราอีกครั้ง แทนที่จะเป็นบล็อก
ฉันจะบอกว่าไอคอน fab dot iko สำหรับไอคอน และเราก็แค่ส่งรูปภาพไปให้
อืม.
เราจะทำสิ่งนี้ได้อย่างไร?
ฉันจะแสดงคำตอบให้คุณเห็นในวิดีโอหน้า แต่ฉันต้องการให้คุณลองดูและคิดดูว่าคุณจะส่งรูปภาพกลับไปยังจุดสิ้นสุดนี้ได้อย่างไร
เพื่อที่เราจะไม่ได้รับข้อผิดพลาดนี้
และเมื่อเบราว์เซอร์ร้องขอสิ่งนี้โดยอัตโนมัติ ซึ่งเบราว์เซอร์ทั้งหมดทำ ก็จะแสดงไอคอนเล็กๆ
ตรงนี้สำหรับเรา
ดังนั้นเลือกไอคอนใดก็ได้ที่คุณต้องการและดูว่าคุณจะแก้ปัญหาได้หรือไม่ในวิดีโอหน้า
ฉันจะแสดงคำตอบให้คุณดู