bootstrap 加入我们 模板
2018-07-15 20:51:00 weixin_33756418 阅读数 226
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--设置视口的宽度,(值为设备的理想宽度),页面初始缩放值<理想宽度/可见宽度>-->
    <!--视口的作用:在移动的浏览器中,当页面宽度超出设备,浏览器的内部虚拟出一个页面容器,会将页面缩放到设备这么大来显示-->
    <!--
        width   设置layout viewport  的宽度,为一个正整数,或字符串"width-device"
        initial-scale   设置页面的初始缩放值,为一个数字,可以带小数
        minimum-scale   允许用户的最小缩放值,为一个数字,可以带小数
        maximum-scale   允许用户的最大缩放值,为一个数字,可以带小数
        height  设置layout viewport  的高度,这个属性对我们并不重要,很少使用
        user-scalable   是否允许用户进行缩放,值为"no"或"yes", no 代表不允许,yes代表允许
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="../css/bootstrap.css" rel="stylesheet">

    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询(media queries)功能 -->
    <!-- 警告:通过 file:// 协议(就是直接将 html 页面拖拽到浏览器中)访问页面时 Respond.js 不起作用 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>你好,世界!</h1>

    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery,所以必须放在前边) -->
    <script src="../js/jquery-1.11.3.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="../js/bootstrap.min.js"></script>
  </body>
</html>
2019-02-07 16:32:16 CQL_K21 阅读数 305

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8"/><!--设置字符集utf-8编码-->
    <!--注意:bootstrap不支持IE的兼容模式,下面的一句代码在IE浏览器中运行最新渲染模式-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--Bootstrap 3 的设计目标是移动设备优先,然后才是桌面设备。
        为了让 Bootstrap开发的网站对移动设备友好, 
        确保适当的绘制和触屏缩放,需要在网页的 head 之中添加
         viewport meta 标签-->
    <!--width 属性控制设备的宽度。假设您的网站将被带有不同屏幕
        分辨率的设备浏览,那么将它设置为 device-width 
        可以确保它能正确呈现在不同设备上。initial-scale=1.0 
        确保网页加载时,以 1:1 的比例呈现,不会有任何的缩放。-->
    <meta name="viewport" content="width=device-width, initial-scale=1"><!--初始化移动浏览显示-->
    <title>Bootstrap的HTML标准模板</title>
    <!-- Bootstrap -->
    <link href="~/Content/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet" />
    <!--你自己的样式文件 -->
    <!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元
        素和媒体查询,如果不需要用可以移除 -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>IE浏览器支持html5标签
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>对媒体查询进行支持
    <![endif]-->
</head>
<body>
    <h1>Hello, world!</h1>
    <button>HTML</button>
    <button class="btn btn-primary">Bootstrap</button>
    <button class="btn btn-info">Bootstrap</button>
    <div class="container"></div>
    <!-- 如果要使用Bootstrap的js插件,必须先调入jQuery -->
    <!--Bootstrap中的JS插件依赖于jQuery,因此jQuery要在Bootstrap之前引用-->
    <script src="~/Content/bootstrap-3.3.7-dist/js/jquery-2.0.3.min.js"></script>
    <script src="~/Content/bootstrap-3.3.7-dist/js/jquery-1.11.3.min.js"></script>
    <script src="~/Content/bootstrap-3.3.7-dist/js/jquery-1.11.2.min.js"></script>
    <!-- 包括所有bootstrap的js插件或者可以根据需要使用的js插件调用 -->
    <script src="~/Content/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</body>
</html>

 

2016-06-17 21:50:32 zhanyouwen 阅读数 1514

bootstrap是目前很流行的一个前端框架,它兼容性好,同时兼容pc端和移动端,本文主要讲解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">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <title>Bootstrap 101 Template</title>
	<!--一般将css放在head尾标签处-->
    <!-- Bootstrap css-->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!-- 如果浏览器低于IE9,就导入下面两个js,用来展示更好的效果
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    -->
  </head>
  <body>
    <h1>HelloWorld!</h1>
	<!--一般将js放在body尾标签处-->
    <!-- jQuery 依赖库 -->
    <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <!-- bootstrap库 -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>


