Bootstrap 媒体对象的用法
媒体对象的目的是大幅缩短信息块的开发代码。
您可以尝试运行以下代码来实现媒体对象
示例
<!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet"> <script src = "/scripts/jquery.min.js"></script> <script src = "/bootstrap/js/bootstrap.min.js"></script> </head> <body> <div class = "media"> <a class = "pull-left" href = "#"> <img class = "media-object" src = "https://tutorialspoint.com/sql/images/sql-mini-logo.jpg" alt = "SQL"> </a> <div class = "media-body"> <h4 class = "media-heading">Media heading</h4> This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. </div> </div> <div class = "media"> <a class = "pull-left" href = "#"> <img class = "media-object" src = "https://tutorialspoint.com/sql/images/sql-mini-logo.jpg" alt = "SQL"> </a> <div class = "media-body"> <h4 class = "media-heading">Media heading</h4> This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. <div class = "media"> <a class = "pull-left" href = "#"> <img class = "media-object" src = "https://tutorialspoint.com/sql/images/sql-mini-logo.jpg" alt = "SQL"> </a> <div class = "media-body"> <h4 class = "media-heading">Media heading</h4> This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. This is some sample text. </div> </div> </div> </div> </body> </html>
广告
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP