长时间内涌现出大批量利用bootstrap搭建的网址,可以创设标题亿万先生官方网站:、段落、列表及其他内联成分

Bootstrap 是一个用来火速支付 Web 应用程序和网址的前端框架。Bootstrap
是依照 HTML、CSS、JAVASCCRUISERIPT 的。

Bootstrap是壹款当下非凡流行的前端框架,简来讲之,正是html,css,javascript的工具集,我们能够用bootstrap搭建出简洁,清新的网址或软件分界面,有了bootstrap这些利器后台开采职员再也不要发愁前台分界面包车型的士搭建了。Bootstrap是twitter的工程师在业余时间开垦的,在最大最盛行的开源站点github上开源未来讯速成为该网址上更新最频仍的体系,大批量工程师踊跃为该品种进献代码,长期内涌现出多量选用bootstrap搭建的网址。何以bootstrap发展进度会如此惊人呢?那关键得益于bootstrap的玄妙天性:

  • 自 Bootstrap 叁 起,框架包含了由上至下于全数库的运动装备优先的体裁。
  • 浏览器援助:全体的主流浏览器都扶助 Bootstrap。

    亿万先生官方网站: 1 亿万先生官方网站: 2 亿万先生官方网站: 3 亿万先生官方网站: 4 亿万先生官方网站: 5

  • 轻松上手:只要您抱有 HTML 和 CSS 的基础知识,您就足以起首读书
    Bootstrap。

  • 响应式设计:Bootstrap 的响应式 CSS
    能够自适应于台式机、三星平板和手机。

活动设备优先将本着移动的表征放在了第一位

Bootstrap 使用 Helvetica Neue、 Helvetica、 Arial 和 sans-serif
作为其暗中同意的字体栈。

浏览器帮忙:全体的主流浏览器都支持 Bootstrap

选用 Bootstrap 的排版特性,能够创立标题、段落、列表及其余内联成分。

轻便上手:只要您抱有 HTML 和 CSS 的基础知识,您就能够早先上学
Bootstrap

内联子标题

借使要求向其余标题加多四个内联子标题,只要求轻便地在要素两旁加多<small>,可能增加 .small class,这样子您就能收获一个字号更加小的颜色更加浅的文件,如下边实例所示:

响应式设计:Bootstrap 的响应式 CSS
能够自适应于笔记本、华为平板和手提式有线电话机。

实例

<h一>笔者是标题1h1. <small>我是副标题壹h一</small></h一><h2>作者是标题2h二. <small>小编是副题目二h二</small></h贰><h三>作者是标题3h三. <small>作者是副标题三h3</small></h三><h④>作者是题目4h肆. <small>作者是副标题肆h4</small></h四><h伍>作者是题目5h五. <small>作者是副标题5h5</small></h五><h6>小编是题目6h6. <small>小编是副标题6h陆</small></h陆>

 

 

 

 

<divclass=”container”><divclass=”jumbotron”><h一>作者的第一个Bootstrap 页面</h一><p>重新初始化窗口大小,查看响应式效果!</p></div><divclass=”row”><divclass=”col-sm-肆”><h三>Column
一</h三><p>学的不单是本领,更是但愿!</p><p>再牛逼的愿意,也抵不住你傻逼似的坚定不移!</p></div><divclass=”col-sm-四”><h三>Column
二</h叁><p>学的不单是技能,更是期望!</p><p>再牛逼的盼望,也抵不住你傻逼似的持之以恒!</p></div><divclass=”col-sm-四”><h三>Column
3</h三><p>学的不不过技巧,更是希望!</p><p>再牛逼的梦想,也抵不住你傻逼似的坚韧不拔!</p></div></div></div>

它涵盖了功效强大的放置组件,易于定制

 

上边大家来看用bootstrap搭建出来的最简易的二个页面。

 

<!DOCTYPE html>

<html lang=”zh-cn”>

  <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=”css/bootstrap.min.css” rel=”stylesheet”>

 

    <!– 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=”http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"&gt;&lt;/script&gt;

      <script
src=”http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"&gt;&lt;/script&gt;

    <![endif]–>

  </head>

<body>

 

<div class=”container”>
  <div class=”jumbotron”>
    <h一>小编的首先个 Bootstrap 页面</h一>
    <p>重新初始化窗口大小,查看响应式效果!</p>
  </div>
  <div class=”row”>
    <div class=”col-sm-4″>
      <h3>Column 1</h3>
      <p>学的不仅是技巧,更是希望!</p>
      <p>再牛逼的盼望,也抵不住你傻逼似的百折不回!</p>
    </div>
    <div class=”col-sm-4″>
      <h3>Column 2</h3>
      <p>学的不仅仅是技能,更是希望!</p>
      <p>再牛逼的想望,也抵不住你傻逼似的百折不挠!</p>
    </div>
    <div class=”col-sm-4″>
      <h3>Column 3</h3>
      <p>学的不单是本事,更是但愿!</p>
      <p>再牛逼的愿意,也抵不住你傻逼似的持之以恒!</p>
    </div>
  </div>
</div>

</body>

</html>

相关文章

网站地图xml地图