<Bootstrap> 学习笔记八. 导航栏和颁

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="bootstrap/css/bootstrap-theme.css">
    <script src="bootstrap/js/jquery-3.2.1.js"></script>
    <script src="bootstrap/js/bootstrap.js"></script>
    <style>

    </style>
</head>
<body>

<!--导航栏-->
<div class="form-group">
    <div class="navbar navbar-default navbar-fixed-top">
    </div>
</div>

<!--分页-->
<div class="pagination">
    <ul class="pagination">
        <li><a href="#">&laquo;</a></li>
        <li class="active"><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>
        <li><a href="#">6</a></li>
        <li><a href="#">&raquo;</a></li>
    </ul>
</div>
</body>
</html>

原文地址:https://www.cnblogs.com/ZeroHour/p/8288804.html

时间: 2024-10-04 16:56:55

<Bootstrap> 学习笔记八. 导航栏和颁的相关文章

Framework7学习笔记之导航栏与工具栏的布局类型

一:布局类型 导航栏.工具栏 有多种布局类型,他们分别有不同的表现效果,主要有:静态布局.固定布局.穿透布局. 二:静态布局(少用) 静态布局的导航栏.工具栏,是写死在页面文件中的,每个页面都有它自己的导航栏和工具栏. 原文地址:https://www.cnblogs.com/ygj0930/p/8455093.html

Framework7学习笔记之 导航栏

一:导航栏的布局 导航栏按"左 中 右"用三个div进行布局,中部宽度优先级最低,两边内容较多时会把中部用 ... 缩起来. <div class="navbar"> <div class="navbar-inner"> <div class="left">Left</div> <div class="center">Center</div&

bootstrap学习笔记&lt;八&gt;(bootstrap核心布局风格——栅格系统)

栅格系统(bootstrap的核心之一,也是bootstrap的主要布局风格) 栅格系统是对原有div布局的升级版.打破了传统div模式只能纵向垂直排列的弊端,大大提高了页面布局的速度和效果,也很好的配合响应式布局.在设备宽度不够时栅格系统会自动把所有栅格纵向排列. 栅格系统基本样式:

bootstrap学习笔记一: bootstrap初认识,hello bootstrap(下)

这一篇主要是补上源码,开始之前请先回顾:bootstrap学习笔记一: bootstrap初认识,hello bootstrap(上) 首先,我们的页面要求, lang,charset等就不用说了,老html属性, viewport是h5的属性,目的是 width=device-width 铺满设备宽度, initial-scale=1正常比较 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta c

HTML&CSS基础学习笔记11-导航栏

上文我们介绍到的<a>标签,由于<a>标签可以用来跳转,所以我们可以拿<a>标签来生成网页的导航栏. 其实在实际运用中,<a>标签就经常会被用来生成导航栏. 导航栏在HTML中有一个语义化的标签<nav>,这个标签表示带有导航性质的内容,会有自己默认的特殊样式.语义化标签我们将会在后面讲到. 我们在这里先使用下<nav>标签,和<a>组合成一个导航栏. 代码如下: <!DOCTYPE html> <htm

HTML5+Bootstrap 学习笔记 4

HTML5 <map> <area> 标签 <map> 标签定义客户端的图像映射.图像映射是带有可点击区域的图像. <area> 标签定义图像映射内部的区域(图像映射指的是带有可点击区域的图像). area 元素始终嵌套在 <map> 标签内部. 1 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" /> 2

angular学习笔记(八)

本篇介绍angular控制视图的显示和隐藏: 通过给元素添加ng-show属性或者ng-hide属性来控制视图的显示或隐藏: ng-show: 绑定的数据值为true时,显示元素,值为false时,隐藏元素 ng-hide: 绑定的数据值为true时,隐藏元素,值为false时,显示元素 (其实只要用到其中一个就可以了) 下面来看个简单的例子,点击按钮可以显示/隐藏元素: <!DOCTYPE html> <html ng-app> <head> <title>

Bootstrap学习笔记(二) 表单

在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等. 在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名"form-control",将会实现一些设计上的定制效果. 1.宽度变成了100% 2.设置了一个浅灰色(#ccc)的边框 3.具有4px的圆角 4.设置阴影效果

Linux System Programming 学习笔记(八) 文件和目录管理

1. 文件和元数据 每个文件都是通过inode引用,每个inode索引节点都具有文件系统中唯一的inode number 一个inode索引节点是存储在Linux文件系统的磁盘介质上的物理对象,也是LInux内核通过数据结构表示的实体 inode存储相关联文件的元数据 ls -i 命令获取文件的inode number /* obtaining the metadata of a file */ #include <sys/types.h> #include <sys/stat.h>