2019-05-10 15:36:45 qq_42894622 阅读数 20
<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap 模板</title>
      <meta charset="utf-8" />
      <!--声明响应式开发--><!--支持移动端设备渲染,支持媒体查询-->
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <!--使用最高系统中最高版本的IE内核渲染-->
	  <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <!-- 引入 Bootstrap -->
      <link href="css/bootstrap.min.css" rel="stylesheet">		
      <!-- 兼容IE6-8-->
	  <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	  <![endif]-->
   </head>
   <body>
      <h1>Hello, world!</h1>
      <!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
      <script src="js/jquery.min.js"></script>
      <!-- 包括所有已编译的插件 -->
      <script src="js/bootstrap.js"></script>
   </body>
</html>

2015-11-08 19:41:45 sinat_27169251 阅读数 1296

1. Blocks

block
Blocks is a light-weight, admin dashboard template inspired by Cyfe. Blocks is essentially, a single page theme.. all you need, configured, ordered and placed in one page.

2. FirmaSite Bootstrap

firmasite
A free Bootstrap wordpress theme by FirmaSite. This is a 2 column layout that works well for a blog or article list next to a multi-purpose sidebar.

3. Pratt

pratt
Pratt is another simple, clean template from BlackTie. Pratt makes a quick simple landing page for your new startup or app. Really easy to use and modify. It works well for a Coming Soon Page.

4. Landy

landy
A flexible one-page fully responsive HTML template for your app.

5. mPurpose

mPurpose-template
mPurpose is a responsive, clean HTML/CSS template. It contains a huge variety of components and more that 30 sample pages so could be used for almost any type of website.

6. Holy Fire Church

holy-fire-church-psd-theme
Modern flat style Church theme. Based on the wide 1170px grid system. Using large bold photographs to engage the user.

7. Quick Site Responsive Template

quicksite
Quicksite is a clean, beautiful & multipurpose HTML5 template for startup, corporate, portfolio or personal websites. Built using Twitter Bootstrap 3.0, it has a fluid, flexible & responsive design that works great on all devices and resolutions.

8. Bootstrap Landing Page with Login and Signup

bootstrap landing page with login and signup
The bootstrap landing theme is one page responsive theme, comes with fixed header in top, contact page in bottom, 2 column about us and service page and many more.

9. Colorful Flat

colorfulflat
Use this landing page to showcase your colorful product or portfolio to your customers.

10. Evento

evento
Evento is a Onepage music event html template powered by twitter bootstrap 3. This free responsive template has event countdown, fullscreen slider, google map, ajax contact form and sticky menu.

11. Magister

magister-large
Magister is a free, responsive, single-page Bootstrap template by GetTemplate. Ideal choice for personal or ‘Coming soon’ landing page.

12. Xeon

xeon
Xeon is the best onepage site template available completely powered by Twitter Bootstrap 3.0 and prefect for any small business company.

13. AdminiLTE

adminlte
AdminLTE – is a fully responsive admin template. Based on Bootstrap 3 framework. Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops. Check out the live preview now and see for yourself.

14. Siimple

siimple
Siimple is a free Bootstrap template from BootstrapTaste. This above the fold content is the main key of ‘Siimple’ template. You can use it for app showcase, selling single product or capture potential customer via newsletter / sign-up form. Its a really simple template but very powerful landing page.

15. Modern Business

modern business
Modern Business is fully functional 17 page website template which can serve your business purposes.

16. Landing Page

landing page
Landing Page is a feature-rich template for showcasing your products or apps.

17. Counter

counter
Counter is a useful and beautiful template from BlackTie. Counter is a coming soon theme that uses Revolution Slider to showcase images at the background. The countdown is powered by a custom Javascript. Modify that script to set the proper date.

