HTML

<ul>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
</ul>

css

ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
ul li{
    background-color: gray;
    padding: 10px;
}
ul li:hover{
    background-color: rgb(138, 138, 138);
}
@media screen and (min-width:768px) {
    ul{
        display: flex;
    }
    ul li{
        flex:1;
    }
}

(可縮放視窗測試效果。)

Comment

Animate.css是個動畫CSS library,不過主要是專注在處理動畫的部分,在網頁上該什麼時機呈現動畫,加上WOW.js,如捲軸滑到畫面才出現動畫效果。

開始使用WOW.js

要使用WOW.js非常簡單,載入相關的程式碼後,加上一行程式碼就完成了!

Javascript

new WOW().init();

HTML

<div class="wow bounce"> 我只有在出現時才會呈現特效喔! </div>

Comment

反轉原陣列順序

$a=array(‘a’,’1′,’2′,’b’);
print_r(array_reverse($a));

顯示結果:
Array ( [0] => b [1] => 2 [2] => 1 [3] => a )

Comment

Copyright © 2018 ucamc