นี่คือโค้ดสำหรับการสร้างปุ่มบล็อก (Block Buttons) ที่มีความกว้างเต็มหน้าจอด้วย CSS
ตัวอย่าง
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .blockBtn { display: block; width: 100%; border: none; background-color: rgb(19, 0, 105); color: white; padding: 14px 28px; font-size: 36px; cursor: pointer; text-align: center; font-weight: bold; } .blockBtn:hover { background-color: rgb(132, 161, 255); color: black; } </style> </head> <body> <h1 style="text-align: center;">ตัวอย่างปุ่มบล็อก</h1> <button class="blockBtn">Block Button</button> </body> </html>
ผลลัพธ์
โค้ดด้านบนจะแสดงผลดังนี้ −
