En el artículo anterior, le presenté la plantilla del sistema para crear un menú doblado a la izquierda (i). Para más detalles, haga clic para obtener más información.
1. Acerca del error del artículo anterior
Hay preguntas y errores planteados por varios amigos en el artículo anterior. Permítanme hablar brevemente de ellos.
1>. Es decir, soporte de versión?
Estos que escribí solo están probando Firefox Google Browse. El código se puede agregar en IE8+ para compatibilidad.
<!-[If LT IE 9]> <script src = "http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"> </script> <script src = "http://cdn.bootcss.com/expond.js/1.4.2/ corresponsh.min.js"> </script> <! [endif]->
Si desea ser compatible con el Super Browser IE6, consulte: http://www.bootcss.com/p/bsie/
2>. Uso de la insignia, gracias por los consejos para baidixing
Esto depende de los hábitos de uso de todos.
3>. Las fuentes debajo del menú secundario del código de muestra no son del mismo tamaño en Firefox y Google , gracias por señalar por Baidixing.
Como estaba depurando en Google Browsing, Chrome no admite fuentes por debajo de 12px de forma predeterminada.
2. Versión completa del menú plegable a la izquierda
Los amigos interesados pueden hacer clic para ver la demostración del efecto: http://static.demo.ruyo.net/bootstrap_left_menu.html2.html
1>. La flecha cambia a medida que el menú se expande y se fusiona
<a href = "#sistemsetting" data-toggle = "colapse"> <i> </i> gestión del sistema <span> </span> </a> <ul id = "systemyetting" style = "altura: 0px;"> <li> <a href = "#"> <i> </i> Management de usuarios </a> </li> <li> <a href = "#" <i> </i> </i> Menu Gestión </a> </li> <li> <a href = "#"> <i> </i> gestión de roles </a> </li> <li> <a href = "#"> <i> </i> Modificar contraseña </a> </li> <li> <a href = "#"> <i> </i> View de log </a> </li> </li>/*/*Menú de control Arrow*/. Nav-Header.Collapsed> span.glyphicon-chevron-toggle: antes {content: "/e114" ;}.nav-header> span.glyphicon-chevron-toggle: antes {content:"/e113 ";}2>. Seleccione el estilo en el menú secundario
.secondmenu a {font-size: 12px; color: #4a515b; text-align: center;}. Secondmenu li.active {en segundo plano: #EEE; border-color: #428bca;}Wulin.com recomienda temas relacionados con Bootstrap:
Habilidades de operación de componentes de arranque
Resumen del conocimiento relacionado con la bootstrap
Lo anterior es el conocimiento relevante sobre Bootstrap creando una plantilla del sistema (ii) en el menú plegable izquierdo introducido por el editor. Espero que sea útil para todos. Si tiene alguna pregunta, déjame un mensaje y el editor responderá a todos a tiempo. ¡Muchas gracias por su apoyo al sitio web de Wulin.com!