home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

เน้นในการจัดรูปแบบข้อความ HTML:ตัวหนา ตัวเอียง และขีดเส้นใต้

มีหลายวิธีในการจัดรูปแบบข้อความของคุณใน HTML เพื่อดึงดูดความสนใจไปที่บางสิ่งบางอย่าง ในบทความนี้ เราจะพูดถึงวิธีจัดรูปแบบข้อความของคุณใน HTML ให้เป็นตัวหนา เป็นตัวเอียง หรือขีดเส้นใต้ คุณจะเป็นผู้เชี่ยวชาญด้านการจัดรูปแบบในเวลาไม่นาน!

ตัวหนา

การตั้งค่าข้อความเป็น ตัวหนา ใน HTML ก่อน HTML5 เกี่ยวข้องกับข้อความที่คุณต้องการเป็นตัวหนาด้วย <b> แท็ก:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is <b>bold</b></p>
   <script src="script.js"></script>
 </body>
</html>

เมื่อมาตรฐาน HTML5 เปิดตัว วิธีที่นิยมในการทำให้ข้อความเป็นตัวหนาเปลี่ยนเป็นการใช้ <strong> แท็ก:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is also <strong>bold</strong></p>
   <script src="script.js"></script>
 </body>
</html>

ข้อแตกต่างระหว่าง <b> และ <strong> องค์ประกอบคือความหมาย โปรแกรมอ่านหน้าจอจะเห็น <strong> แท็กและจะเน้นข้อความอย่างชัดเจนมากขึ้นเมื่ออ่าน <b> ไม่อนุญาตให้ทำเช่นนั้น

ตัวเอียง

เช่นเดียวกับ ตัวหนา มีสองมาตรฐานที่แตกต่างกันที่เรารู้จักสำหรับการสร้างข้อความที่เป็นตัวเอียง ก่อนหน้ามาตรฐาน HTML5 ข้อความตัวเอียงถูกสร้างขึ้นโดยการห่อหุ้มไว้ใน <i> แท็ก 

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is in <i>italics</i></p>
   <script src="script.js"></script>
 </body>
</html>

เมื่อ HTML5 กลายเป็นมาตรฐาน <i> แท็กทำให้มีความหมายมากขึ้น <em> แท็ก “em” ย่อมาจาก emphasis . <em> แท็กส่งสัญญาณให้โปรแกรมอ่านหน้าจอให้ความสำคัญกับข้อความมากขึ้น เพื่อให้ผู้ใช้สามารถแยกความแตกต่างระหว่างข้อความปกติและข้อความที่เน้น

81% ของผู้เข้าร่วมกล่าวว่าพวกเขารู้สึกมั่นใจมากขึ้นเกี่ยวกับโอกาสในการทำงานด้านเทคโนโลยีหลังจากเข้าร่วม bootcamp จับคู่กับ Bootcamp วันนี้

ผู้สำเร็จการศึกษาจากหลักสูตร bootcamp โดยเฉลี่ยใช้เวลาน้อยกว่าหกเดือนในการเปลี่ยนอาชีพ ตั้งแต่เริ่มต้น bootcamp ไปจนถึงหางานแรก

ขีดเส้นใต้

ข้อความที่ขีดเส้นใต้ HTML มักใช้เพื่อระบุคำที่สะกดผิด อย่าใช้ในที่ที่อาจสับสนสำหรับไฮเปอร์ลิงก์ ทำเครื่องหมายข้อความของคุณด้วย <u> เพื่อทำเครื่องหมายสำหรับการจัดรูปแบบ แล้วใช้ CSS เพื่อระบุประเภทของรูปแบบการขีดเส้นใต้ที่คุณต้องการ 

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <style>
     p u {
       text-decoration: underline red wavy;
     }
   </style>
 </head>
 <body>
   <p>This is a <u>mispelled</u> word</p>
 </body>
</html>



บทสรุป

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