{"id":7186,"date":"2011-05-18T11:00:04","date_gmt":"2011-05-18T09:00:04","guid":{"rendered":"https:\/\/www.artera.net\/it\/blog\/?p=7186"},"modified":"2023-02-27T14:49:49","modified_gmt":"2023-02-27T14:49:49","slug":"css3-patterns-lineari-con-gradient","status":"publish","type":"post","link":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/","title":{"rendered":"CSS3 patterns &#8211; Pattern lineari con gradient"},"content":{"rendered":"<p>Nel <a href=\"https:\/\/www.artera.net\/it\/blog\/webdesign\/css3-aggiornamenti-cross-browser-per-i-gradienti\" target=\"_blank\" rel=\"noopener noreferrer\">mio ultimo post<\/a> avevo accennato al blog di Lea Verou che ha realizzato una <strong>gallery di pattern CSS3<\/strong>. Si tratta di composizioni grafiche che possono tornare utili e che fino a qualche tempo fa avremmo dovuto <strong>applicare alle nostre pagine web tramite immagini<\/strong>. Ora invece possiamo iniziare a pensare di utilizzare<strong> CSS3<\/strong> per tali operazioni, ricordandoci, per\u00f2, di applicare una immagine di <em>fallback<\/em> per IE.<\/p>\n<p>Una tipologia di immagine di <em>background<\/em> che sulle pagine web \u00e8 tra le pi\u00f9 utilizzate \u00e8 il tipico pattern formato da linee verticali, od oblique,\u00a0 ripetute orizzontalmente:<\/p>\n<figure id=\"attachment_7216\" aria-describedby=\"caption-attachment-7216\" style=\"width: 182px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png\"><img decoding=\"async\" class=\"size-full wp-image-7216\" src=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png\" alt=\"Il tipico pattern usato come background\" width=\"182\" height=\"182\" \/><\/a><figcaption id=\"caption-attachment-7216\" class=\"wp-caption-text\">Il tipico pattern usato come background<\/figcaption><\/figure>\n<p style=\"text-align: left;\">Il principio base che ci permette di creare un pattern di questo tipo \u00e8 descritto direttamente dal W3C nelle specifiche di CSS3 Images:<\/p>\n<p style=\"text-align: left;\"><em>Nel caso in cui due color-stop abbiano la stessa posizione, la regola CSS genera una visualizzazione in cui non esiste una transizione dal primo al secondo colore, ma in cui il primo colore \u00e8 affiancato in modo netto al secondo, non mostrando alcuna transizione dall&#8217;uno all&#8217;altro.<\/em><\/p>\n<p>A questo punto \u00e8 chiara la modalit\u00e0 con cui possano venir generati pattern come quello mostrato nell&#8217;immagine precedente.<\/p>\n<p>[css]<br \/>\nbackground-color: #215171;<br \/>\nbackground-image: -webkit-linear-gradient(left, transparent 50%, rgba(255,255,255,.7) 50%);<br \/>\nbackground-image: -moz-linear-gradient(left, transparent 50%, rgba(255,255,255,.7) 50%);<br \/>\nbackground-image: linear-gradient(left, transparent 50%, rgba(255,255,255,.7) 50%);<br \/>\n[\/css]<\/p>\n<p>Il codice generato \u00e8 semplice: viene impostato un colore di sfondo che fa da base al sito. Sopra a questo colore viene inserita una background-image che possiamo immaginarci proprio come una immagine in semitrasparenza. Il gradiente in questione specifica una direzione ( <em>left<\/em> ) di stampa e due colori. Per entrambi i colori, abbiamo l&#8217;indicazione del color-stop ( <em>50%<\/em> ). La percentuale del color-stop indica la posizione all&#8217;interno della linea-gradiente dove 0% \u00e8 l&#8217;inizio del gradiente e 100% \u00e8 la sua fine. Nel nostro caso abbiamo posto entrambi i color-stop al 50%, dunque, avremo lo spazio a disposizione suddiviso a met\u00e0 tra i due colori.<br \/>\nApplicando per\u00f2 solo queste <strong>regole CSS<\/strong> otteniamo solo uno sfondo con due grandi linee verticali, mentre il nostro scopo \u00e8 averne tante, non solo due che sono larghe ognuna il 50% della pagina.<br \/>\nCI viene in aiuto il background-size con il quale possiamo specificare la larghezza del pattern:<\/p>\n<p>[css]<br \/>\nbackground-size: 35px 35px;<br \/>\n[\/css]<\/p>\n<p>Ovviamente, utilizzando i <strong>background multipli<\/strong> \u00e8 possibile sovrapporre pi\u00f9 livelli e incrociare i pattern cos\u00ec da creare effetti particolari per i quali fino a qualche tempo fa fosse necessario creare delle immagini.<\/p>\n<p>Nel caso in cui, invece, vogliamo definire un pattern obliquo \u00e8 molto utile utilizzare le seguente regola:<\/p>\n<p>[css]<br \/>\nrepeating-linear-gradient(45deg, transparent, transparent 25px, rgba(255,255,255,.5) 25px, rgba(255,255,255,.5) 50px);<br \/>\n[\/css]<\/p>\n<p>Repeating-linear-gradient \u00e8 molto utile per definire gradienti ripetuti e per utilizzare pi\u00f9 <em>color-stop<\/em> che quindi vengono poi riportati uniformemente con la ripetizione del gradiente.<\/p>\n<p>Nel nostro caso l&#8217;indicazione della direzione ( <em>45deg<\/em> ) ci permette di definire il fatto che la regola generi un gradiente obliquo. Inoltre la definizione degli stop combacia per i due colori centrali ( <em>25px<\/em> ) e allo stesso modo per i due esterni che, grazie alla <strong>ripetizione del pattern<\/strong>, si corrispondono a livello di posizione. In questo modo abbiamo due salti di colore che non generano gradienti, ma che in maniera identica al primo nostro esempio\u00a0 stampano a video i due colori affiancati.<\/p>\n<figure id=\"attachment_7226\" aria-describedby=\"caption-attachment-7226\" style=\"width: 182px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-2.png\"><img decoding=\"async\" class=\"size-full wp-image-7226\" src=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-2.png\" alt=\"La versione obliqua del gradiente\" width=\"182\" height=\"182\" \/><\/a><figcaption id=\"caption-attachment-7226\" class=\"wp-caption-text\">La versione obliqua del gradiente<\/figcaption><\/figure>\n","protected":false},"excerpt":{"rendered":"<p><img decoding=\"async\" class=\"alignleft size-full wp-image-7286\" title=\"gradiente\" src=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/gradiente1.png\" alt=\"\" width=\"150\" height=\"150\" style=\"margin-right:10px;\" \/>Nel <a href=\"https:\/\/www.artera.net\/it\/blog\/webdesign\/css3-aggiornamenti-cross-browser-per-i-gradienti\" target=\"_blank\" rel=\"noopener noreferrer\">mio ultimo post<\/a> avevo accennato al <a href=\"http:\/\/leaverou.me\/\" target=\"_blank\" rel=\"noopener noreferrer\">blog di Lea Verou<\/a> che ha realizzato una <strong>gallery di pattern CSS3<\/strong>. Si tratta di composizioni grafiche che possono tornare utili e che fino a qualche tempo fa avremmo dovuto <strong>applicare alle nostre pagine web tramite immagini<\/strong>. Ora invece possiamo iniziare a pensare di utilizzare<strong> CSS3<\/strong> per tali operazioni, ricordandoci, per\u00f2, di applicare una immagine di <em>fallback<\/em> per IE.<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[300],"tags":[69,163],"class_list":["post-7186","post","type-post","status-publish","format-standard","hentry","category-marketing","tag-css3","tag-gradient"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u2022 CSS3 patterns - Pattern lineari con gradient - Artera<\/title>\n<meta name=\"description\" content=\"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.\" \/>\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.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u2022 CSS3 patterns - Pattern lineari con gradient - Artera\" \/>\n<meta property=\"og:description\" content=\"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/\" \/>\n<meta property=\"og:site_name\" content=\"Artera\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/artera.net\/\" \/>\n<meta property=\"article:published_time\" content=\"2011-05-18T09:00:04+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-27T14:49:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png\" \/>\n<meta name=\"author\" content=\"Sergio Ravera\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sergio Ravera\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/\"},\"author\":{\"name\":\"Sergio Ravera\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#\\\/schema\\\/person\\\/48ffb6b3727677643fbfd3ecf0a10aa0\"},\"headline\":\"CSS3 patterns &#8211; Pattern lineari con gradient\",\"datePublished\":\"2011-05-18T09:00:04+00:00\",\"dateModified\":\"2023-02-27T14:49:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/\"},\"wordCount\":541,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2011\\\/05\\\/css-1.png\",\"keywords\":[\"CSS3\",\"gradient\"],\"articleSection\":[\"Marketing\"],\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/\",\"url\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/\",\"name\":\"\u2022 CSS3 patterns - Pattern lineari con gradient - Artera\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2011\\\/05\\\/css-1.png\",\"datePublished\":\"2011-05-18T09:00:04+00:00\",\"dateModified\":\"2023-02-27T14:49:49+00:00\",\"description\":\"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2011\\\/05\\\/css-1.png\",\"contentUrl\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2011\\\/05\\\/css-1.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/marketing\\\/css3-patterns-lineari-con-gradient\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.artera.net\\\/it\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS3 patterns &#8211; Pattern lineari con gradient\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/www.artera.net\\\/it\\\/\",\"name\":\"Artera\",\"description\":\"Swiss Premium Hosting\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.artera.net\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#organization\",\"name\":\"Artera\",\"url\":\"https:\\\/\\\/www.artera.net\\\/it\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2019\\\/09\\\/artera-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.artera.net\\\/wp-content\\\/uploads\\\/2019\\\/09\\\/artera-logo.png\",\"width\":300,\"height\":77,\"caption\":\"Artera\"},\"image\":{\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/artera.net\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/artera\\\/\",\"https:\\\/\\\/www.instagram.com\\\/artera_swiss\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.artera.net\\\/it\\\/#\\\/schema\\\/person\\\/48ffb6b3727677643fbfd3ecf0a10aa0\",\"name\":\"Sergio Ravera\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g\",\"caption\":\"Sergio Ravera\"},\"description\":\"Raised in a family tradition of merchants, my entrepreneurial spirit drove me to launch my first e-commerce venture in 1998. My vision and dedication led, in 2002, to the founding of Artera, now a leading brand in premium managed cloud hosting services. As Chief Executive Officer, I lead DHH Switzerland SA, part of the international DHH S.p.A. group, listed on the Milan Stock Exchange with the reference code (AIM \u2013 ISIN: IT0005203622). It is under this brand that the Artera brand continues to grow and thrive. In addition to my commitment to the business world, I am an active researcher in the field of new technologies, always fascinated by cutting-edge innovations in the industry.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/sergioravera\\\/\"],\"url\":\"https:\\\/\\\/www.artera.net\\\/it\\\/author\\\/sergio-ravera\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u2022 CSS3 patterns - Pattern lineari con gradient - Artera","description":"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.","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.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/","og_locale":"it_IT","og_type":"article","og_title":"\u2022 CSS3 patterns - Pattern lineari con gradient - Artera","og_description":"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.","og_url":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/","og_site_name":"Artera","article_publisher":"https:\/\/www.facebook.com\/artera.net\/","article_published_time":"2011-05-18T09:00:04+00:00","article_modified_time":"2023-02-27T14:49:49+00:00","og_image":[{"url":"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png","type":"","width":"","height":""}],"author":"Sergio Ravera","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"Sergio Ravera","Tempo di lettura stimato":"3 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#article","isPartOf":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/"},"author":{"name":"Sergio Ravera","@id":"https:\/\/www.artera.net\/it\/#\/schema\/person\/48ffb6b3727677643fbfd3ecf0a10aa0"},"headline":"CSS3 patterns &#8211; Pattern lineari con gradient","datePublished":"2011-05-18T09:00:04+00:00","dateModified":"2023-02-27T14:49:49+00:00","mainEntityOfPage":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/"},"wordCount":541,"commentCount":0,"publisher":{"@id":"https:\/\/www.artera.net\/it\/#organization"},"image":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#primaryimage"},"thumbnailUrl":"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png","keywords":["CSS3","gradient"],"articleSection":["Marketing"],"inLanguage":"it-IT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/","url":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/","name":"\u2022 CSS3 patterns - Pattern lineari con gradient - Artera","isPartOf":{"@id":"https:\/\/www.artera.net\/it\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#primaryimage"},"image":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#primaryimage"},"thumbnailUrl":"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png","datePublished":"2011-05-18T09:00:04+00:00","dateModified":"2023-02-27T14:49:49+00:00","description":"Leggi dal blog: CSS3 patterns - Pattern lineari con gradient. Contattaci per una partnership! Artera Swiss Premium Hosting news, articoli e notizie interessanti dal mondo digitale.","breadcrumb":{"@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#primaryimage","url":"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png","contentUrl":"https:\/\/www.artera.net\/wp-content\/uploads\/2011\/05\/css-1.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.artera.net\/it\/marketing\/css3-patterns-lineari-con-gradient\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.artera.net\/it\/"},{"@type":"ListItem","position":2,"name":"CSS3 patterns &#8211; Pattern lineari con gradient"}]},{"@type":"WebSite","@id":"https:\/\/www.artera.net\/it\/#website","url":"https:\/\/www.artera.net\/it\/","name":"Artera","description":"Swiss Premium Hosting","publisher":{"@id":"https:\/\/www.artera.net\/it\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.artera.net\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Organization","@id":"https:\/\/www.artera.net\/it\/#organization","name":"Artera","url":"https:\/\/www.artera.net\/it\/","logo":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.artera.net\/it\/#\/schema\/logo\/image\/","url":"https:\/\/www.artera.net\/wp-content\/uploads\/2019\/09\/artera-logo.png","contentUrl":"https:\/\/www.artera.net\/wp-content\/uploads\/2019\/09\/artera-logo.png","width":300,"height":77,"caption":"Artera"},"image":{"@id":"https:\/\/www.artera.net\/it\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/artera.net\/","https:\/\/www.linkedin.com\/company\/artera\/","https:\/\/www.instagram.com\/artera_swiss\/"]},{"@type":"Person","@id":"https:\/\/www.artera.net\/it\/#\/schema\/person\/48ffb6b3727677643fbfd3ecf0a10aa0","name":"Sergio Ravera","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/618f2c20338bb422bd317eae8d6c9c097ba85d3f5a1da18e21ecf5da5ee3a448?s=96&d=mm&r=g","caption":"Sergio Ravera"},"description":"Raised in a family tradition of merchants, my entrepreneurial spirit drove me to launch my first e-commerce venture in 1998. My vision and dedication led, in 2002, to the founding of Artera, now a leading brand in premium managed cloud hosting services. As Chief Executive Officer, I lead DHH Switzerland SA, part of the international DHH S.p.A. group, listed on the Milan Stock Exchange with the reference code (AIM \u2013 ISIN: IT0005203622). It is under this brand that the Artera brand continues to grow and thrive. In addition to my commitment to the business world, I am an active researcher in the field of new technologies, always fascinated by cutting-edge innovations in the industry.","sameAs":["https:\/\/www.linkedin.com\/in\/sergioravera\/"],"url":"https:\/\/www.artera.net\/it\/author\/sergio-ravera\/"}]}},"_links":{"self":[{"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/posts\/7186","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/comments?post=7186"}],"version-history":[{"count":7,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/posts\/7186\/revisions"}],"predecessor-version":[{"id":217897,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/posts\/7186\/revisions\/217897"}],"wp:attachment":[{"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/media?parent=7186"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/categories?post=7186"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.artera.net\/it\/wp-json\/wp\/v2\/tags?post=7186"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}