HTML - Código fuente como separar en etiquetas diferentes lineas

 
Vista:
sin imagen de perfil
Val: 2
Ha disminuido su posición en 58 puestos en HTML (en relación al último mes)
Gráfica de HTML

Código fuente como separar en etiquetas diferentes lineas

Publicado por Gustavo (1 intervención) el 27/10/2019 03:13:51
Hola Comunidad, esta es mi primera consulta. Abrazo a todos desde Argentina
estoy desorientado, y no encuentro como puedo resolver este obstaculo.

Me descargue una plantilla de una tienda en html para estudiarla, saber como esta compuesta y poder armar una página propia pero tomando lo mejor de las paginas que me gusten y que vea que son funcionales y bien hechas.

Ahora mi problema, es que cuando paso el código fuente a un EDI (Notepad++) no puedo lograr que cada etiqueta html este separada en lineas distintas.

algo asi es lo que tengo de origen

<li class="mobile-links__item" data-collapse-item><div class="mobile-links__item-title"><a href="track-order.html" class="mobile-links__item-link">Track Order</a></div></li></ul></div></li><li class="mobile-links__item" data-collapse-item><div class="mobile-links__item-title"><a href="account-login.html" class="mobile-links__item-link">Account</a> <button class="mobile-links__item-toggle" type="button" data-collapse-trigger><svg class="mobile-links__item-arrow" width="12px" height="7px"><use xlink:href="images/sprite.svg#arrow-rounded-down-12x7"></use></svg></button></div><div class="mobile-links__item-sub-links" data-collapse-content><ul class="mobile-links mobile-links--level--1"><li class="mobile-links__item" data-collapse-item><div class="mobile-links__item-title"><a href="account-login.html" class="mobile-links__item-link">Login</a></div></li><li class="mobile-links__item" data-collapse-item><div class="mobile-links__item-title">

la consulta es que recurso puedo usar para poder separar las etiquetas en diferentes lineas de código y no todo junto, asi lectura del código fuente sea más comprensiva.

Muchas gracias
Gustavo
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de joel
Val: 608
Oro
Ha aumentado 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Código fuente como separar en etiquetas diferentes lineas

Publicado por joel (154 intervenciones) el 27/10/2019 12:49:13
El formato que visualizas, es correcto para producción, es decir, cuanto menos caracteres ocupe tu pagina HTML mucho mejor.

La verdad es que la única manera de separarlo que yo conozco es manualmente!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de José Manuel
Val: 88
Bronce
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Código fuente como separar en etiquetas diferentes lineas

Publicado por José Manuel (18 intervenciones) el 28/10/2019 07:05:20
Hola Gustavo:

El proceso se puede hacer de forma automática: manipulando cadenas mediante un lenguaje de programación. Python es especialmente bueno en eso. De todas formas existen diferentes herramientas en línea que pueden hacerlo por ti. El resultado dependerá de como sea su algoritmo de bueno. Ejemplos:

https://htmlformatter.com/
https://www.freeformatter.com/html-formatter.html
https://codebeautify.org/htmlviewer/

... y muchos más. Busca prettify code html en Google.

Un saludo y espero que te sirva.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de ScriptShow
Val: 326
Plata
Ha aumentado su posición en 6 puestos en HTML (en relación al último mes)
Gráfica de HTML

Código fuente como separar en etiquetas diferentes lineas

Publicado por ScriptShow (375 intervenciones) el 02/11/2019 14:30:38
Saludos Gustavo,

contando las etiquetas y orden, un ejemplo aplicable sería:

1
<ul><li class="mobile-links__item" data-collapse-item><div class="mobile-links__item-title"><a href="track-order.html" class="mobile-links__item-link">Track Order</a></div></li></ul>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar