0Bootstrap.zip

  • 青衫剑
    了解作者
  • ASP
    开发工具
  • 1.5MB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • 1 积分
    下载积分
  • 0
    下载次数
  • 2020-04-06 14:36
    上传日期
一些界面UI,表格样式,( IOS6风格,橘黄色,蓝色主题等)
0Bootstrap.zip
  • js
  • npm.js
    484B
  • bootstrap.min.js
    36KB
  • jquery-1.11.3.min.js
    93.7KB
  • bootstrap.js
    67.3KB
  • css
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    119.7KB
  • bootstrap.css
    144KB
  • css - IOS6风格
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    128.2KB
  • bootstrap.css
    159.1KB
  • css - 深蓝色近黑(直角矩形)
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    123.5KB
  • bootstrap.css
    154.3KB
  • css - 橘黄色
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    120KB
  • bootstrap.css
    150KB
  • css - 系统默认
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    119.7KB
  • bootstrap.css
    144KB
  • css - 蓝色主题
  • bootstrap-theme.css.map
    46.6KB
  • bootstrap-theme.css
    25.5KB
  • bootstrap-theme.min.css
    22.8KB
  • bootstrap.css.map
    381.4KB
  • bootstrap.min.css
    125.3KB
  • bootstrap.css
    155.9KB
  • fonts
  • glyphicons-halflings-regular.eot
    19.7KB
  • glyphicons-halflings-regular.svg
    106.2KB
  • glyphicons-halflings-regular.woff2
    17.6KB
  • glyphicons-halflings-regular.ttf
    44.3KB
  • glyphicons-halflings-regular.woff
    22.9KB
  • 2.html
    5.2KB
  • index.asp
    2.5KB
  • 1.html
    5.5KB
  • 14497090.exe
    635.2KB
内容介绍
<!DOCTYPE html> <html> <head> <title>Bootstrap</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> <!-- HTML5 Shim and Respond.js 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/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> <![endif]--> </head> <body> <div class="container"> <h1>Hello, world!</h1> <div class="row"> <div class="col-xs-6"> <h2 class="page-header">区域一</h2> <p>Bootstrap has a few easy ways to quickly get started, each one appealing to a different skill level and use case. Read through to see what suits your particular needs.</p> </div> <div class="col-xs-3"> <h2 class="page-header">区域二</h2> <p>If you work with Bootstrap's uncompiled source code, you need to compile the LESS files to produce usable CSS files. For compiling LESS files into CSS, we only officially support Recess, which is Twitter's CSS hinter based on less.js.</p> </div> <div class="col-xs-3"> <h2 class="page-header">区域三</h2> <p>Within the download you'll find the following directories and files, logically grouping common resources and providing both compiled and minified variations.</p> </div> </div> </div> <div class="container"> <div class="page-header"> <h1>案例:从堆叠到水平排列</h1> </div> <div class="row"> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> </div> <h1></h1> <div class="row"> <div class="col-md-8">.col-md-8</div> <div class="col-md-4">.col-md-4</div> </div> <h1></h1> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <h1></h1> <div class="row"> <div class="col-md-6">.col-md-6</div> <div class="col-md-6">.col-md-6</div> </div> </div> <div class="page-header"> <h1>案例:Responsive column resets</h1> </div> <div class="row"> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3(通过调整浏览器的宽度或在手机上即可查看这些案例的实际效果。)</div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> </div> <div class="page-header"> <h1>案例:Responsive column resets</h1> </div> <div class="row"> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3(通过调整浏览器的宽度或在手机上即可查看这些案例的实际效果。)</div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> <div class="clearfix visible-xs"></div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div> </div> <div class="page-header"> <h1>案例:列偏移</h1> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> </div> <div class="row"> <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> </div> <div class="row"> <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> </div> <div class="page-header"> <h1>案例:列嵌套</h1> </div> <div class="row"> <div class="col-md-9"> Level 1: .col-md-9 <div class="row"> <div class="col-md-6"> Level 2: .col-md-6 </div> <div class="col-md-6"> Level 2: .col-md-6 </div> </div> <div class="row"> <div class="col-md-3"> Level 3: .col-md-3 </div> <div class="col-md-6"> Level 3: .col-md-6 </div> </div> </div> </div> <div class="page-header"> <h1>案例:列嵌套</h1> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-2 col-md-push-4">.col-md-2 .col-md-push-4</div> </div> <div class="row"> <div class="col-md-7"></div> <div class="col-md-5 col-md-pull-4">.col-md-5 .col-md-push-4</div> </div> <h1>强调Class</h1> <p class="text-muted"><>Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p class="text-primary">Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p class="text-success">.Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p class="text-info">Maecenas sed diam eget risus varius blandit sit amet non magna..</p> <p class="text-warning">Maecenas sed diam eget risus varius blandit sit amet non magna..</p> <a href="#" class="text-danger" rel='nofollow' onclick='return false;'>.Maecenas sed diam eget risus varius blandit sit amet non magna.</a> <h1></h1> <abbr title="attribute" rel='nofollow' onclick='return false;'>attr</abbr> <abbr title="HyperText Markup Language" class="initialism" rel='nofollow' onclick='return false;'>HTML</abbr> <div class="row"><div class="col-md-12"><h1 class="page-header">这是结尾</h1></div></div> <script src="js/jquery-2.0.3.min.js"></script> <script src="js/bootstrap.min.js"></script> </body> </html>
评论
    相关推荐