Cómo editar un documento html

Por brandy alexander

Un lenguaje de mercado de hipertexto (HTML, por sus siglas en inglés) es un archivo que crea una página web. El contenido de este archivo contiene toda la información de la página, desde el texto hasta cómo está presentada la información. Aún sin estar familiarizado con HTML, puedes editar su contenido. Tienes la opción de editar las partes de la página que quieres cambiar si sabes dónde mirar en el código. Todo lo que necesitas es el editor de textos que viene con tu computadora.

Paso 1

Ejecuta el editor de textos. Haz un clic en la opción “Abrir” que se encuentra debajo del menú “Archivo” y selecciona el documento HTML.

Paso 2

Localiza la sección "" que se encuentra encima del menú “Archivo” y busca la entrada "". Cambia el texto que muestra para cambiar el título de la página web.</p><h3>Paso 3</h3> <p>Busca el código que aparece después de la etiqueta "<body>"; éste es el contenido visible de la página. Cambia el texto entre las etiquetas "<p></p>" para cambiar la información de los párrafos.</p><h3>Paso 4</h3> <p>Encuentra el código fuente para modificar el hipervínculo (enlaces) en el documento HTML (por ejemplo, "<a href="http://www.currentsite.com">Current Site</a>"). Cambia la dirección web que aparece después de "a href" para subir una página distinta a Internet cuando un usuario selecciona el enlace. Por ejemplo: "<a href="http://www.newsite.com">New Site</a>".</p><div id='teads' class="ad-center ad-margin-bottom"></div> <h3>Paso 5</h3> <p>Localiza las etiquetas de estilo, como los elementos en negrita "<b></b>", que rodean la información. Edita las letras dentro de los corchetes para cambiar la apariencia del texto. Los formatos comunes de textos incluyen subrayado "<u></u>", cursiva "<i></i>", subíndice "<sub></sub>" y superíndice "<sup></sup>". Para un ejemplo práctico, cambia "<b>Ésta es una línea de texto.</b>" por "<i>Ésta es una línea de texto.</i>" para convertir la oración de negrita a cursiva.</p><h3>Paso 6</h3> <p>Busca las etiquetas de la lista desordenada "<ul></ul>" o de la lista ordenada "<ol></ol>", y cámbialas según prefieras. Una lista desordenada presenta información en viñetas, mientras que una lista ordenada la presenta en diversos ítems numerados. Por ejemplo, cambia "<ul></ul>" por "<ol></ol>" para intercambiar las viñetas por los números.</p><h3>Paso 7</h3> <p>Haz un clic en la opción “Guardar” que se encuentra debajo del menú “Archivo” para guardar los cambios realizados.</p></div> <div class="main-ad"> <script> var ad_height; var VIEWPORT_WIDTH = document.documentElement.clientWidth || document.body.clientWidth; if (VIEWPORT_WIDTH > 500) { ad_height = '455px'; } else { ad_height = '555px'; } </script> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins id="ggads" class="adsbygoogle" style="display:inline-block;min-width:320px;max-width:1200px;width:100%;" data-ad-client="ca-pub-2494113940073314" data-ad-slot="3318309747"></ins> <script> document.getElementById('ggads').style.height = ad_height; (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div id="rcjsload_c24b2e"></div> <script type="text/javascript"> (function() { var referer="";try{if(referer=document.referrer,"undefined"==typeof referer)throw"undefined"}catch(exception){referer=document.location.href,(""==referer||"undefined"==typeof referer)&&(referer=document.URL)}referer=referer.substr(0,700); var rcel = document.createElement("script"); rcel.id = 'rc_' + Math.floor(Math.random() * 1000); rcel.type = 'text/javascript'; rcel.src = "https://trends.revcontent.com/serve.js.php?w=81422&t="+rcel.id+"&c="+(new Date()).getTime()+"&width="+(window.outerWidth || document.documentElement.clientWidth)+"&referer="+referer; rcel.async = true; var rcds = document.getElementById("rcjsload_c24b2e"); rcds.appendChild(rcel); })(); </script> <div id="references"> <h3><span>Referencias</span></h3> <ul class="colorlist"> <li><a href="http://www.w3schools.com/TAGS/tag_title.asp" target="_blank" rel="nofollow">W3Schools: HTML <title> Tag (Etiqueta HTML )</a></li> <li><a href="http://www.w3schools.com/tags/tag_body.asp" target="_blank" rel="nofollow">W3Schools: HTML <body> Tag (Etiqueta HTML)</a></li> <li><a href="http://www.w3schools.com/HTML/html_links.asp" target="_blank" rel="nofollow">W3Schools: HTML Links (Enlaces HTML)</a></li> <li><a href="http://www.w3schools.com/HTML/html_formatting.asp" target="_blank" rel="nofollow">W3Schools: HTML Text Formatting (Formato de texto HTML)</a></li> <li><a href="http://www.w3schools.com/HTML/html_lists.asp" target="_blank" rel="nofollow">W3Schools: HTML Lists (Listas de HTML)</a></li> </ul> </div> </article> </div> <div id="sidebar"> <div class="display-ad"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block;width:100%;height:190px;" data-ad-client="ca-pub-2494113940073314" data-ad-slot="9380021681" data-ad-format="link"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div><div class="desktop-ad side-ad" id='300x250_300x600_atf'> <script type='text/javascript'> var VIEWPORT_WIDTH = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; if (VIEWPORT_WIDTH > 1025) { googletag.cmd.push(function() { googletag.display('300x250_300x600_atf'); }); } </script> </div><div class="widget clearfix"> <h3>Más Artículos</h3> <ul class="sidebar-lists"><li class="clearfix"> <a href="//techlandia.com/crear-pagina-web-html-utilizando-notepad-como_17541/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/getty/article/251/59/78463455.jpg" alt="Cómo crear una página web HTML utilizando Notepad"> <span class="sidebar-article-span">Cómo crear una página web HTML utilizando Notepad</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/acceder-html-wordpress-como_260990/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/150/93/fotolia_1459017_XS.jpg" alt="Cómo acceder a HTML en WordPress"> <span class="sidebar-article-span">Cómo acceder a HTML en WordPress</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/posicionar-texto-html-como_160605/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/getty/article/34/220/80605408.jpg" alt="Cómo posicionar un texto en HTML"> <span class="sidebar-article-span">Cómo posicionar un texto en HTML</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/significan-siglas-html-sobre_499924/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/getty/article/88/166/83286948.jpg" alt="¿Qué significan las siglas HTML?"> <span class="sidebar-article-span">¿Qué significan las siglas HTML?</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/crear-cuadro-texto-programacion-html-como_44164/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/getty/article/251/78/87539451.jpg" alt="Cómo crear un cuadro de texto con la programación HTML"> <span class="sidebar-article-span">Cómo crear un cuadro de texto con la programación HTML</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/copiar-pegar-html-sitio-web-como_456270/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/photos.demandstudios.com/getty/article/41/62/89792363.jpg" alt="Cómo copiar y pegar HTML en mi sitio web"> <span class="sidebar-article-span">Cómo copiar y pegar HTML en mi sitio web</span> </a> </li> <li class="clearfix"> <a href="//techlandia.com/modificar-tamano-cuadro-texto-como_446597/"> <img class="sidebar-article-image" src="//img-aws.ehowcdn.com/200x200/cdn-write.demandstudios.com/upload//3000/300/60/5/53365.jpg" alt="Cómo modificar el tamaño de un cuadro de texto"> <span class="sidebar-article-span">Cómo modificar el tamaño de un cuadro de texto</span> </a> </li> </ul> </div> </div> </div> <footer id="footer"> <div class="footer-logos"> <a href="//techlandia.com/" rel="home"> <img src="/images/logo.svg" alt="Techlandia"> </a> <a href="https://www.leafgroup.com"> <img src="/images/leafgroup-logo-grayblue.png" alt="Leaf Group" style="width:80px; height:auto"> </a> </div> <div class="footer-text"> <div class="footer-links"> <a href="//techlandia.com/about-us">Acerca de</a> <a href="//techlandia.com/terms-of-use">Términos y Condiciones</a> <a href="//techlandia.com/privacy-policy">Política de Privacidad</a> <a href="//techlandia.com/copyright-policy">Derechos de Autor</a> </div> <div class="footer-copy"> <div id="copyright-section"><span>techlandia.com © 2001-2018 Leaf Group Ltd., all rights reserved</span></div> <!-- Ghostery Inc tag cid: 374 pid: 46 --> <a id="_bapw-link" href="#" target="_blank" style="color:#999 !important;font:11pt Arial !important;text-decoration:none !important; background-color:#1b1a1a;padding:2px;"><img id="_bapw-icon" style="border:0 !important;display:inline !important;vertical-align:middle !important;padding-right:5px !important;"/><span style="vertical-align:middle !important">AdChoices</span></a> <script type="text/javascript"> (function() { var ev = document.createElement('script'); ev.type = 'text/javascript'; ev.async = true; ev.setAttribute('data-ev-tag-pid', 46); ev.setAttribute('data-ev-tag-ocid', 374); ev.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'c.betrad.com/pub/tag.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ev, s); })(); </script> </div> </div> </footer></div> <script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script> <script> WebFont.load({ google: { families: ['PT+Sans+Narrow','Roboto'] } }); </script><script src="//techlandia.com/scripts/global.js"></script> <script src="//techlandia.com/scripts/custom.js?v=c12222bc"></script> </body> </html>