{"id":48459,"date":"2022-10-26T14:40:45","date_gmt":"2022-10-26T14:40:45","guid":{"rendered":"https:\/\/wpstaging.mailrelay.com\/glossary\/css-cascading-style-sheets\/"},"modified":"2022-10-26T14:41:19","modified_gmt":"2022-10-26T14:41:19","slug":"css-cascading-style-sheets","status":"publish","type":"glossary","link":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/","title":{"rendered":"CSS (Cascading style sheets)"},"content":{"rendered":"

<\/p>\n

¿Qué es CSS (Cascading style sheets) o hojas de estilo en cascada?<\/h2>\n

CSS es el acrónimo de Cascading style sheets, que en castellano se traduce por hojas de estilo en cascada. Desarrollado por el W3C en 1996, CSS es un mecanismo complementario al lenguaje HTML que permite indicarle al navegador el estilo con el qué debe de mostrar los distintos elementos que forman parte de la página web a visualizar.<\/p>\n

Mientras que el HTML se centra en indican al navegador que ciertas partes la pagina son títulos, subtítulos, párrafos, enlaces, etc. El CSS complementa esa información para que el tipo de fuente, tamaño, color o alineación con el que se muestre cada elemento sea el correcto.<\/p>\n

1. Para que se usa el CSS<\/h2>\n

El código CSS separa la estructura de un documento HTML de su presentación. Es decir, el HTML define la estructura básica de la página (a modo de esqueleto), y por su parte el CSS añade una capa de personalización que dota a la web de su aspecto final.<\/p>\n

De esa forma, un diseñador web puede realizar cambios en la apariencia de una web cómodamente gracias al CSS sin afectar al contenido de forma dramática, pues el contenido sería el mismo solo que la forma en la que se mostraría en pantalla sería lo que cambiase.<\/p>\n

2. Tipos de CSS<\/h2>\n

Existen tres tipos o formas de vincular el CSS a tu sitio web (HTML): externo (external), interno (internal) y en línea (inline).<\/p>\n

– CSS externo.<\/strong> Es el CSS que existe como un archivo independiente y se enlaza a un documento HTML mediante la etiqueta . Esta es la forma mas común para para añadir CSS a HTML, pues tan solo es necesario cambiar ese documento para que el sitio web completo reciba los cambios deseados.<\/p>\n

– CSS interno.<\/strong> El CSS interno es un código CSS incrustado dentro del documento HTML, ello se hace desde el elemento <style><\/code> dentro de la sección <head><\/code>. Es usado para añadir estilos a paginas individuales o secciones del sitio web.<\/p>\n

– CSS en línea o inline.<\/strong> CSS en línea se coloca dentro de una etiqueta HTML para cambiar solo el estilo de un elemento en concreto. Su uso no es muy recomendable pues en realidad no separa el estilo del contenido.<\/p>\n

3. Ventajas del CSS<\/h2>\n

Las ventajas que reporta el uso de hojas de estilo en cascada (CSS) son muchas, aquí tienes alguna de las mas destacables:<\/p>\n

    \n
  • Facilita realizar modificaciones visuales era todo un sitio desde un único lugar.<\/li>\n
  • Permite mejorar el tiempo de carga.<\/li>\n
  • Facilita la indexación de la web por parte de las arañas de indexación.<\/li>\n
  • Simplifica disponer de versiones optimizadas para distintos objetivos.<\/li>\n
  • Hace los cambios y la organización más sencilla.<\/li>\n
  • Mejora el peso de los archivos.<\/li>\n
  • Permite crear un sitio responsive.<\/li>\n
  • Hace más sencilla la creación de página web.<\/li>\n
  • Trabajar con estándares facilita realizar futuras mejoras en el sitio web.<\/li>\n<\/ul>\n

    <\/body><\/html><\/p>\n","protected":false},"template":"","class_list":["post-48459","glossary","type-glossary","status-publish","hentry"],"yoast_head":"\nCSS (Cascading style sheets) - Mailrelay<\/title>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS (Cascading style sheets) - Mailrelay\" \/>\n<meta property=\"og:description\" content=\"¿Qué es CSS (Cascading style sheets) o hojas de estilo en cascada? CSS es el acrónimo de Cascading style sheets, que en castellano se traduce por hojas de estilo en cascada. Desarrollado por el W3C en 1996, CSS es un mecanismo complementario al lenguaje HTML que permite indicarle al navegador el estilo con el qué […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/\" \/>\n<meta property=\"og:site_name\" content=\"Mailrelay\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Mailrelay\/\" \/>\n<meta property=\"article:modified_time\" content=\"2022-10-26T14:41:19+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@mailrelay\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/glossary\\\/css-cascading-style-sheets\\\/\",\"url\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/glossary\\\/css-cascading-style-sheets\\\/\",\"name\":\"CSS (Cascading style sheets) - Mailrelay\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#website\"},\"datePublished\":\"2022-10-26T14:40:45+00:00\",\"dateModified\":\"2022-10-26T14:41:19+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/glossary\\\/css-cascading-style-sheets\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/glossary\\\/css-cascading-style-sheets\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/glossary\\\/css-cascading-style-sheets\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS (Cascading style sheets)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#website\",\"url\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/\",\"name\":\"Mailrelay\",\"description\":\"Mailrelay.com\",\"publisher\":{\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#organization\",\"name\":\"Mailrelay\",\"url\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/wp-content\\\/uploads\\\/2021\\\/12\\\/logo.png\",\"contentUrl\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/wp-content\\\/uploads\\\/2021\\\/12\\\/logo.png\",\"width\":190,\"height\":49,\"caption\":\"Mailrelay\"},\"image\":{\"@id\":\"https:\\\/\\\/wpstaging.mailrelay.com\\\/es\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/Mailrelay\\\/\",\"https:\\\/\\\/x.com\\\/mailrelay\",\"https:\\\/\\\/www.youtube.com\\\/mailrelay-email-marketing\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"CSS (Cascading style sheets) - Mailrelay","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"es_ES","og_type":"article","og_title":"CSS (Cascading style sheets) - Mailrelay","og_description":"¿Qué es CSS (Cascading style sheets) o hojas de estilo en cascada? CSS es el acrónimo de Cascading style sheets, que en castellano se traduce por hojas de estilo en cascada. Desarrollado por el W3C en 1996, CSS es un mecanismo complementario al lenguaje HTML que permite indicarle al navegador el estilo con el qué […]","og_url":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/","og_site_name":"Mailrelay","article_publisher":"https:\/\/www.facebook.com\/Mailrelay\/","article_modified_time":"2022-10-26T14:41:19+00:00","twitter_card":"summary_large_image","twitter_site":"@mailrelay","twitter_misc":{"Tiempo de lectura":"3 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/","url":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/","name":"CSS (Cascading style sheets) - Mailrelay","isPartOf":{"@id":"https:\/\/wpstaging.mailrelay.com\/es\/#website"},"datePublished":"2022-10-26T14:40:45+00:00","dateModified":"2022-10-26T14:41:19+00:00","breadcrumb":{"@id":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wpstaging.mailrelay.com\/es\/glossary\/css-cascading-style-sheets\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wpstaging.mailrelay.com\/es\/"},{"@type":"ListItem","position":2,"name":"CSS (Cascading style sheets)"}]},{"@type":"WebSite","@id":"https:\/\/wpstaging.mailrelay.com\/es\/#website","url":"https:\/\/wpstaging.mailrelay.com\/es\/","name":"Mailrelay","description":"Mailrelay.com","publisher":{"@id":"https:\/\/wpstaging.mailrelay.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wpstaging.mailrelay.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/wpstaging.mailrelay.com\/es\/#organization","name":"Mailrelay","url":"https:\/\/wpstaging.mailrelay.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/wpstaging.mailrelay.com\/es\/#\/schema\/logo\/image\/","url":"https:\/\/wpstaging.mailrelay.com\/wp-content\/uploads\/2021\/12\/logo.png","contentUrl":"https:\/\/wpstaging.mailrelay.com\/wp-content\/uploads\/2021\/12\/logo.png","width":190,"height":49,"caption":"Mailrelay"},"image":{"@id":"https:\/\/wpstaging.mailrelay.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Mailrelay\/","https:\/\/x.com\/mailrelay","https:\/\/www.youtube.com\/mailrelay-email-marketing"]}]}},"uagb_featured_image_src":[],"uagb_author_info":{"display_name":"mailrelay","author_link":"https:\/\/wpstaging.mailrelay.com\/es\/blog\/author\/"},"uagb_comment_info":0,"uagb_excerpt":"¿Qué es CSS (Cascading style sheets) o hojas de estilo en cascada? CSS es el acrónimo de Cascading style sheets, que en castellano se traduce por hojas de estilo en cascada. Desarrollado por el W3C en 1996, CSS es un mecanismo complementario al lenguaje HTML que permite indicarle al navegador el estilo con el qué…","_links":{"self":[{"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/glossary\/48459","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/glossary"}],"about":[{"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/types\/glossary"}],"version-history":[{"count":1,"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/glossary\/48459\/revisions"}],"predecessor-version":[{"id":48635,"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/glossary\/48459\/revisions\/48635"}],"wp:attachment":[{"href":"https:\/\/wpstaging.mailrelay.com\/es\/wp-json\/wp\/v2\/media?parent=48459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}