Como utilizar HTML en Steemit

in #spanish3 years ago (edited)

Comandos de HTML

mini imagen.png

Fuente


Hola que tal Steemianos, un nuevo dia para realizar un post en ayuda a los usuarios nuevos de steemit y personas que no sepan utilizar los comandos de html implementados a sus post de Steemit.


Antes de Empezar ¿Que es HTML?

  • En resumidas cuentas HTML o HyperText Markup Language, son etiquetas las cuales tienen funciones para ordenar alguna letra, palabra o Texto encerradas en ella.

Para que funciona HTML en nuestros post

  • La función principal de utilizar HTML en nuestros post, es poder implementar ordenes en nuestros textos, por ende significa que tendremos un orden visual y un desarrollo mas completo de lectura para tus seguidores y lectores.

¿Donde puedo utilizar HTML?

  • Para poder utilizar etiquetas de HTML en nuestros post, debemos primero que todo activar la función de Markdown.

Si no sabes activar la pestaña de MarkDown, te dejo aquí un link el cual te ayudará a activarla de manera sencilla.
Link de Activacion MarkDown


Empecemos

  • En el siguiente Post veremos algunas etiquetas de HTML, las cuales nos ayudarán a ordenar nuestro post y así lograr conseguir mayor cantidad de usuarios. Este tipo de etiquetas son muy sencillas de utilizar, por lo tanto sera muy sencillo comprenderlas, no necesitas ser experto en informatica ni nada por el estilo.

Etiquetas que veremos.

  • Etiqueta de Separacion Br
  • Etiqueta de Linea Hr
  • Etiqueta de Justificar Texto
  • Etiqueta de cita o blockquote
  • Etiqueta Strike o tachadora de texto

Principios de Etiquetas HTML

  • Como les mencione anteriormente, las etiquetas HTML son ordenes que se entregan a letras, palabras o textos, por ende necesitan tener esos textos encerrados en dichas etiquetas y esas etiquetas funcionan de la siguiente manera:

Una etiqueta HTML se compone de 3 simples pasos.

  • Primero se compone de <> Diples o comillas, las cuales encierran una palabra.
  • Segundo viene la palabra que va dentro, por ejemplo strike, center, etc...
  • Tercero agregar cierre de comillas, con /.

Ejemplo

<strike></strike>

  • Como pueden ver notamos una Etiqueta de entrada que es la <strike>, esta etiqueta siempre va al inicio del texto, al cual le quieren dar una orden, luego en la mitad entre cada strike como el ejemplo a continuacion <strike>AQUI</strike> va la letra, palabra o parrafo en ella y para terminar, tiene un cierre de comillas escrito con la misma palabra de la orden de la etiqueta, pero esta lleva algo diferente que es el / , Etiqueta de cierre es asi </strike>.

Etiqueta Br

  • Esta etiqueta cumple la función de separar 2 textos por un espacio, a diferencia de las demás etiquetas, esta no necesita una etiqueta de cierre, por lo tanto solo debemos agregarla y listo.

Código

Espacio
<br>
Espacio
Espacio

Resultado

Espacio


Espacio
Espacio

Comparación


Con Etiqueta br

Espacio


Espacio
Espacio

Sin Etiqueta br

Espacio
Espacio
Espacio

Etiqueta Hr

  • La etiqueta hr es una etiqueta que se utiliza para poder crear una línea de separación entre cada párrafo. Esta etiqueta tampoco depende de un cierre de comillas, por lo tanto funciona al igual que la anterior.

Código

Linea

<hr>

Linea

Resultado

Línea


Línea

Comparación


Con Etiqueta hr

Linea


Linea

Sin Etiqueta hr

Linea
Linea


Etiqueta Justificar Texto

  • La etiqueta Justificar Texto es una un poco más completa por ende recomiendo mantenerla en un block de notas para poder copiar siempre la etiqueta, ya que no siempre uno recuerda el texto completo. Esta etiqueta si tiene un cierre por lo tanto siempre encerrar el texto que se le ordenara Justificar en ella.

Código

<div class="text-justify">Este texto funcionara como un ejemplo, este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo.</div>

Resultado

Este texto funcionara como un ejemplo, este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo.

Comparación


Con Etiqueta Justificar Texto

Este texto funcionara como un ejemplo, este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo.

Sin Etiqueta Justificar Texto

Este texto funcionara como un ejemplo, este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo,este texto funcionara como un ejemplo.


