{"id":2762,"date":"2013-05-20T18:41:00","date_gmt":"2013-05-20T16:41:00","guid":{"rendered":"http:\/\/www.4webs.es\/blog\/?p=2762"},"modified":"2017-08-28T12:53:21","modified_gmt":"2017-08-28T11:53:21","slug":"comenzando-con-bootstrap-framework-responsive","status":"publish","type":"post","link":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive","title":{"rendered":"Comenzando con Bootstrap, framework responsive"},"content":{"rendered":"

Para aquellos que no conozcan Bootstrap<\/a><\/strong>, es un framework que nos permite montar una estructura responsive f\u00e1cilmente<\/strong>, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.<\/p>\n

Bootstrap es un framework para desarrollo front-end desarrollado por Twitter<\/strong>, por lo que ya os pod\u00e9is imaginar la calidad que nos puede llegar a ofrecer este sistema y en principio si vamos a tener que desarrollar una p\u00e1gina web responsive nos puede solucionar muchos problemas y sobre todo aportarnos muchas ventajas, entra ellas cross-browser entre la mayor\u00eda de navegadores, es compatible con Firefox, Chrome, Safari e IE7 o superior<\/strong>.<\/p>\n

\"bootstrap-grid\"<\/p>\n

Bootstrap incorpora muchas librer\u00edas como normalice, jquery, less<\/strong>, por lo que podremos hacer uso de muchos efectos y funciones que teni\u00e9ndolas que programar de cero tardar\u00edamos much\u00edsimo, incorpora un sistema de grid basado en 12 columnas fluidas<\/strong> para poder acoplarse en funci\u00f3n del dispositivo desde el que accedamos. Adem\u00e1s las im\u00e1genes se ir\u00e1n escalando al tama\u00f1o correcto en funci\u00f3n si lo estamos viendo desde un m\u00f3vil o un ordenador de sobremesa, podremos ocultar im\u00e1genes, contenedores o lo que queramos de manera sencilla o incluso incluir efectos personalizados en funci\u00f3n del dispositivo.<\/p>\n

\"bootstrap-visible\"<\/p>\n

Otra de las ventajas de usar Bootstrap es que una vez aprendamos a desarrollar sobre ser\u00e1 muy f\u00e1cil y r\u00e1pido<\/strong>, tan solo tendremos que estructurar un HTML con una estructura html5 e incluir los archivos necesarios css , js e iconos para poder funcionar, en la propia p\u00e1gina de Bootstrap disponemos de ejemplo sencillos de seguir<\/strong>, desde una p\u00e1gina muy sencilla, hasta un men\u00fa avanzando, o un slider para tu p\u00e1gina principal, y si no quieres complicarte la vida tienes multitud de plantillas de gran calidad que no te costar\u00e1 mucho personalizar y adaptar a tus necesidades.<\/p>\n<\/div><\/div>","protected":false},"excerpt":{"rendered":"

Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.<\/p>\n","protected":false},"author":1,"featured_media":2763,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":{"0":"post-2762","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-diseno-web"},"yoast_head":"\nComenzando con Bootstrap, framework responsive | 4webs.es<\/title>\n<meta name=\"description\" content=\"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Comenzando con Bootstrap, framework responsive | 4webs.es\" \/>\n<meta property=\"og:description\" content=\"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive\" \/>\n<meta property=\"og:site_name\" content=\"4webs\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/4webs\" \/>\n<meta property=\"article:published_time\" content=\"2013-05-20T16:41:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-08-28T11:53:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"287\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Pablo Risue\u00f1o\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@4webs\" \/>\n<meta name=\"twitter:site\" content=\"@4webs\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Pablo Risue\u00f1o\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive\"},\"author\":{\"name\":\"Pablo Risue\u00f1o\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/#\\\/schema\\\/person\\\/fc07e8cecb1e51ce56b131a1eb0b3048\"},\"headline\":\"Comenzando con Bootstrap, framework responsive\",\"datePublished\":\"2013-05-20T16:41:00+00:00\",\"dateModified\":\"2017-08-28T11:53:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive\"},\"wordCount\":326,\"commentCount\":2,\"image\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/05\\\/bootstrap-framework-responsive.jpg\",\"articleSection\":[\"Dise\u00f1o web\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive\",\"url\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive\",\"name\":\"Comenzando con Bootstrap, framework responsive | 4webs.es\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/05\\\/bootstrap-framework-responsive.jpg\",\"datePublished\":\"2013-05-20T16:41:00+00:00\",\"dateModified\":\"2017-08-28T11:53:21+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/#\\\/schema\\\/person\\\/fc07e8cecb1e51ce56b131a1eb0b3048\"},\"description\":\"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#primaryimage\",\"url\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/05\\\/bootstrap-framework-responsive.jpg\",\"contentUrl\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/05\\\/bootstrap-framework-responsive.jpg\",\"width\":600,\"height\":287},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/comenzando-con-bootstrap-framework-responsive#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.4webs.es\\\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Comenzando con Bootstrap, framework responsive\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/\",\"name\":\"4webs\",\"description\":\"Desarrollo con Prestashop, gesti\u00f3n de proyectos ecommerce\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/#\\\/schema\\\/person\\\/fc07e8cecb1e51ce56b131a1eb0b3048\",\"name\":\"Pablo Risue\u00f1o\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g\",\"caption\":\"Pablo Risue\u00f1o\"},\"sameAs\":[\"http:\\\/\\\/www.4webs.es\"],\"url\":\"https:\\\/\\\/www.4webs.es\\\/blog\\\/author\\\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Comenzando con Bootstrap, framework responsive | 4webs.es","description":"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive","og_locale":"es_ES","og_type":"article","og_title":"Comenzando con Bootstrap, framework responsive | 4webs.es","og_description":"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.","og_url":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive","og_site_name":"4webs","article_publisher":"https:\/\/www.facebook.com\/4webs","article_published_time":"2013-05-20T16:41:00+00:00","article_modified_time":"2017-08-28T11:53:21+00:00","og_image":[{"width":600,"height":287,"url":"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg","type":"image\/jpeg"}],"author":"Pablo Risue\u00f1o","twitter_card":"summary_large_image","twitter_creator":"@4webs","twitter_site":"@4webs","twitter_misc":{"Escrito por":"Pablo Risue\u00f1o","Tiempo de lectura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#article","isPartOf":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive"},"author":{"name":"Pablo Risue\u00f1o","@id":"https:\/\/www.4webs.es\/blog\/#\/schema\/person\/fc07e8cecb1e51ce56b131a1eb0b3048"},"headline":"Comenzando con Bootstrap, framework responsive","datePublished":"2013-05-20T16:41:00+00:00","dateModified":"2017-08-28T11:53:21+00:00","mainEntityOfPage":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive"},"wordCount":326,"commentCount":2,"image":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#primaryimage"},"thumbnailUrl":"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg","articleSection":["Dise\u00f1o web"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive","url":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive","name":"Comenzando con Bootstrap, framework responsive | 4webs.es","isPartOf":{"@id":"https:\/\/www.4webs.es\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#primaryimage"},"image":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#primaryimage"},"thumbnailUrl":"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg","datePublished":"2013-05-20T16:41:00+00:00","dateModified":"2017-08-28T11:53:21+00:00","author":{"@id":"https:\/\/www.4webs.es\/blog\/#\/schema\/person\/fc07e8cecb1e51ce56b131a1eb0b3048"},"description":"Para aquellos que no conozcan Bootstrap, es un framework que nos permite montar una estructura responsive f\u00e1cilmente, decimos f\u00e1cilmente porque muchas clases y funciones est\u00e1n desarrolladas, pero eso implica que tendremos que aprender el funcionamiento y el uso de sus propias funciones.","breadcrumb":{"@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#primaryimage","url":"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg","contentUrl":"https:\/\/www.4webs.es\/blog\/wp-content\/uploads\/2013\/05\/bootstrap-framework-responsive.jpg","width":600,"height":287},{"@type":"BreadcrumbList","@id":"https:\/\/www.4webs.es\/blog\/comenzando-con-bootstrap-framework-responsive#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.4webs.es\/blog"},{"@type":"ListItem","position":2,"name":"Comenzando con Bootstrap, framework responsive"}]},{"@type":"WebSite","@id":"https:\/\/www.4webs.es\/blog\/#website","url":"https:\/\/www.4webs.es\/blog\/","name":"4webs","description":"Desarrollo con Prestashop, gesti\u00f3n de proyectos ecommerce","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.4webs.es\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.4webs.es\/blog\/#\/schema\/person\/fc07e8cecb1e51ce56b131a1eb0b3048","name":"Pablo Risue\u00f1o","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6938f7637a533914c144759f6249310d5f8fdef83738a4641b2d151a17c19f97?s=96&d=mm&r=g","caption":"Pablo Risue\u00f1o"},"sameAs":["http:\/\/www.4webs.es"],"url":"https:\/\/www.4webs.es\/blog\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/posts\/2762","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/comments?post=2762"}],"version-history":[{"count":2,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/posts\/2762\/revisions"}],"predecessor-version":[{"id":8196,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/posts\/2762\/revisions\/8196"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/media\/2763"}],"wp:attachment":[{"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/media?parent=2762"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/categories?post=2762"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.4webs.es\/blog\/wp-json\/wp\/v2\/tags?post=2762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}