Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

เพิ่มขนาดสำหรับปุ่ม Bootstrap


หากต้องการเพิ่มขนาดให้กับปุ่มใน Bootstrap ให้ลองใช้คลาสต่อไปนี้:

Class
คำอธิบาย
.btn-lg
สิ่งนี้ทำให้ขนาดปุ่มใหญ่ขึ้น
.btn-sm
ทำให้ปุ่มมีขนาดเล็ก
.btn-xs
สิ่งนี้ทำให้ขนาดปุ่มเล็กเป็นพิเศษ
.btn-block
สิ่งนี้จะสร้างปุ่มระดับบล็อก—ปุ่มที่ขยายเต็มความกว้างของพาเรนต์

ตัวอย่าง

คุณสามารถลองเรียกใช้รหัสต่อไปนี้เพื่อสร้างปุ่มขนาดเล็ก -

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>  
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <link rel = "stylesheet" href = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
   </head>
   <body>
      <button type = "button" class = "btn btn-default btn-sm">
         Small button
      </button>
   </body>
</html>