1. 부트 스트랩에서 grid 시스템에 대하여 설명하시오.
- A twelve column system with six default responsive tiers
2. 부트 스트랩에서 이미지를 반응형으로 만들어 보시오.
<!-- code --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous" /> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous" </script> </head> <body> <div class="container"> <div class="row"> <div class="col-sm-6"> <img class="img-fluid" src="https://upload.wikimedia.org/wikipedia/commons/c/cd/Green_and_Black%27s_dark_chocolate_bar_2.jpg" alt="" /> </div> <div class="col-sm-6"> <img class="img-fluid" src="https://upload.wikimedia.org/wikipedia/commons/c/cd/Green_and_Black%27s_dark_chocolate_bar_2.jpg" alt="" /> </div> </div> </div> </body> </html>
3. 부트스트랩에서 마진 패딩을 주는 방법은?
- margin :
m-1,m-2,m-3,m-4,m-5- padding :
p-1,p-2,p-3,p-4,p-5
Brave but clumsy