GUÍA DE STEEMIT // Códigos y ayuda en HTML

5.png

divisor.png

Últimamente me ha sorprendido la cantidad de personas que me han preguntado que códigos uso para hacer mis post tan lindos y ordenados, los dejo aquí para ayudar a la comunidad y apoyar a los nuevos Steemians que se nos unen. También estoy haciendo un documento de Google en INGLÉS y en ESPAÑOL para que todos puedan tenerlo en cualquier momento que lo necesiten y los dejaré al final de cada post que haga de manera que sea fácil y rápido de encontrar.

Como ya todos saben qué es HTML y Markdown, solo estoy dejando los códigos sin más párrafos que leer que les quiten tiempo. Si tiene alguna duda o pregunta no duden en comentar o contactarme si lo necesitan.

divisor.png

Espacio entre párrafos

Un simple numeral con espaciado arriba y abajo.

#

divisor.png

Para organizar el texto con diferentes puntos

Un guión con espacio luego de el.

Ejemplo: (guión espacio frase) -Lista de cosas para hacer en 2018

Se verá así:

  • Lista de cosas para hacer en 2018

divisor.png

Para justificar texto

<div class="text-justify">Párrafo Aquí</div>

Y se verá como mis textos al principio súper lindos y fáciles de leer, sin espacio en las terminaciones de cada línea que podrían hacer que el párrafo se vea un poco raro.

divisor.png

Para centrar

<p><center>Lo que quieres centrar</center></p>

Se verá así

divisor.png

Para crear citas

> El símbolo que ven de "mayor que" y la frase que deseen usar seguida de él.

Se verá asi de lindo y profesional

divisor.png

Para crear hipervinculos

Ejemplo: [El nombre del Vínculo](El link)

[Jokossita’s Blog](https://steemit.com/jokossita)

Jokossita’s Blog

divisor.png

Para escribir en negrita

Se colocan 2 guiones bajos o asteriscos al inicio y al final de la frase o palabra a resaltar.

Ejemplo: **Negrita** __Negrita__

Lo cual se vería: Negrita en ambos casos

divisor.png

Para escribir en cursiva

Igual que negrita pero se utilizaría solo un asterisco o guión bajo.

Ejemplo: *Cursiva* _Cursiva_

Sería: Cursiva en ambos casos

divisor.png

Para escribir en negrita cursiva

Igual que en negrita, pero en lugar de utilizar dos asteriscos o guiones bajos 3.

Ejemplo: ***negrita cursiva*** ___negrita cursiva___

El resultado: negrita cursiva

divisor.png

Escribir en tachado

Igual que los otros, pero solo dos cosas de estas: ~ serían usadas.

Ejemplo: ~~tachado~~

Sería asi: tachado

divisor.png

Para escribir en barras

Pude hacer todas esas barras grises usando simples tildes: ` 3 veces cada lado

Ejemplo: ```Hola a todos```

Se vería asi: Hola a todos

divisor.png

Para escribir en un bloque y hacer una lista

| Post | Día |
| --------|---------|
| Viaje | Enero 1 |
| Comida | Enero 5 |

Es bastante fácil y se ve realmente fantástico así:

PostDía
ViajeEnero 1
ComidaEnero 5

Puedes hacer más celdas y volverte loco con el código solo necesitas algo de imaginación.

divisor.png

El texto puede estructurarse con encabezados:

Colocas un numeral o varios, un espacio y luego tu texto.

H1 En cada uno puedes usar un # numeral

H2 o ## dos en este y de esta manera voy

H3 usando más numerales ###

H4 haciendo subtitulos####

H6 también puedes usar hasta 6 numerales para hacerlo aún más pequeño

divisor.png

Imágenes

Para colocar la imagen a la derecha

<div class="text-justify"><div class="pull-right">La imagen</div>

Para colocar la imagen a la izquierda

<div class="text-justify"><div class="pull-left">La imagen</div>

divisor.png

Para que tu texto sea aún más bonito

Para colocar su texto a la derecha:

Ejemplo: <div class="text-right">Tu texto aquí</div>

Y taraaan mi texto está a la derecha.

Si desea el texto a la izquierda simplemente cambie la palabra "right" a "left"

Para hacer dos columnas de texto:

<div class="pull-left">Texto de la primera columna</div>
<div class="pull-right">Texto de la segunda columna</div>

Texto de la primera columna Podemos poner imágenes aquí también si queremos, pero puedo decir que esta es una linda manera de escribir en dos idiomas al mismo tiempo.
El texto de la segunda columna iría aquí, para que podamos ver cómo se organiza fácilmente y ambas columnas hacen una linda publicación.

divisor.png

Si tienes más y quieres compartir códigos, avísame, de esta forma todos podemos ayudarnos a mejorar.

divisor.png

If you are new in steemit you can use my guides of HTML

AYUDAS EN HTML PARA STEEMIT

STEEMIT CODES HTML HELP

If you join Steem Follower Let me know in the comments to help each other.

You can read my lastest posts:

STEEMIT GUIDE // CODES HTML HELP

Happy New Year !!! Real life stories.

DAY 2 !! Almost crazy!! Seven day Dtube challenge

H2
H3
H4
3 columns
2 columns
1 column
95 Comments
Ecency