18. Brushed

brushed
Brushed is Free One Page Responsive HTML Template based on Twitter Bootstrap Framework. It is optimized for Retina Displays ( iPhone, iPad, iPod Touch and MacBook Pro Retina).

19. Minimal Dark

minimal dark
Minimal is a Bootstrap template from BlackTie. Minimal is a simple and small theme. Ideal for a contact page or minimal site. This theme was designed for those wanting something different more than the habitual information page.

20. Super Awesome

superawesome
SuperAwesome is a free, responsive, “Coming Soon” Bootstrap template. Using it, you’ll setup the very first landing page for your upcoming software or web application project in a matter of minutes!

21. Progressus

progressus
Progressus is a free, responsive, nice-looking business template based on Bootstrap HTML/CSS framework. 7 ready-made templates for most common tasks, trendy, responsive design and exceptional overall quality – everything will work for you and your business.

22. Small

small
Small is a Bootstrap template from BlackTie. Small is a little theme focused in your latest dribbble shots. Thanks to the jibbble script, this theme allows you to show 8 shots on the front page. Works excellent as a vCard option.

23. Grayscale

grayscale
This template is a fully functional, premium quality Bootstrap theme. It includes the following features, easing scroll function for smooth navigation – uses jQuery easing plugin, custom built jQuery navbar that collapses on scroll with scrollspy for active class handling.

24. Flatty

flatty
Flatty is a free Bootstrap template from BlackTie that is a flat landing page designed to show your next app, site or product. With a fresh style & minimal design, you can now show your product with style.

25. Media Template

media template
This is ideal for websites which show off a lot of photos. Stock photos provided by Unsplash. This template also has a sleek block heading text that overlays the jumbotron.

26. Freelancer

freelancer
Freelancer is fully functional bootstrap template for designers.

27. Studio

sutdio
Studio is a simple one page theme, ideal for personal or agency site, comes with an elegant and minimal design. Uses Font Awesome 4.0.3, parallax effect, off-canvas menu & other handsome features.

28. Onassis

onassis
A one page theme ideal for agencies or freelancers. Beautifully crafted and with notable features like an off-canvas menu.

29. Shield

shield
Shield is yet another beautiful template by Carlos at BlackTie. Shield is an one page theme, ideal for agencies and freelancers. Elegant and with a fresh style. Uses the beautiful icomoon fonts.

30. Marco

marko
Marco is a stylish one page theme. Ideal for freelancers or agencies willing to show their work. Uses FontAwesome 4.0.3 & Animation.css.

bootstrap 基本模板

阅读数 494

bootstrap的基本模板

博文 来自: cFarmerReally

Bootstrap的完整模板

阅读数 153

&lt;!DOCTYPEhtml&gt;&lt;htmllang="zh-CN"&gt; &lt;head&gt; &lt;metacharset="utf-8"&gt; &lt;!--声明文档兼容模式,表示使用IE浏览器的最新模式--&gt; &lt;metahttp-equiv="X-UA-Compatible"content=

博文 来自: qq_33243148

bootstrap 后端模板

阅读数 1252

   作为一个后端出身的伪前端,常常因为切图太慢,切图质量太低而影响工作效率和工作质量,经过不断的摸索终于找到一些比较好用的bootstrap后端框架大大提高了工作效率,望您也有有一套熟悉的bootstrap后端模版来提高您的开发速度这是本人经常使用到的一些bootstrap后台框架推荐给大家第一名inspiniabootstrap 演示地址 http://cn.in...

博文 来自: qq_41096015

BootStrap引入模板

阅读数 3

目录结构:image.png<!DOCTYPEhtml><html><head><metacharset="utf-8"/><matename="viewport"content="device-width,initial-s...

博文 来自: weixin_34068198

bootstrap的web前端模板

阅读数 1634

首页//解决IE9不支持Html5问题 支持Html5,css3,bootstrap标准的头部

博文 来自: u011466175
没有更多推荐了,返回首页