Bootstrap编写导航栏和登陆框
作者:a-z 发布时间:2023-08-16 19:08:42
标签:Bootstrap,导航栏,登陆框
本文实例为大家分享了Bootstrap导航栏和登陆框的具体代码,供大家参考,有不足的地方请大家谅解,大家共同学习进步。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/bootstrap.min.css" />
<script type="text/javascript" src="js/jquery.min.js" ></script>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
</head>
<body>
<nav class="nav navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand">
<img src="img/mylogo.png" style="height: 50px;margin-top: -15px;"/>
</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">首页</a></li>
<li><a href="#">新闻</a></li>
<li><a href="#">产品</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">服务<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">客服在线</a></li>
<li class="divider"></li>
<li><a href="#">常见问答</a></li>
<li class="divider"></li>
<li><a href="#">地址电话</a></li>
</ul>
</li>
<li><a href="#">商城</a></li>
</ul>
<div class="navbar-form navbar-right">
<a href="#" class="navbar-link">登陆</a>
<a href="#" class="navbar-link">注册</a>
<input type="text" class="form-control" placeholder="请输入关键字"/>
<button class="btn btn-primary">搜索</button>
</div>
</div>
</div>
</nav>
<div style="height: 50px;"></div>
<div class="container">
<h1 class="page-header"><span class="glyphicon glyphicon-user"></span>用户登录</h1>
<form class="form-horizontal">
<div class="form-group">
<div class="col-md-5">
<input type="text" class="form-control" placeholder="用户名/email"/>
</div>
</div>
<div class="form-group">
<div class="col-md-5">
<input type="password" class="form-control" placeholder="密码"/>
</div>
</div>
<div class="form-group">
<div class="col-md-5">
<button class="btn btn-primary">登陆</button>
</div>
</div>
</form>
</div>
<div style="height: 1500px;"></div>
</body>
</html>
0
投稿
猜你喜欢
- #{}会将传入的数据当成一个字符串,会对自动传入的数据加一个双引号order by #{userId} 这里假如us
- 前言对于专业的python程序员来说,python打包工具或许用得并不多。但是对于非专业人士来说,你给他写个python项目,要让他安装py
- 最近JETBRAINS发布了目前最受欢迎的python-web开发框架,可以看到最受欢迎的还是Django和Flask,那么本文就对上榜的1
- 现在Go1.14都已经发布好些日子了,之前发的Go环境搭建教程早已过时,只是因为时间问题一直没来得及更新这次怀着愧疚的心情,在凌晨四点时,将
- 一、概念二维列表的元素还是列表(列表的嵌套),称之为二维列表。需要通过行标和列标来访问二维列表的元素二、创建二维列表1、追加一维列标来生成二
- 1、凸包检测与凸缺陷定义凸包是将最外层的点连接起来构成的凸多边形,它能包含点击中所有的点。物体的凸包检测常应用在物体识别、手势识别及边界检测
- 介绍大家好,我是小F~在数据时代,我们每个人既是数据的生产者,也是数据的使用者,然而初次获取和存储的原始数据杂乱无章、信息冗余、价值较低。要
- 支持向量机(Support Vector Machine, SVM)是一类按监督学习(supervised learning)方式对数据进行
- 本文实例讲述了python统计文本字符串里单词出现频率的方法。分享给大家供大家参考。具体实现方法如下:# word frequency in
- 效果图实现代码vue2 代码如下<!-- 横向柱状图测试结果 --><template> <div
- 本文给出了MySQL数据库中定义外键的必要性、具体的定义步骤和相关的一些基本操作,供大家参考!定义数据表假如某个电脑生产商,它的数据库中保存
- python字符串过滤性能比较5种方法比较总共比较5种方法。直接看代码:import randomimport timeimport osi
- 目录函数什么是函数/方法2.为什么需要函数1、载体2、组织3、复用4、封装5、清晰6、按需3.如何声明/调用一个函数4.函数/方法的参数1、
- 有时候我们在设计表单的时候不希望用户输入其它字符,只想他在input中输入数字,那么我们就可以使用下面的代码,当然这个比较是客户
- 摘要:本文主要是在pandas中如何对字符串进行切分。我们考虑一下下面的应用场景。这个是我们的数据集(data),可以看到,数据集中某一列(
- 广州4.18书友会主题的内容提纲自己参与撰写,同时还参与组织和主持。通过这次的深入参与,我发现胡晓同学能坚持下来多不容易,先赞下。由于天公不
- 目录1. 理解进程2. 进程的语法3. join自定义进程类4. 守护进程总结1. 理解进程进程的概念:(process)进程就是正在运行的
- “/”应用程序中的服务器错误。用户 'jb51net' 登录失败。原因: 该帐户的密码必须更改。说明: 执行当前 Web 请
- 如果查询结果很多,服务器解释你的ASP script将花费大量的时间,因为有许多的Response.Write语句要处理. 如果你将输出的全
- 一、Golang环境安装及配置Go Modulehttps://go-zero.dev/cn/docs/prepare/golang-ins