使用 BootStrap 中的CSS全局样式,我们就可以不用自己定义CSS样式了。
响应式图片
<!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 CSS全局样式</title> <link href="./BootStrap_3.3.7_libs/css/bootstrap.min.css" rel="stylesheet"> <script src="./jQuery/jquery-3.2.1.min.js"></script> <script src="./BootStrap_3.3.7_libs/js/bootstrap.min.js"></script> </head> <body> <!-- 使用BootStrap 之 CSS全局样式中的图片 --> <!--<h3>使用BootStrap 之 CSS全局样式中的图片</h3>--> <img src="./img/banner_3.jpg" class="img-responsive" alt="Responsive image"> <!-- 圆角方形 --> <img src="./img/banner_3.jpg" alt="Responsive image" class="img-rounded"> <!-- 圆形 --> <img src="./img/banner_3.jpg" alt="Responsive image" class="img-circle"> <!-- 方角方形 --> <img src="./img/banner_3.jpg" alt="Responsive image" class="img-thumbnail"> </body> </html>
详情请查看:全局 CSS 样式