{"id":688,"date":"2023-01-06T18:27:07","date_gmt":"2023-01-06T18:27:07","guid":{"rendered":"https:\/\/alexcgdesign.com\/blog\/?p=688"},"modified":"2023-01-06T18:42:40","modified_gmt":"2023-01-06T18:42:40","slug":"dropdown-css","status":"publish","type":"post","link":"https:\/\/alexcgdesign.com\/blog\/dropdown-css\/","title":{"rendered":"CREA un DROPDOWN Men\u00fa (CSS)"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"688\" class=\"elementor elementor-688\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-be4c1ae elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"be4c1ae\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-37fb96d\" data-id=\"37fb96d\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c9e49c8 elementor-widget elementor-widget-text-editor\" data-id=\"c9e49c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Holaa, \u00bfC\u00f3mo est\u00e1s? Es un placer saludarte, el d\u00eda de hoy\u00a0<b>aprender\u00e1s como crear un men\u00fa dropdown \u00fanicamente usando CSS, sin utiliza JavaScript.\u00a0<\/b><span style=\"font-size: 18px; color: var( --e-global-color-text );\">S\u00f3lo d\u00e9jame preguntarte algo antes de empezar \u00bfYa viste el tutorial donde puedes crear el men\u00fa desde cero? Si la respuesta ha sido no, \u00bfQu\u00e9 esperas para verlo?\u00a0<\/span><img decoding=\"async\" class=\"emoji\" style=\"font-size: 18px; color: var( --e-global-color-text ); background-color: #ffffff;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" style=\"font-size: 18px; color: var( --e-global-color-text ); background-color: #ffffff;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" style=\"font-size: 18px; color: var( --e-global-color-text ); background-color: #ffffff;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-896d1ee elementor-widget elementor-widget-video\" data-id=\"896d1ee\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/uupOWz65O4M&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-43067c0 elementor-button-danger elementor-widget elementor-widget-button\" data-id=\"43067c0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-lg\" href=\"https:\/\/youtu.be\/uupOWz65O4M\" target=\"_blank\" rel=\"nofollow\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Ver el tutorial<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7d0a490 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"7d0a490\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-b63084e\" data-id=\"b63084e\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-127a09b elementor-widget elementor-widget-spacer\" data-id=\"127a09b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1b28037 elementor-widget elementor-widget-text-editor\" data-id=\"1b28037\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Una vez que hemos terminado el tutorial. Quiz\u00e1 quieras alg\u00fan recurso que no pudiste encontrar o puedes tener un error, para eso te dejar\u00e9 aqu\u00ed en la parte de abajo los archivos del men\u00fa. <img decoding=\"async\" class=\"emoji\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-88622b0 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"88622b0\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1dd5631\" data-id=\"1dd5631\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-333e70b elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"333e70b\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-78d6127\" data-id=\"78d6127\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fa05ab6 elementor-widget elementor-widget-heading\" data-id=\"fa05ab6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u00bfTe gustar\u00eda descargar los proyectos?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1335cb2 elementor-widget elementor-widget-text-editor\" data-id=\"1335cb2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Claro, todos los proyectos de AlexCG Design, son libres de descargar, recuerda que te puedes entrar a mi curso premium de CSS o tambi\u00e9n entrar a la p\u00e1gina de nuestro patrocinador para seguir apoyando:)<\/p>\n<p><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3d9a45a elementor-widget elementor-widget-button\" data-id=\"3d9a45a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-md\" href=\"https:\/\/hostinger.com\/alexcg\" target=\"_blank\" rel=\"nofollow\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">HOSTING Y DOMINIO<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d2b907f elementor-button-warning elementor-widget elementor-widget-button\" data-id=\"d2b907f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-md\" href=\"https:\/\/github.com\/AlexCGDesign\/dropdowncss\" target=\"_blank\" rel=\"nofollow\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fas fa-file-download\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Descarga los archivos<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4cee274 elementor-button-danger elementor-widget elementor-widget-button\" data-id=\"4cee274\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-md\" href=\"https:\/\/alexcgdesign.com\/cursocss\" target=\"_blank\" rel=\"nofollow\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fab fa-css3-alt\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">CURSO CSS DESDE CERO<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Holaa, \u00bfC\u00f3mo est\u00e1s? Es un placer saludarte, el d\u00eda de hoy\u00a0aprender\u00e1s como crear un men\u00fa dropdown \u00fanicamente usando CSS, sin utiliza JavaScript.\u00a0S\u00f3lo d\u00e9jame preguntarte algo antes de empezar \u00bfYa viste el tutorial donde puedes crear el men\u00fa desde cero? Si la respuesta ha sido no, \u00bfQu\u00e9 esperas para verlo?\u00a0 Ver el tutorial Una vez que [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":696,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-688","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts\/688","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/comments?post=688"}],"version-history":[{"count":0,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts\/688\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/media\/696"}],"wp:attachment":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/media?parent=688"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/categories?post=688"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/tags?post=688"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}