Saltar ao contido principal

Publicacións

Mostrando publicacións desta data: Agosto, 2014

Algunhas trucas para as follas de estilo

Dispor o tamaño da fonte no 62.5% para unha mellor conversión a em Si eres dos que gosta empregar unidades relativas de medida para o tamaño das fontes, este é un atallo que permite establecer unha relación de conversión na que 1em=10px. Deste xeito calquera cantidade em multiplicada por 10 hános dar o equivalente en px que estamos a empregar. p.ex.: 1.2em = 12px. Ou viceversa: unha cantidade en px dividida por 10 daranos o seu valor contextual en em. p.ex.: 24px = 2.4em body { font-size: 62.5%; /* font-size 1em = 10px */} p { font-size: 1.2em; /* 1.2em = 12px */} Quitarlle o borde resaltado engadido polos navegadores WebKit Cando seleccionamos un elemento input algúns navegadores - Safari, Chrome- engaden un borde resaltado. O seguinte codigo eliminao: input[type="text"]:focus { outline: none; } Pequenos cambios que resalten a interactividade Para iso está CSS3. Usar sen complexo ;) mom! a { -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-

abreviar procesos repetitivos con Emmet

Usando abreviaturas e comandos con Emmet podemos acortar o tempo de desenvolvemento: Ex.: En HTML #menu$*6>ul>li*0>a{Link Here}          + [Crtl]+E article#front.main                                    + [Crtl]+E article>p{Text here...}+bq>{Text here...}^p{Text here...}*3        + [Ctrl]+E form                + [Ctrl]+E form:get           + [Ctrl]+E form:post         + [Ctrl]+E input:t              + [Ctrl]+E input:time         + [Ctrl]+E input:time#dateTime      + [Ctrl]+E table+            + [Ctrl]+E tr+                 + [Ctrl]+E colg+             + [Ctrl]+E  ******************************************* En CSS pos    + [Ctrl]+E     position: relative; pos:s  + [Ctrl]+E    position: static; t:a      + [Ctrl]+E    top: auto; z        + [Ctrl]+E    z-index; va:t    + [Ctrl]+E    vertical-align: top; tsh:ra + [Ctrl]+E    text-shadow: h v blur rgba(0, 0, 0, .5); bdtli:c + [Ctrl]+E  border-top-left-image: continue; d        + [Ctrl]+E