{"id":54,"date":"2024-05-20T15:54:54","date_gmt":"2024-05-20T13:54:54","guid":{"rendered":"https:\/\/blog.sutilweb.eu\/?page_id=54"},"modified":"2024-05-20T21:55:33","modified_gmt":"2024-05-20T19:55:33","slug":"03-sintaxis-html-primeros-pasos","status":"publish","type":"page","link":"https:\/\/sutilweb.eu\/index.php\/lenguajes\/html5\/html5-manual\/03-sintaxis-html-primeros-pasos\/","title":{"rendered":"03. Sintaxis HTML, primeros pasos"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">El lenguaje <strong>HTML<\/strong> es el lenguaje de marcado est\u00e1ndar para la creaci\u00f3n de p\u00e1ginas web.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>HTML<\/strong> significa <strong>Hyper Text Markup Language<\/strong> (<strong>lenguaje de marcado de hipertexto<\/strong>).<\/li>\n\n\n\n<li><strong>HTML<\/strong> es el lenguaje est\u00e1ndar para la creaci\u00f3n de p\u00e1ginas web.<\/li>\n\n\n\n<li><strong>HTML<\/strong> describe la estructura de una p\u00e1gina web.<\/li>\n\n\n\n<li><strong>HTML<\/strong> consiste en una serie de elementos.<\/li>\n\n\n\n<li>Los elementos <strong>HTML<\/strong> le dicen a los navegadores como mostrar el contenido.<\/li>\n\n\n\n<li>Los elementos <strong>HTML<\/strong> etiquetan partes de contenido como \u00abesto es un encabezado\u00bb, \u00abesto es un p\u00e1rrafo\u00bb, \u00abesto es un enlace\u00bb, etc.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Ejm<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;!DOCTYPE&nbsp;html&gt;\n&lt;html&gt;\n&lt;head&gt;\n&lt;title&gt;Page Title&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\n&lt;h1&gt;Mi primer encabezado&lt;\/h1&gt;\n&lt;p&gt;Mi primer p\u00e1rrafo&lt;\/p&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Ejm explicado<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Veamos la sintaxis de nuestro primer ejm.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>La declaraci\u00f3n <strong><em>&lt;!DOCTYPE html><\/em><\/strong> nos dice que se trata de un documento <strong>HTML5<\/strong>.<\/li>\n\n\n\n<li>El elemento <strong><em>&lt;html><\/em><\/strong> es el elemento ra\u00edz de una p\u00e1gina web.<\/li>\n\n\n\n<li>El elemento <strong><em>&lt;head><\/em><\/strong> contiene la meta informaci\u00f3n acerca de la p\u00e1gina web.<\/li>\n\n\n\n<li>El elemento <strong><em>&lt;body><\/em><\/strong> define el cuerpo del documento, y es el contenedor para todos los elementos visibles de la p\u00e1gina, como son encabezados, p\u00e1rrafos, im\u00e1genes, v\u00eddeos&#8230;<\/li>\n\n\n\n<li>El elemento <strong><em>h1<\/em><\/strong> define un encabezado <strong><em>h1<\/em><\/strong>.<\/li>\n\n\n\n<li>El elemento <strong><em>p<\/em><\/strong> define un p\u00e1rrafo.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Qu\u00e9 es un elemento HTML<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Un elemento HTML est\u00e1 definido por una etiqueta de inicio y una etiqueta de fin.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;etiquetainicio&gt;c\u00f3digo&lt;etiquetafin&gt;<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Navegadores web<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">El prop\u00f3sito de un <strong>navegador web<\/strong> (<strong>Chrome<\/strong>, <strong>Safari<\/strong>, <strong>Firefox<\/strong>&#8230;) es leer los documentos <strong>HTML<\/strong> y mostrar el contenido de los mismos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">El <strong>navegador<\/strong> no mostrar\u00e1 las <strong>etiquetas<\/strong>, pero las utiliza para determinar como mostrar el documento.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"748\" height=\"541\" src=\"https:\/\/blog.sutilweb.eu\/wp-content\/uploads\/2024\/05\/Estructura-HTML.png\" alt=\"\" class=\"wp-image-55\" srcset=\"https:\/\/sutilweb.eu\/wp-content\/uploads\/2024\/05\/Estructura-HTML.png 748w, https:\/\/sutilweb.eu\/wp-content\/uploads\/2024\/05\/Estructura-HTML-300x217.png 300w\" sizes=\"auto, (max-width: 748px) 100vw, 748px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>El lenguaje HTML es el lenguaje de marcado est\u00e1ndar para la creaci\u00f3n de p\u00e1ginas web. Ejm &lt;!DOCTYPE&nbsp;html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Page Title&lt;\/title&gt; &lt;\/head&gt;&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":41,"menu_order":2,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","footnotes":""},"class_list":["post-54","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Sutil Web","author_link":"https:\/\/sutilweb.eu\/index.php\/author\/sutilweb\/"},"uagb_comment_info":0,"uagb_excerpt":"El lenguaje HTML es el lenguaje de marcado est\u00e1ndar para la creaci\u00f3n de p\u00e1ginas web. Ejm &lt;!DOCTYPE&nbsp;html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Page Title&lt;\/title&gt; &lt;\/head&gt;...","_links":{"self":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/54","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/comments?post=54"}],"version-history":[{"count":1,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/54\/revisions"}],"predecessor-version":[{"id":56,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/54\/revisions\/56"}],"up":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/41"}],"wp:attachment":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/media?parent=54"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}