Ayuda: Navbar de bootstrap

t4r0x · 6 Septiembre 2015, 02:00 AM

Buenas! veran estoy usando bootstrap y tengo este codigo:


<head>
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet"/>
    <title>prueba</title>

</head>
<body>
    <div id="wrapper">
        <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="navbar-header">
                <a class="navbar-brand" href="index.html">prueba</a>
            </div>
        </nav>
    </div>
</body>

todo bien pero ahora yo quiero aprender y saber como este navbar es creado asi que intente "aislar" el codigo CSS que este codigo utiliza pero no logro hacerlo funcionar, siempre no muestra nada, alguna ayuda?

Thryks · 6 Septiembre 2015, 14:51 PM

Para que nos entendamos, lo que has hecho es intentar crear el codigo que generan esas clases en bootstrap por tu cuenta no?

#!drvy · 7 Septiembre 2015, 17:47 PM

Aislar el código fuente de un framework como boostrap es cuanto menos, costoso. Si solo quieres el navbar te recomiendo que te lo hagas tu mismo. No es muy complicado. Un ejemplo muy básico:

Código (css) [Seleccionar]

body {
    font-size: 16px;
}

nav.navbar {
    background: #111;
    color: #f1f1f1;
    padding: 5px;
    line-height: 1.1em;
    width: 100%;
}

    nav.navbar a, nav.navbar a:visited {
        color: #f1f1f1;
        text-decoration: none;
    }

    nav.navbar a:hover { text-decoration: underline; }

    nav.navbar-fixed-top {
        position: fixed;
        top: 0;
        left: 0;
    }

Saludos

str_null · 8 Septiembre 2015, 02:33 AM

Bootstrap funciona por clases. Si quieres aislar un componente busca las clases que utiliza ese componente y revísalas. Bootstrap está precisamente para eso, es muy común aislar y quitar componentes que no se utilicen. Si quieres trabajar con una copia limpia de bootstrap utiliza otro fichero y renombra las clases que te convengan y si algún atributo te da problemas utiliza !important.

Puedes hacer eso durante el desarrollo y luego las remplazas en la copia de bootstrap que utilices.

Edito: Se me olvidaba. Siempre puedes hacerte tu copia personalizada de bootstrap en su página web te permite seleccionar lo que quieres utilizar.

Salud

Test Foro de elhacker.net SMF 2.1

Ayuda: Navbar de bootstrap

t4r0x

Thryks

#!drvy

str_null