En gemensam designteknik på sistone är att skapa en vikningseffekt, där det verkar som om en rubrik sätter in sig bakom behållaren. Detta uppnås generellt genom användning av små bilder; Men med CSS kan vi efterlikna denna effekt ganska enkelt. Jag ska visa dig hur på fyra minuter.

Prenumerera på vår YouTube-sida för att titta på alla videohandledning!

Sägare på Screenr.com?

---

Slutlig HTML

         
 
 Min rubrik  
 
  

---

Slutlig CSS

 #container background: # 666; marginal: auto; bredd: 500px; höjd: 700px; padding-top: 30px; font-family: helvetica, arial, sans-serif;  h1 bakgrund: # e3e3e3; bakgrund: -moz-linjär-gradient (topp, # e3e3e3, # c8c8c8); bakgrund: -webkit-gradient (linjär, vänster topp, vänster botten, från (# e3e3e3), till (# c8c8c8)); vaddering: 10px 20px; marginal-vänster: -20px; marginal-topp: 0; position: relativ; bredd: 70%; -moz-box-skugga: 1px 1px 3px # 292929; -webkit-box-skugga: 1px 1px 3px # 292929; boxskugga: 1px 1px 3px # 292929; färg: # 454545; textskugga: 0 1px 0 vit;  .arrow width: 0; höjd: 0; linjehöjd: 0; gränsen-vänster: 20px solid transparent; border-top: 10px solid # c8c8c8; topp: 104%; vänster: 0; position: absolut;