Foros del Web » Creando para Internet » Diseño web »

Menú responsive desplegable para blogger: descifrando de una plantilla

Estas en el tema de Menú responsive desplegable para blogger: descifrando de una plantilla en el foro de Diseño web en Foros del Web. ¡Hola! Ayer me descargué una plantilla de blogger tras estar un poco harta de no encontrar ningún tutorial que enseñara a modificar el HTML para ...
  #1 (permalink)  
Antiguo 12/02/2016, 10:20
 
Fecha de Ingreso: octubre-2014
Mensajes: 25
Antigüedad: 9 años, 6 meses
Puntos: 0
Busqueda Menú responsive desplegable para blogger: descifrando de una plantilla

¡Hola!
Ayer me descargué una plantilla de blogger tras estar un poco harta de no encontrar ningún tutorial que enseñara a modificar el HTML para presentar los posts con Digs, estilo tumblr dónde las fotos se presentan en sus respectivos formatos (horizontal, vertical, cuadrado...) pero se van adaptando entre si. El caso es que me topé con una plantilla que me gustó mucho para mi portfolio personal, pero tengo un problema con el menú principal, que si bien existe en la demo de la plantilla, una vez lo descargas sólo encuentras el widget vacío. He intentado hacer el menú por listas, pero no sale como en la demo. Os dejo la demo para ver si me podéis ayudar...

Demo de la plantilla Blend: [URL="http://demo.mybloggerthemes.com/2015/05/blend-blogger-templates.html"]http://demo.mybloggerthemes.com/2015/05/blend-blogger-templates.html [/URL]

Creo que el código del menú es este, pero no estoy segura del todo porque hay varios códigos con el nombre "menu"...

Código:
.sb-menu { /* Apply to <ul> or <ol>. */
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.sb-menu li {
	width: 100%;
	padding: 0;
	margin: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.1); /* Will lighten any background colour you set. */
	border-bottom: 1px solid rgba(0, 0, 0, 0.1); /* Will darken any background colour you set. */
}

.sb-menu > li:first-child {

	border-top: none; /* Removes top border from first list item.. */
margin-top: 45px;
}

.sb-menu > li:last-child {
	border-bottom: none; /* Removed bottom border from last list item. */
}

.sb-menu li a {
	width: 100%; /* Makes links full width. */
	display: inline-block;
	padding: 1em; /* Creates an even padding the same size as your font. */
	color: #f2f2f2;
}

.sb-menu li a:hover {
	text-decoration: none;
	background-color: rgba(255, 255, 255, 0.05); /* Will lighten any background colour you set. */
}

/* Borders */
.sb-left .sb-menu li a {
	border-left: 3px solid transparent;
}

.sb-left .sb-menu li a:hover {
	border-left: 3px solid; /* Removes transparent colour, so border colour will be the same as link hover colour. */
}

.sb-right .sb-menu li a {
	border-right: 3px solid transparent;
}

.sb-right .sb-menu li a:hover {
	border-right: 3px solid; /* Removes transparent colour, so border colour will be the same as link hover colour. */
}

/* Submenus */
.sb-submenu {
	display: none;
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-color: rgba(255, 255, 255, 0.05); /* Submenu background colour. */
}

/* Caret */
span.sb-caret {
	width: 0;
	height: 0;
	display: inline-block;
	margin: 0 5px;
	border: 5px solid transparent;
}

span.sb-caret { /* Caret Down */
	border-top: 5px solid;
	border-bottom: 0px solid transparent;
}

.sb-submenu-active > span.sb-caret { /* Caret Up */
	border-top: 0px solid transparent;
	border-bottom: 5px solid;
}

Etiquetas: blogger, responsive
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:15.