![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-75.png\")
<\/p>\n<\/p>\n
![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-76.png\")
<\/p>\n
El CSS permet modificar l\u2019aspecte de cada un de les quatre vores de la caixa d\u2019un element. Per cada vora es pot establir la seva amplada o gruix, color i estil<\/strong>. En total CSS defineix m\u00e9s de 20 propietats relacionades amb les vores.<\/p>\n L\u2019amplada de les vores es controla amb les quatre proietats: border-top-width, border-right-width, border-bottom-width, border-left-width<\/strong>.<\/p>\n L\u2019amplada de les vores s\u2019indica mitjan\u00e7ant una unitat de mesura. L\u2019unitat de mesura m\u00e9s habitual \u00e9s el p\u00edxel, ja que permet un control m\u00e9s prec\u00eds sobre el gruix.<\/p>\n Exemple: quatre mesures diferents de vora: Si es vol establir de forma simult\u00e0nia les quatre propietats, podem fer-ho mitjan\u00e7ant border-width<\/strong>.<\/p>\n El color de les vores es controla amb les quatre propietats: border-top-color, border-right-color, border-bottom-color, border-left-color.<\/strong><\/p>\n De la mateixa manera que amb l\u2019amplada, podem indicar d\u2019un a quatre valors i les regles d\u2019aplicaci\u00f3 s\u00f3n les mateixes que la propietat border-width<\/strong>, en aquest cas per\u00f2 la propietat ser\u00e0 border-color<\/strong>.<\/p>\n El CSS permet establir l\u2019estil de cada una de les vores mitjan\u00e7ant les propietats: border-top-style, border-right-style, border-bottom-style, border-left-style<\/strong>.<\/p>\n Per establir de forma simult\u00e0nia els estils de totes les vores d\u2019una caixa, \u00e9s necessari utilitzar la propietat \u201cshorthand\u201d anomenada border-style.<\/strong><\/p>\n L\u2019estil de les vores nom\u00e9s es pot indicar mitjan\u00e7ant els seg\u00fcents valors: none, hiden, dotted, dashed, solid, double, groove, ridge, inset, outset, inherit<\/strong>.<\/p>\n Igual que passa amb els marges (margin<\/strong>) i el farcit (o emplenament, padding<\/strong>), el CSS defineix una s\u00e8rie de propietats tipus \u201cshorthand\u201d que permet establir tots els atributs de les vores de forma simult\u00e0nia<\/strong>. El CSS compr\u00e8n una propietat \u201cshorthand\u201d per a cada una de les quatre vores i una propietat \u201cshorhand\u201d global<\/strong>.<\/p>\nAmplada<\/h2>\n
![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-87.png\")
\n<\/em><\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-88.png\")
<\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-89.png\")
<\/p>\n\n
Color<\/h2>\n
![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-90.png\")
<\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-91.png\")
<\/p>\nEstil<\/h2>\n
![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-92.png\")
<\/p>\nPropietats shorthand<\/h2>\n
![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/1-93.png\")
<\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/Captura-de-Pantalla-2019-01-23-a-les-19.21.01.png\")
<\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/Captura-de-Pantalla-2019-01-23-a-les-19.21.08.png\")
<\/p>\n![\"\"](\"http:\/\/tutorial.bernatcortina.cat\/wp-content\/uploads\/2019\/01\/Captura-de-Pantalla-2019-01-23-a-les-19.22.07.png\")
<\/p>\n","protected":false},"excerpt":{"rendered":"