bootstrap配置

js和css文件引用:

<span style="font-size:14px;"><link href="css/bootstrap-responsive.css" rel="stylesheet"/>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="=css/font-awesome.min.css" rel="stylesheet">
    
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
     <script src="js/jquery-1.9.1.min.js"></script>
    <!-- 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"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]--></span>

导航条实例:

<span style="font-size:14px;"><nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#example-navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
        <a class="navbar-brand" href="#" name="top" style="font-size: 26px;"><strong>aa</strong></a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="navbar-collapse collapse" id="example-navbar-collapse">
          <ul class="nav navbar-nav">

            <li class=""><a href="#"><i class="icon-thumbs-up"></i> aa</li></a></li>

            <li><a href="#about"><span class=" icon-user-md"></span> aa</a></li>

            <li><a href="#contact"><span class=" icon-lightbulb"></span> aa</a></li>

            <li class="dropdown ">
	    <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-wrench"></i> aa<b class="caret"></b> </a>
              <ul class="dropdown-menu">

			<li><a href="/ychui"><i class="icon-fire"></i> aa</a></li>
			<li><a href="/tools/team/new_discuss"><i class="icon-group"></i> aa</a></li>
			<li><a href="/yuanquan"><i class="icon-circle-blank"></i> aa</a></li>
			<li class="divider"> </li>
			<li > <a href="/tools/overseas/"> <i class="icon-copy"></i> aa </a> </li>
			<li > <a href="/canvas/"> <i class="icon-edit"></i> aa </a> </li>
			<li class="divider"> </li>
			<li><a href="/zone"><i class="icon-globe"></i> aa</a></li>
			<li><a href="/huodong"><i class="icon-globe"></i> aa</a></li>
			<li class="divider"> </li>
			<li><a href="/app/download"><i class="icon-mobile-phone"></i> aa</a></li>

		</ul>
            </li>
          </ul></span>
时间: 2024-11-05 13:29:03

bootstrap配置的相关文章

项目前端 - vue配置 | axios配置 | cookies配置 | element-ui配置 | bootstrap配置

vue项目创建 环境 1.傻瓜式安装node: 官网下载:https://nodejs.org/zh-cn/ ? 2.安装cnpm: >: npm install -g cnpm --registry=https://registry.npm.taobao.org ? 3.安装vue最新脚手架: >: cnpm install -g @vue/cli ? 注:如果2.3步报错,清除缓存后重新走2.3步 >: npm cache clean --force 创建项目 ''' 1.切到项目文

ssm整合总结(二)--第二步之整合sping,sping mvc,bootstrap

说明:本文内容来自山硅谷,整合了任务5--任务8的内容http://www.gulixueyuan.com/my/course/50 本文是继https://www.cnblogs.com/alpsong/p/10059698.html的基础上来加入sping,spring mvc,bootstrap配置 1引入Bootstrap 1.1进入bootstrap官网         1.2使用bootstrap                   1.2.1helloworld          

Nancy FormsAuthentication使用

1.新建UserDatabase类,实现IUserMapper接口 using System; using System.Collections.Generic; using System.Linq; using System.Security.Claims; using System.Security.Principal; using Nancy.Authentication.Forms; public class UserDatabase : IUserMapper { private st

php大力力 [043节] 兄弟连高洛峰 PHP教程 2015年[最新最新最新最新最新]

兄弟连高洛峰老师新版PHP视频教程列表[每日更新] http://bbs.lampbrother.net/read-htm-tid-160506.html HTML部分1.[2015]兄弟连高洛峰 HTML视频教程 1 HTML的设计与应用[已发布,点击下载]2.[2015]兄弟连高洛峰 HTML视频教程 2 HTML基本语法(上)[已发布,点击下载]3.[2015]兄弟连高洛峰 HTML视频教程 3 HTML基本语法(下)[已发布,点击下载]4.[2015]兄弟连高洛峰 HTML视频教程 4

yii2之log组件学习

1.配置阶段 1)log组件放入bootstrap配置中,用于初始化启动 2)components中配置log的日志消费处理类 2.启动逻辑 1)yii框架实例化组件log,coreComponents方法默认指定log对应yii\log\Dispatcher类 2)Dispatcher类实例化,__construct方法根据配置设置静态常量logger,然后调用父类的__construct方法(即Object的)将参数设置为实例的属性,如果配置没有配置logger,则设置成默认的yii\log

Netty 使用

最近研究Android Socket通讯,遇到Socket write timeout写超时现象,具体是: OutputStream outStream = mSocket.getOutputStream(); outStream.write(data); //卡在这一行: outStream.flush(); 查了很多资料,大概清楚一些,flush()方法作用是“Flushes this output stream and forces any buffered output bytes to

Netty源码解读(一)概述

Netty和Mina是Java世界非常知名的通讯框架.它们都出自同一个作者,Mina诞生略早,属于Apache基金会,而Netty开始在Jboss名下,后来出来自立门户netty.io.关于Mina已有@FrankHui的Mina系列文章,我正好最近也要做一些网络方面的开发,就研究一下Netty的源码,顺便分享出来了. Netty目前有两个分支:4.x和3.x.4.0分支重写了很多东西,并对项目进行了分包,规模比较庞大,入手会困难一些,而3.x版本则已经被广泛使用.本系列文章针对netty 3.

【转】Netty那点事(一)概述

[原文https://github.com/code4craft/netty-learning/blob/master/posts/ch1-overview.md#%E5%90%88%E5%BC%80%E5%90%AFnetty%E6%BA%90%E7%A0%81%E4%B9%8B%E9%97%A8] 起:Netty是什么 大概用Netty的,无论新手还是老手,都知道它是一个“网络通讯框架”.所谓框架,基本上都是一个作用:基于底层API,提供更便捷的编程模型.那么"通讯框架"到底做了什

js消息提示框插件-----toastr用法

(本文系转载) 因为个人项目中有一个提交表单成功弹出框的需求,从网上找了一些资料,发现toastr这个插件的样式还是不错的.所以也给大家推荐下,但是网上的使用资料不是很详细,所以整理了一下,希望能给大家带来帮助. toastr 官网http://codeseven.github.io/toastr/ 这个样式插件支持直接导cdn入链接,但是我尝试了一下cdn加载速度太慢,所以推荐直接下载文件后导入文件 个人演示地址,因为把js放在了头部所以加载时间可能有点长,而且我发现自己的服务器不是很稳定,所