Menú jcyl.es

Junta de Castilla y León

Catálogo de componentes - Junta de Castilla y León

  • Zona privada
  • Contacto

Idiomas

Menu jcyl.es

Mi cuenta

usuario2017xxx

usuario@gmail.com

Mi cuenta

Cerrar sesión

Guía de estilos y componentesde la Junta de Castilla y León

Redes sociales

  • Facebook
  • Twitter
  • Youtube

Enlaces desde gobierno

Responsividad

Se adapta al anacho disponible ocupando el 100%.

En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.

Código

						
<div class="texto borde gobierno">
	<h2>[ENCABEZADO]</h2>
	<ul>
		<li>
			<a href="[ENLACE]">[TITULO]</a>
		</li>
		[...]
		<li class="ver-mas">
			<a href="">[ENLACE]</a>
		</li>
	</ul>
</div>
						
					

Responsividad

El componente se coloca en una fila de dos columnas a partir de 600px, por debajo de 600px se coloca en dos filas de una columna.

En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.

Código

						
<div class="fila col-2">
	<div class="texto borde gobierno">
		<h2>[ENCABEZADO]</h2>
		<ul>
			<li>
				<a href="[ENLACE]">[TÍTULO]</a>
			</li>
			[...]
			<li class="ver-mas">
				<a href="">[ENLACE]</a>
			</li>
		</ul>
	</div>
	<div class="texto borde gobierno">
		<h2>[ENCABEZADO]</h2>
		<ul>
			<li>
				<a href="[ENLACE]">[TÍTULO]</a>
			</li>
			[...]
			<li class="ver-mas">
				<a href="">[ENLACE]</a>
			</li>
		</ul>
	</div>
</div>
						
					

Responsividad

El componente se coloca en una fila de tres columnas a partir de 768px, por debajo de 768px se coloca en tres filas de una columna.

En resoluciones menores de 360px la imagen del bullet desaparece y un cuadro rojo, más pequeño, aparece en su lugar.

Código

						
<div class="fila col-3">
	<div class="texto borde gobierno">
		<h2>[ENCABEZADO]</h2>
		<ul>
			<li>
				<a href="[ENLACE]">[TÍTULO]</a>
			</li>
			[...]
			<li class="ver-mas">
				<a href="">[ENLACE]</a>
			</li>
		</ul>
	</div>
	<div class="texto borde gobierno">
		<h2>[ENCABEZADO]</h2>
		<ul>
			<li>
				<a href="[ENLACE]">[TÍTULO]</a>
			</li>
			[...]
			<li class="ver-mas">
				<a href="">[ENLACE]</a>
			</li>
		</ul>
	</div>
	<div class="texto borde gobierno">
		<h2>[ENCABEZADO]</h2>
		<ul>
			<li>
				<a href="[ENLACE]">[TÍTULO]</a>
			</li>
			[...]
			<li class="ver-mas">
				<a href="">[ENLACE]</a>
			</li>
		</ul>
	</div>
</div>
						
					
  • Ilunion WCAG 2.0 WAI - AA