Rask Tips Praktiske CSS-former

En felles designteknikk i det siste er å skape en fold-effekt, der det ser ut som om en overskrift er innpakning bak beholderen. Dette oppnås vanligvis ved bruk av små bilder; Men med CSS kan vi etterligne denne effekten ganske enkelt. Jeg skal vise deg hvordan om fire minutter.


Abonner på vår YouTube-side for å se alle videoopplæringene!

Se heller på Screenr.com?


Endelig HTML

     CSS figurer    

Min overskrift


Endelig CSS

 #container background: # 666; margin: auto; bredde: 500px; høyde: 700px; polstring: 30px; font-familie: helvetica, arial, sans-serif;  h1 bakgrunn: # e3e3e3; bakgrunn: -moz-lineær-gradient (topp, # e3e3e3, # c8c8c8); bakgrunn: -webkit-gradient (lineær, venstre topp, venstre bunn, fra (# e3e3e3), til (# c8c8c8)); polstring: 10px 20px; margin-left: -20px; margin-topp: 0; stilling: relativ; bredde: 70%; -moz-box-shadow: 1px 1px 3px # 292929; -webkit-boks-skygge: 1px 1px 3px # 292929; boks-skygge: 1px 1px 3px # 292929; farge: # 454545; tekstskygge: 0 1px 0 hvit;  .arrow width: 0; høyde: 0; linjehøyde: 0; border-left: 20px solid gjennomsiktig; border-top: 10px solid # c8c8c8; topp: 104%; venstre: 0; posisjon: absolutt;