Etiqueta Cita o blockquote

  • Esta etiqueta cumple la función de cita para una palabra clave, frase o un pequeño subtítulo. Tambien tiene otra forma de utilizar que es Markdown y esta funciona de la siguiente manera. Esta etiqueta si lleva cierre.

Código

Opción 1
<blockquote>Ejemplo de citacion</blockquote>

Opción 2
>Ejemplo de Citación

Resultado

Ejemplo de citación

Comparación


Con Etiqueta Citacion

Ejemplo de Citación


Sin Etiqueta Citacion

Ejemplo de Citación


Etiqueta Strike o Tachado

  • La etiqueta Strike es una etiqueta que tachara tu letra, palabra o texto. Si lleva cierre de etiqueta.

Código

Opción 1
<strike>Ejemplo</strike>

Resultado

Ejemplo

Comparación


Con Etiqueta Strike

Ejemplo


Sin Etiqueta Strike

Ejemplo


Espero que les sirvan de ayuda, algunas de las etiquetas de HTML, las cuales pueden complementar con sus post y así lograr tener una mejor visual en el. Subire un siguiente post en el cual lo llamaré "Como utilizar HTML en Steemit parte 2" en el subire mas etiquetas de HTML, ya que las nombradas anteriormente no son todas. Les agradeceria mucho un Upvote, Resteem o comentario. Seguire subiendo contenido, Saludos soy @makemoneynow.

ANALIZANDO, PENSANDO Y ACTUANDO, SE PUEDE LOGRAR UN MEJOR RENDIMIENTO.

mini imagen 2.png

Sort:  

Este Post ha recibido un Upvote desde la cuenta del King: @dineroconopcion, El cual es un Grupo de Soporte mantenido por 5 personas mas que quieren ayudarte a llegar hacer un Top Autor En Steemit sin tener que invertir en Steem Power. Te Gustaria Ser Parte De Este Projecto?

This Post has been Upvote from the King's Account: @dineroconopcion, It's a Support Group by 5 other people that want to help you be a Top Steemit Author without having to invest into Steem Power. Would You Like To Be Part of this Project?

Excelente publicación, es de gran ayuda para los nuevos.

Gracias @juan2017, seguire subiendo contenido. Saludos y gracias por comentar.

Muy bueno tu post para nosotros los nuevos integrantes es de ayuda fabulosa para que los comentarios salgan escritos de la mejor manera sean entendibles claros y limpios en ortografía. Gracias @ makemoneynow

De nada @visabella, me gusta ver que a le gente le ayuda harto mi contenido. Saludos y gracias por comentar.

articulo para tenerlo guardado como chuleta en marcadores..

jajaja, @dafp12 gracias por comentar y hacerme reir. Saludos

no hay de que, siempre es bueno regalar sonrisa, el articulo es de utilidad.

Que no nos pillen sacando la chuleta!

Saludos

Buena información! Es necesario estos conocimientos basicos

Gracias @ivacr, seguire subiendo contenido para que estés atento. Saludos

Excelente @makemoneynow para todo nosotro que nos estamos iniciando en esta fabulosa familia de steemit, saludos.

Gracias @marcocarrasquel, ese es mi objetivo intentar ayudar a los nuevos usuarios de steemit. Saludos y gracias por comentar.

Muy practico tu post, ya lo estoy poniendo en practica para mi primer post, gracias @makemoneynow por compartir tus conocimientos. Mira esto @andres068

De nada @p3n4g05, seguire subiendo informacion de ayuda para nuevos usuarios. Saludos y gracias por comentar.

Congratulations! This post has been upvoted from the communal account, @minnowsupport, by Axl from the Minnow Support Project. It's a witness project run by aggroed, ausbitbank, teamsteem, theprophet0, someguy123, neoxian, followbtcnews, and netuoso. The goal is to help Steemit grow by supporting Minnows. Please find us at the Peace, Abundance, and Liberty Network (PALnet) Discord Channel. It's a completely public and open space to all members of the Steemit community who voluntarily choose to be there.

If you would like to delegate to the Minnow Support Project you can do so by clicking on the following links: 50SP, 100SP, 250SP, 500SP, 1000SP, 5000SP.
Be sure to leave at least 50SP undelegated on your account.

Genial este post, estoy aprendiendo a usar los comandos y aquí encontré algunos que aun no los conocía, Gracias nuevamente por aportar excelente contenido

Excelente post, muy bueno para compartir

Excelente post. Muy parecido al mio: "<HTML dilema/>". Solo te falto explicar el uso de tablas (<table/>). El cual, desde mi punto de vista, permite ordenar la información. Saludos.

un gran articulo, éxitos