En el ejemplo HTML anterior, nos apresuramos un poco para evitar perdernos en demasiada charla.<\/p>\n
Este fue el HTML que escribimos:<\/p>\n
<p>Un p\u00e1rrafo de texto<\/p>\r\n\r\n<ul>\r\n\u00a0 <li>Primer elemento<\/li>\r\n\u00a0 <li>Segundo elemento<\/li>\r\n\u00a0 <li>Tercer elemento<\/li>\r\n<\/ul>\r\n<\/pre>\n<\/p>\n
Quiero darte resultados r\u00e1pido y de forma r\u00e1pida, \u00a1y ponerte en movimiento lo antes posible! \u00a1Ahora tienes una p\u00e1gina HTML que puedes ver!<\/p>\n
Pero ese archivo HTML que guardamos realmente no ten\u00eda todos los elementos que necesita un archivo HTML adecuado.<\/p>\n
\u00bfQu\u00e9 quiero decir con eso?<\/p>\n
Aqu\u00ed hay una versi\u00f3n m\u00e1s correcta de eso:<\/p>\n
<!DOCTYPE html>\r\n<html>\r\n\u00a0 <head>\r\n\r\n\u00a0 <\/head>\r\n\u00a0 <body>\r\n\u00a0 \u00a0 <p>Un p\u00e1rrafo de texto<\/p>\r\n\r\n\u00a0 \u00a0 <ul>\r\n\u00a0 \u00a0 \u00a0 <li>Primer elemento<\/li>\r\n\u00a0 \u00a0 \u00a0 <li>Segundo elemento<\/li>\r\n\u00a0 \u00a0 \u00a0 <li>Tercer elemento<\/li>\r\n\u00a0 \u00a0 <\/ul>\r\n\u00a0 <\/body>\r\n<\/html><\/pre>\nLos elementos que ten\u00edamos antes est\u00e1n envueltos en la etiqueta body.<\/p>\n
Esa, junto con head (en este ejemplo vac\u00edo), est\u00e1 contenida en la etiqueta html, que es la etiqueta ra\u00edz.<\/p>\n
body contiene los elementos visibles de la p\u00e1gina.<\/p>\n
head se utiliza para contener informaci\u00f3n especial sobre el contenido y m\u00e1s, como veremos m\u00e1s adelante.<\/p>\n
En un documento, podemos tener solo una apariencia de html, body y head.<\/p>\n
Finalmente, en la parte superior tenemos el doctype: <!DOCTYPE html>. Esto le dice al navegador \u00abeste es un archivo HTML\u00bb.<\/p>\n
Observa que us\u00e9 una sangr\u00eda de 2 caracteres para las etiquetas anidadas.<\/p>\n
Las etiquetas anidadas deben sangrarse.<\/p>\n
En el ejemplo, la etiqueta ul contiene las etiquetas li, por lo que las etiquetas li est\u00e1n anidadas.<\/p>\n
Utiliza 2 o 4 caracteres, o el car\u00e1cter de tabulaci\u00f3n para sangrar esos elementos anidados, seg\u00fan tu preferencia, pero mant\u00e9n una \u00abestructura de \u00e1rbol\u00bb. Esto har\u00e1 que sea mucho m\u00e1s f\u00e1cil analizar visualmente un archivo HTML.<\/p>\n","protected":false},"excerpt":{"rendered":"
En el ejemplo HTML anterior, nos apresuramos un poco para evitar perdernos en demasiada charla.…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[178,180],"tags":[],"_links":{"self":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/1418"}],"collection":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/comments?post=1418"}],"version-history":[{"count":1,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/1418\/revisions"}],"predecessor-version":[{"id":1419,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/1418\/revisions\/1419"}],"wp:attachment":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/media?parent=1418"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/categories?post=1418"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/tags?post=1418"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}