<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <nav class="navbar navbar-inverse"> <a class="navbar-brand" href="#">selected topic : Homework 1 by Code : 6062210005 sirichanya prakotasung</a> </nav> <div class="container"> <div class="row"> <div class="col-sm-12 col-md-6 col-lg-3"> จงเขียนโปรแกรมเพื่อแสดงผล การ์ด ข้างล่างนี้ตามที่กำหนด 1)หน้าจอ xs และ sm ให้แสดงแถว 2) md ให้แสดงแถวละ 2 การ์และ 3) lg และ xl ให้แสดงแถวละ 4 การ์ด </div> </div> <div class="row"> <div class="col-sm-12 col-md-6 col-lg-3"> <div class="panel panel-info"> <div class="panel-body"> <h1>Card 1 </h1> <h4>my homework 1 เรื่องการใช้ navbarและGrid</h4> <p>6062210005 sirichanya prakotasung </p> </div> </div> </div> <div class="col-sm-12 col-md-6 col-lg-3"> <div class="panel panel-info"> <div class="panel-body"> <h1>Card 2 </h1> <h4>my homework 1 เรื่องการใช้ navbarและGrid</h4> <p>6062210005 sirichanya prakotasung </p> </div> </div> </div> <div class="col-sm-12 col-md-6 col-lg-3"> <div class="panel panel-info"> <div class="panel-body"> <h1>Card 3 </h1> <h4>my homework 1 เรื่องการใช้ navbarและGrid</h4> <p>6062210005 sirichanya prakotasung </p> </div> </div> </div> <div class="col-sm-12 col-md-6 col-lg-3"> <div class="panel panel-info"> <div class="panel-body"> <h1>Card 4 </h1> <h4>my homework 1 เรื่องการใช้ navbarและGrid</h4> <p>6062210005 sirichanya prakotasung </p> </div> </div> </div> </div> </div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> </body> </html>
We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy. Accept Learn more