If you wanna read this content in English, click here.
[PT]
Mais um tutorial e, dessa vez, vamos falar sobre como formatar os textos aqui na Hive! Preparamos um manual detalhado que vai te guiar pelo mundo da formatação HTML. Aprenda a utilizar as principais tags e atributos para criar textos mais atraentes, organizar ideias e estruturar seu conteúdo de forma mais profissional.
Formatação básica de texto
- Negrito: Use o comando < strong > para destacar palavras ou frases. Exemplo: Este é um texto em negrito.
- Itálico: < em > para texto em itálico. Exemplo: Este texto está em itálico.
- Sublinhado: < u > sublinha o texto. Exemplo: Este texto está sublinhado.
- Tachado: < s > risca o texto. Exemplo: Este texto está tachado.
- Parágrafos: < p > define um parágrafo de texto. Exemplo:
Este é um parágrafo de texto.
Ah, lembre-se de tirar os espaços entre a tag de abertura dos exemplos e, ao final, sempre colocar uma / para tag de fechamento, por exemplo < /tag >.
Estrutura de títulos e subtítulos
- Títulos e subtítulos: < h1 > até < h6 > definem os níveis de títulos. Exemplo:
Título h1
Subtítulo h2
Subtítulo h3
Subtítulo h4
Subtítulo h5
Subtítulo h6
Listas ordenadas e não ordenadas
- Listas ordenadas: < ol type="1" > cria listas com itens numerados. Insira < li > antes de cada linha da lista e lembre-se de fechar a tag ao final de cada linha também. Exemplo:
- Item 1
- Item 2
- Item 3
- Listas não ordenadas: < ul type="disc" > cria listas com itens em bala. Insira < li > antes de cada linha da lista e lembre-se de fechar a tag ao final de cada linha também. Exemplo:
- Item 1
- Item 2
- Item 3
Formatação de links
- Links internos: < a > cria links para outras páginas do seu site. Exemplo: se você usar < a href="https://www.seudominio.com.br/pagina-de-destino" > Clique aqui < /a >, você terá 'Clique aqui'.
- Links externos: Utilize o mesmo formato, mas adicione target="_blank" para abrir o link em uma nova aba. Exemplo: < a href="https://www.google.com/" target="_blank" > Acesse o Google < /a >.
Imagens e vídeos
- Imagens: < img > insere imagens no seu post. Exemplo: < img src="https://linkdositecomaimagem" alt="Descrição da imagem" > < /img >
- Imagens que redirecionam para links: < a href="https://linkquevaiserabertoaoclicarnaimagem" >< img src="https://linkdaimagem" alt="nomedaimagem.png" >< /a >
- Vídeos: < video > insere vídeos no seu post. Exemplo: < video src="https://linkdositecomovídeo" width="640" height="360"> < /video >
Tabelas
- Criando tabelas: < table > define o início de uma tabela. Exemplo: < table > < tr > < th >Nome< /th > < th >Idade< /th > < /tr > < tr > < td >João< /td > < td >30< /td > < /tr > < tr > < td >Maria< /td > < td >25< /td > < /tr > < /table >
| Nome | Idade |
|---|---|
| João | 30 |
| Maria | 25 |
Citações e tabulações
- Citações simples: < blockquote > e < /blockquote > definem um bloco de citação. Exemplo:
"O importante não é vencer, mas ter lutado com bravura".
Nelson Mandela
- Quebras de linha: < br > insere uma quebra de linha dentro do parágrafo.
Formatação de texto
- Alinhamento central: A tag < center > centraliza o conteúdo dentro de um bloco. Exemplo:
- Alinhamento esquerdo: A tag < div class="pull-left" >Texto< /div>
alinha o conteúdo à esquerda de um bloco. Exemplo:
- Alinhamento direito: A tag < div class="pull-right" >Texto< /div> alinha o conteúdo à direita de um bloco. Exemplo:
- Subscrito: A tag < sub > formata texto como subscrito (índice inferior). Exemplo: H2O
- Superscrito: A tag < sup > formata texto como superscrito (índice superior). Exemplo: E=mc2
Dica: os alinhamentos central, esquerdo e direito também funcionam com imagens!
A comunidade @HiveBR tem um guia com todas as informações necessárias sobre a blockchain Hive e você pode conferir clicando aqui.
Capa: criada com Canva.
Another tutorial, and this time, we will talk about how to format texts here on Hive! We have prepared a detailed manual that will guide you through the world of HTML formatting. Learn to use the main tags and attributes to create more attractive texts, organize ideas, and structure your content more professionally.
Basic Text Formatting
- Bold: Use the < strong > tag to highlight words or phrases. Example: This is bold text.
- Italic: Use the < em > tag for italic text. Example: This text is in italics.
- Underlined: Use the < u > tag to underline text. Example: This text is underlined.
- Strikethrough: Use the < s > tag to strike through text. Example: This text is strikethrough.
- Paragraphs: Use the < p > tag to define a paragraph of text. Example:
This is a paragraph of text.
Remember to remove the spaces between the opening tag of the examples, and always put a / for the closing tag at the end, for example < /tag >.
Structure of Titles and Subtitles
- Titles and subtitles: Use < h1 > to < h6 > to define title levels. Example:
Title h1
Subtitle h2
Subtitle h3
Subtitle h4
Subtitle h5
Subtitle h6
Ordered and Unordered Lists
- Ordered lists: Use < ol type="1" > to create lists with numbered items. Insert < li > before each line of the list and remember to close the tag at the end of each line as well. Example:
- Item 1
- Item 2
- Item 3
- Unordered lists: Use < ul type="disc" > to create lists with bullet points. Insert < li > before each line of the list and remember to close the tag at the end of each line as well. Example:
- Item 1
- Item 2
- Item 3
Link Formatting
- Internal links: Use the < a > tag to create links to other pages on your site. Example: if you use < a href="https://www.yourdomain.com/target-page" > Click here < /a >, you will have 'Click here'.
- External links: Use the same format, but add target="_blank" to open the link in a new tab. Example: < a href="https://www.google.com/" target="_blank" > Visit Google < /a >.
Images and Videos
- Images: Use the < img > tag to insert images into your post. Example: < img src="https://sitewithimage" alt="Image description" > < /img >
- Images that redirect to links: Use < a href="https://linktoopenuponclickingimage" >< img src="https://imagelink" alt="imagename.png" >< /a >
- Videos: Use the < video > tag to insert videos into your post. Example: < video src="https://sitewithvideo" width="640" height="360"> < /video >
Tables
- Creating tables: Use the < table > tag to define the beginning of a table. Example: < table > < tr > < th >Name< /th > < th >Age< /th > < /tr > < tr > < td >John< /td > < td >30< /td > < /tr > < tr > < td >Mary< /td > < td >25< /td > < /tr > < /table >
| Name | Age |
|---|---|
| John | 30 |
| Mary | 25 |
Quotes and Line Breaks
- Simple quotes: Use the < blockquote > and < /blockquote > tags to define a quote block. Example:
"The important thing is not to win, but to have fought bravely".
Nelson Mandela
- Line breaks: Use the < br > tag to insert a line break within the paragraph.
Text Formatting
- Center alignment: Use the < center > tag to center content within a block. Example:
- Left alignment: Use the < div class="pull-left" >Text< /div> tag to align content to the left of a block. Example:
- Right alignment: Use the < div class="pull-right" >Text< /div> tag to align content to the right of a block. Example:
- Subscript: Use the < sub > tag to format text as subscript (lower index). Example: H2O
- Superscript: Use the < sup > tag to format text as superscript (upper index). Example: E=mc2
Tip: center, left, and right alignments also work with images!
The @HiveBR community has a guide with all the necessary information about Hive Blockchain, and you can check it out by clicking here.
Cover: created with Canva.