首页 > 代码库 > bootstrop框架----像素
bootstrop框架----像素
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><link rel="stylesheet" href="http://www.mamicode.com/css/bootstrap.css"><style>div[class*=‘col-‘]{ background:#66; border:2px solid #000000; height:50px; background:#006; color:#FFF;}</style></head><body><div class="container"><div class="row"> <div class="col-lg-4">col-lg-4适应1200像素 1200下则充填</div> <div class="col-lg-4">col-lg-4适应1200像素 1200下则充填</div> <div class="col-lg-4">col-lg-4适应1200像素 1200下则充填</div></div><div class="row"> <div class="col-md-4">col-md-4适应960像素 960下则充填</div> <div class="col-md-4">col-md-4适应960像素 960下则充填</div> <div class="col-md-4">col-md-4适应960像素 960下则充填</div> </div> <div class="row"> <div class="col-sm-4">col-sm-4适应768像素 768下则充填</div> <div class="col-sm-4">col-sm-4适应768像素 768下则充填</div> <div class="col-sm-4">col-sm-4适应768像素 768下则充填</div> </div> <div class="row"> <div class="col-xs-4">col-xs-4不充填</div> <div class="col-xs-4">col-xs-4不充填</div> <div class="col-xs-4">col-xs-4不充填</div> </div> <div class="row"> <div class="col-lg-4 col-md-6">col-lg-4 col-md-6低于md960像素则充填</div> <div class="col-lg-4 col-md-6">col-lg-4 col-md-6低于md960像素则充填</div> <div class="col-lg-4 col-md-6">col-lg-4 col-md-6低于md960像素则充填</div> </div></body><script src="http://www.mamicode.com/js/bootstrap.js"></script><script src="http://www.mamicode.com/js/jquery-1.11.1.js"></script></html>
-------------------------简单的图片框架加字体
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><link rel="stylesheet" href="http://www.mamicode.com/css/bootstrap.css"><style>div[class*=‘col-‘]{ background:#66; border:2px solid #000000; height:50px; background:#006; color:#FFF;}</style></head><body><div class="container"><div class="row"> <div class="col-lg-3 col-md-4 col-sm-6"> <div class="thumbnail"> <img src="http://www.mamicode.com/img/codeguide.png"> <div class="caption"> <h3>Bootstrap 编码规范</h3> <p>Bootstrap 编码规范:编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范。 </p> </div> </div> </div> <div class="col-lg-3 col-md-4 col-sm-6"> <div class="thumbnail"> <img src="http://www.mamicode.com/img/codeguide.png"> <div class="caption"> <h3>Bootstrap 编码规范</h3> <p>Bootstrap 编码规范:编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范。 </p> </div> </div></div> <div class="col-lg-3 col-md-4 col-sm-6"> <div class="thumbnail"> <img src="http://www.mamicode.com/img/codeguide.png"> <div class="caption"> <h3>Bootstrap 编码规范</h3> <p>Bootstrap 编码规范:编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范。 </p> </div> </div></div> <div class="col-lg-3 col-md-4 col-sm-6"> <div class="thumbnail"> <img src="http://www.mamicode.com/img/codeguide.png"> <div class="caption"> <h3>Bootstrap 编码规范</h3> <p>Bootstrap 编码规范:编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范。 </p> </div> </div></div></div></body><script src="http://www.mamicode.com/js/bootstrap.js"></script><script src="http://www.mamicode.com/js/jquery-1.11.1.js"></script></html>
bootstrop框架----像素
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。