CSS - Mostrar unicamente la primera letra en el móvil

Pos: 85

Val: 8

Mostrar unicamente la primera letra en el móvil

Publicado por Hugo (1 intervención) el 05/12/2017 15:17:39

Buenas, alguien me podría ayudar con este codigo?
Lo que querría hacer si se pudiera es que en las pestañas, en la version movil saliera en vez de la palabra completa solo la primera letra, es decir en vez de Lunes, L
Ojala me podais ayudar
Mil gracias!!!
El codigo esta adjunto en el mensaje

Codigo-pagina-programacion.rar(3,3 KB)

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

-1

Responder

Pos: 9

Val: 126

Mostrar unicamente la primera letra en el móvil

Publicado por Enrique (43 intervenciones) el 05/12/2017 17:41:18

Amigo sin tus css no se puede hacer mucho, por que tener etiquetas style dentro del html no es correcto y el que pases un archivo en txt no significa que no podremos ver la pagina, si es un pagina para esa estación y no saber hacer esto, creo que te equivocaste de trabajo y ellos de al contratarte. Eso se puede solucionar con JS o jQuery. Hubieras seguido en el foro de js.

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

-1

Comentar

Pos: 2

Val: 624

Mostrar unicamente la primera letra en el móvil

Publicado por xve (490 intervenciones) el 05/12/2017 18:27:14

Hola Hugo, como dice Enrique, la manera correcta es no utilizar las etiquetas style...

Aquí te muestro una simple manera de hacerlo para que puedas aplicarlo a tu código... en el momento que la ventana del navegador es inferior a 1024 pixeles, solo deja la primera letra.

<!DOCTYPE html>

<html lang="es">

<head>

	<meta charset="utf-8">

	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

	<style>

	@media screen and (max-width:1024px) {

		.sobra {

			display:none;

	</style>

</head>

<body>

	<ul>

		<li>L<span class='sobra'>unes</span></li>

		<li>M<span class='sobra'>artes</span></li>

		<li>M<span class='sobra'>iercoles</span></li>

		<li>J<span class='sobra'>ueves</span></li>

		<li>V<span class='sobra'>iernes</span></li>

		<li>S<span class='sobra'>abado</span></li>

		<li>D<span class='sobra'>omingo</span></li>

	</ul>

</body>

</html>

Valora esta respuesta

Comentar

como instalar el plugin autoprefixer en Sublme Text 3

Color cabecera del tema de Mythemeshop