5.1 แอตทริบิวต์สไตล์ของแท็ก

และอีกสองสามสิ่งที่มีประโยชน์เกี่ยวกับ HTML เมื่อเว็บเริ่มได้รับความนิยมก็มีความต้องการมากขึ้นสำหรับเว็บเพจที่ออกแบบให้สวยงามหรือสวยงามมาก ปัญหานี้แก้ไขได้โดยใช้ style

รูปแบบทั่วไปของแอตทริบิวต์นี้มีรูปแบบดังต่อไปนี้:


        <tag style="name=value;name2=value2;nameN=valueN">

ค่าแอตทริบิวต์ คั่นstyleด้วยเครื่องหมายอัฒภาค แสดงรายการ "สไตล์" ทั้งหมดที่จำเป็นต้องใช้กับแท็ก

สมมติว่าคุณต้องการแสดงรูปภาพเป็นสี่เหลี่ยมจัตุรัส100*100และทำให้โปร่งใสครึ่งหนึ่ง ในการทำเช่นนี้คุณต้องเพิ่มสไตล์พิเศษ:

Java university
  • ความกว้าง = 100px;
  • ความสูง = 100px;
  • ความทึบ = 0.5;

จากนั้นโค้ด HTML ที่มีรูปภาพนี้จะมีลักษณะดังนี้:


       <img src="logo.png" style="width=100px;height=100px;opacity=0.5">

มีสไตล์เป็นร้อยเป็นพัน และนักพัฒนาเบราว์เซอร์ก็คิดค้นสิ่งใหม่ๆ อยู่ตลอดเวลา เป็นเรื่องดีที่คุณกำลังเรียนเพื่อเป็น Java Developer ไม่ใช่ Web Designer :)

5.2 สไตล์ CSS ยอดนิยม

ไม่น่าเป็นไปได้ที่คุณจะเขียนโค้ด HTML จำนวนมากหรือแก้ไขรูปแบบในชีวิตของคุณ แต่อะไรก็เกิดขึ้นได้ ตัวอย่างเช่น คุณกำลังเขียนหน้า HTML ขนาดเล็กสองสามหน้าเพื่อทดสอบไฟล์API. ดังนั้นการรู้สไตล์พื้นฐานHTMLจึงมีประโยชน์

ด้านล่างนี้คือ 10 รายการที่พบบ่อยที่สุดสำหรับนักพัฒนาแบ็กเอนด์:

# ชื่อ ตัวอย่าง คำอธิบาย
1 ความกว้าง ความกว้าง: 100px ความกว้างขององค์ประกอบเป็นพิกเซล
2 ความสูง ความสูง: 50% ความสูงขององค์ประกอบเป็นเปอร์เซ็นต์ (ของความกว้างของพาเรนต์)
3 แสดง จอแสดงผล: ไม่มี องค์ประกอบการแสดงผล (ไม่แสดงองค์ประกอบ)
4 ทัศนวิสัย การมองเห็น: ซ่อนเร้น การมองเห็นองค์ประกอบ (องค์ประกอบถูกซ่อนไว้ แต่พื้นที่สงวนไว้สำหรับองค์ประกอบนั้น)
5 สี สี: แดง; สีข้อความ
6 สีพื้นหลัง สีพื้นหลัง: ควัน สีพื้นหลัง
7 ชายแดน เส้นขอบ: 1px สีดำทึบ; เส้นขอบ (กว้าง 1px, สีดำ, เส้นทึบ)
8 แบบอักษร ตัวอักษร: verdana 10pt ตัวอักษร: verdana ขนาด 10pt
9 จัดข้อความ จัดข้อความ: กึ่งกลาง; การจัดตำแหน่งข้อความในแนวนอน
10 ขอบ ขอบ:2px ช่องว่างนอกองค์ประกอบ

คุณไม่จำเป็นต้องจำแท็กเหล่านี้ ทุกอย่างอยู่บนอินเทอร์เน็ต นอกจากนี้ "สไตล์" แต่ละรายการยังมีชุดของค่าที่ถูกต้องและรูปแบบของตัวเองสำหรับอธิบายค่า ดูอย่างน้อยที่borderหรือfont.