Ændring af kantradius CSS-animation | csPoint | Web Designing Tutorials

Jeg har en baggrund, der har en top- og bundgradient, og jeg ønsker, at den skal vises på et containerlag. Problemet er den nederste gradient, da den skal vises i slutningen af ​​containerdiv. Nogle ideer? Her er nogle eksempler på kode og imgur-foto:

<style> .container{background: #fff url(images/bg.png) repeat-x;} </style> 

Dynamic stuff goes in here that differs on every page

http://imgur.com/XAaIx

Ovenstående kode viser kun gradienten øverst, men er der en anden måde at opnå denne effekt på?

Du kan prøve noget som:

<style> .container{background: #fff url(images/bg_bottom_gradient.png) repeat-x;} .subcontainer{margin: 0 auto;background-image:url(images/bg_top_gradient.png);background-repeat: repeat-x;} </style> 

Dynamic stuff goes in here that differs on every page

REDIGERET TIL AT TILFØJE NY STIL:

  • Dette fungerer, hvis lagene har samme bredde, men beholderen (diven, der indeholder bg) strækker sig 100%, mens indholdet div er en fast bredde (950px).
  • @fewpeople - Tilføjet alternativ.

du kan bruge css-regler til flere baggrunde

div.container { background-image: url(images/bg_top.png), url(images/bg_bottom.png); background-repeat: repeat-x; background-position: top left, bottom left; } 

Det skulle fungere.

  • Jeg er nysgerrig efter, hvilke browsere der faktisk understøtter dette.
  • Dette fungerer desværre ikke så godt på IE :(

arbejdet for dig: Charles Robertson | Ønsker du at kontakte os?