Después de de esta prolongada selección de información dimos con la solución esta pregunta que pueden tener algunos los lectores. Te dejamos la solución y nuestro objetivo es serte de mucha apoyo.
Ejemplo 1: barra de navegación de línea vertical
/*navbar properties */
.navbar .brand
max-height: 40px;
overflow: visible;
padding-top: 0;
padding-bottom: 0;
.navbar a.navbar-brand
padding: 9px 15px 8px;
.navbar
font-family: young;
clear: both;
.navbar a
color: #515254;
.navbar-nav
font-size: 20px;
padding-top: 20px;
#bs-example-navbar-collapse-1
float: left;
.nav > li > a:hover, .nav > li > a:focus
color: #007f3d;
background: none;
.navbar-toggle .icon-bar
background-color: black;
.navbar-toggle
border: 1px solid #000;
.verticalLine
border-left: thick solid #ff0000;
hr.vertical
color: black;
width: 0px;
height: 100%; /* or height in PX */
/*navbar properties */Ejemplo 2: barra de navegación de línea vertical
DOCTYPEHTML><html><head><metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/><metaname="viewport"content="width=device-width, initial-scale=1, maximum-scale=1"><title>Double Doubletitle><linkrel="shortcut icon"href="favicon.ico"><linkhref='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700%7CRoboto+Slab:400,100'rel='stylesheet'type='text/css'/><linkhref="css/font-awesome.min.css"rel="stylesheet"><linkhref="css/bootstrap.min.css"rel="stylesheet"><linkhref="css/double.css"rel="stylesheet">head><body><navclass="navbar"role="navigation"><divclass="container"><divstyle="margin: auto;display: table;"><divclass="navbar-header"><buttontype="button"class="navbar-toggle"data-toggle="collapse"data-target="#bs-example-navbar-collapse-1"><spanclass="sr-only">Toggle navigationspan><spanclass="icon-bar">span><spanclass="icon-bar">span><spanclass="icon-bar">span>button>div><divclass="collapse navbar-collapse"id="bs-example-navbar-collapse-1"><ulclass="nav navbar-nav"><li><ahref="#">Homea>li><hrclass="vertical"/><li><ahref="#">Dealsa>li><li><ahref="#">Pickup Dealsa>li><li><ahref="#">Menua>li><li><ahref="#">About Usa>li><li><ahref="#">Contact Usa>li>ul>div>div>div>nav>body>html>Recuerda compartir este ensayo si te ayudó.
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)