Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Tutorial Blog-cara membuat gelombang Wave-arief student.com

Tutorial Blog-cara membuat gelombang Wave-arief student.com

Posting Komentar






 1. buka pada edit HTML

2. taruh kode diatas <head> atau dibawah <footer>

3. silahkan copi kode berikut, jangan lupa subcribe ya gusy,,,,



    <b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>

<style>

.breadcrumbs{display:none}

div#label-intro{z-index:20;margin:0;color:#fff;text-align:center;height:100%;position:absolute;width:100%}

.label-intro{z-index:2;position:absolute;width:100%;height:100%}

div#label-intro div.noi-dung{position:absolute;top:30%;left:45%;transform:translate(-50%,-50%);width:970px;max-width:100%;text-align:center;padding:0 0 0 8em;box-sizing:border-box}

div#label-intro div.noi-dung i.labels{left:0;position:absolute;top:50%;transform:translate(0,-50%);font-size:6em;font-weight:100;opacity:.3}

div#label-intro div.noi-dung div.title{font-weight:700;font-size:2.5em;text-shadow:6px 6px 0 rgba(0,0,0,0.1)}

div#label-intro div.noi-dung div.content{width:100%;max-width:100%}

.noi-dung a:visited{color:#fff}

/*div#label-intro div.noi-dung div.title small.cap{display:block;font-size:14px;font-weight:300}*/

@keyframes bsw-wave2{0%{transform:translateX(0) translateZ(0) scaleY(1)}50%{transform:translateX(-25%) translateZ(0) scaleY(0.55)}100%{transform:translateX(-50%) translateZ(0) scaleY(1)}}

.waveWrapper{overflow:hidden;position:relative;left:0;top:0;margin:auto;width:100%;height:200px;user-select:none;-webkit-user-select:none}

.bsw-wavebg{position:absolute;width:100%;overflow:hidden;height:100%;bottom:0;background:linear-gradient(to right,#a158e4,#3243db)}

.bsw-bgt{z-index:15;opacity:0.5}

.bsw-bgm{z-index:10;opacity:0.75}

.bsw-bgb{z-index:5}

.wave{position:absolute;left:0;width:200%;height:100%;background-repeat:repeat no-repeat;background-position:0 bottom;transform-origin:center bottom}

.bsw-wavetop{background-size:50% 100px}

.bsw-wave-ani .bsw-wavetop{animation:move-wave 3s;-webkit-animation:move-wave 3s;-webkit-animation-delay:1s;animation-delay:1s}

.bsw-wave-mid{background-size:50% 120px}

.bsw-wave-ani .bsw-wave-mid{animation:bsw-wave2 10s linear infinite}

.bsw-wave-bot{background-size:50% 100px}

.bsw-wave-ani .bsw-wave-bot{animation:bsw-wave2 15s linear infinite}

.bsw_wrapper{margin-top:15px}

@-webkit-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

@-moz-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

@keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

</style>

<div class='waveWrapper bsw-wave-ani'>

<div id='label-intro'>

<div class='label-intro'>

<div class='noi-dung'>

 

        

    <p class='description'><span/></p>

</div>

</div>

</div>

<div class='bsw-wavebg bsw-bgt'>

<div class='wave bsw-wavetop' style='background-image: url(&apos;https://blogger.googleusercontent.com/img/proxy/AVvXsEjjSONtiSN6fgFvqH_lvds7R5k9iUWWNy7so7OwQbF0daawDhCo6WRCBOKVioa3RiLWDe9iwhADn-DiKwpyF_9uua7meKfkkdeM7_WvamnVS-3l0qMit3sFnKfs8J7rDO8RuEzXmHOPCgHwBd-FZuUsyg=s0-d&apos;)'/>

</div>

<div class='bsw-wavebg bsw-bgm'>

<div class='wave bsw-wave-mid' style='background-image: url(&apos;https://blogger.googleusercontent.com/img/proxy/AVvXsEjL0xPCFBaX8kLUjSOlFKftlW9xEShxPbXeaL65K6Dj-ts7rCpStgDPoPzHwdCSN-EDDXNqHt1qKMmnqd_ZWnhbZ8jR8EXVtEVnrcAf2PKiYhYhK7CgWPC0NcwlzeixE9RYTmGOPbuUH6_LCzBxn2u3rA=s0-d&apos;)'/>

</div>

<div class='bsw-wavebg bsw-bgb'>

<div class='wave bsw-wave-bot' style='background-image: url(&apos;https://blogger.googleusercontent.com/img/proxy/AVvXsEgN20EUOcCEdwqv9ey-SD1gkGxXZTD8b2pp-oyUYaMonijzNkWlbu_YnRdwhsHFxBW86vbA9hN9fP9wsRPEpvi5wrKO2QaM1bRskHqScBwuDCOdLbcC1H_TOrc5nyeFQeIaURBXWO-QUbabshlWhSV4NQ=s0-d&apos;)'/>

</div>

</div>

</b:if>


Posting Komentar untuk "Tutorial Blog-cara membuat gelombang Wave-arief student.com"