Bootstrap 学习笔记3 输入框和导航组件

时间:2022-09-11 18:40:02

Bootstrap 学习笔记3 输入框和导航组件

Bootstrap 学习笔记3 输入框和导航组件

Bootstrap 学习笔记3 输入框和导航组件

导航组件:

Bootstrap 学习笔记3 输入框和导航组件

Bootstrap 学习笔记3 输入框和导航组件

Bootstrap 学习笔记3 输入框和导航组件

导航条组件:

Bootstrap 学习笔记3 输入框和导航组件

  导航条代码:

<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a href="#" class="navbar-brand">标题</a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="#">首页</a></li>
<li class="disabled"><a href="#">资讯</a></li>
<li><a href="#">产品</a></li>
<li><a href="#">关于</a></li>
</ul>
<form action="#" class="navbar-form navbar-right">
<div class="input-group">
<input type="text" class="form-control">
<div class="input-group-btn">
<button class="btn btn-default">提交</button>
</div>
</div>
</form>
<button class="btn btn-default navbar-btn navbar-left">asdasd</button>
<p class="navbar-text">我是一个文本</p>
</div>
</nav>

Bootstrap 学习笔记3 输入框和导航组件

Bootstrap 学习笔记3 输入框和导航组件的更多相关文章

  1. Bootstrap学习笔记(4)--导航栏

    相关类: nav, nav-pills, nav-tags, nav-stacked ul里使用,导航格胶囊,方片外观,堆叠外观 navbar, navbar-header, navbar-brand ...

  2. Bootstrap学习笔记(6)--导航居中

    说明:没找到好办法 <div class="row"> <ul class="nav nav-pills col-md-offset-4"&g ...

  3. 第二百三十八节,Bootstrap输入框和导航组件

    Bootstrap输入框和导航组件 学习要点: 1.输入框组件 2.导航组件 3.导航条组件 本节课我们主要学习一下Bootstrap的两个个组件功能:输入框组件和导航导航条组件. 一.输入框组件 文 ...

  4. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http&colon;&sol;&sol;www&period;imooc&period;com&sol;code&sol;3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  5. bootstrap学习笔记之基础导航条 http&colon;&sol;&sol;www&period;imooc&period;com&sol;code&sol;3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  6. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  7. Bootstrap学习笔记&lpar;二&rpar; 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  8. Windows phone 8 学习笔记&lpar;8&rpar; 定位地图导航

    原文:Windows phone 8 学习笔记(8) 定位地图导航 Windows phone 8 已经不使用自家的bing地图,新地图控件可以指定制图模式.视图等.bing地图的定位误差比较大,在模 ...

  9. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

随机推荐

  1. CocoStudio基础教程&lpar;4&rpar;骨骼动画的动态换肤

    1.概述 游戏中人物的状态会发生改变,而这种改变通常要通过局部的变化来表现出来.比如获得一件装备后人物形象的改变,或者战斗中武器.防具的损坏等.这些变化的实现就要通过动态换肤来实现. 2.运行到程序 ...

  2. shell中cut用法

    cut是一个选取命令,就是将一段数据经过分析,取出我们想要的.一般来说,选取信息通常是针对“行”来进行分析的,并不是整篇信息分析的. (1)其语法格式为:cut  [-bn] [file] 或 cut ...

  3. background-clip

    background-clip 用来将背景图片做适当的裁剪以适应实际需要. 语法: background-clip : border-box | padding-box | content-box | ...

  4. 局域网实现 yum

    1 安装squid代理 ##### . 安装squid yum -y remove squid yum -y install squid ##### . 修改配置文件 vi /etc/squid/sq ...

  5. Sql存储过程解密方法

    在网上查到这样一个存储过程解密的方法,用起来简单,收藏到这里: )) AS ------------------------sql2000大于40000的----------------- --原作: ...

  6. 锁机制与原子操作 &lt&semi;第四篇&gt&semi;

    一.线程同步中的一些概念 1.1临界区(共享区)的概念 在多线程的环境中,可能需要共同使用一些公共资源,这些资源可能是变量,方法逻辑段等等,这些被多个线程共用的区域统称为临界区(共享区),临界区的资源 ...

  7. 《高性能Javascript》读书笔记-3

    第三章 DOM编程 把dom和js 各自想象为一个岛,他们之间用收费的桥梁链接,每次访问dom都必须途径这座桥收取过路费,访问次数多费用就高了.所有必须减少来往次数. innerHtml 与dom比较 ...

  8. Pandas日期数据处理:如何按日期筛选、显示及统计数据

    前言 pandas有着强大的日期数据处理功能,本期我们来了解下pandas处理日期数据的一些基本功能,主要包括以下三个方面: 按日期筛选数据 按日期显示数据 按日期统计数据 运行环境为 windows ...

  9. 《Python网络编程》学习笔记--从例子中收获的计算机网络相关知识

    从之前笔记的四个程序中(http://www.cnblogs.com/take-fetter/p/8278864.html),我们可以看出分别使用了谷歌地理编码API(对URL表示地理信息查询和如何获 ...

  10. 第一册:lesson 105&period;

    原文: Full of mistakes. Where's Sandra,Bob? I want her. Do you want to speak to her? Yes I do. I want ...