風(fēng)暴英雄
favicon
- 幾乎所有的網(wǎng)站的快捷圖標(biāo)(收藏圖標(biāo))都叫做favicon.ico
- 快捷圖標(biāo)(收藏圖標(biāo))必須要放到站點(diǎn)文件夾的根目錄中
- 通過link標(biāo)簽引入快捷圖標(biāo)(收藏圖標(biāo))
消除默認(rèn)樣式
- reset.css: 很暴力的清除系統(tǒng)默認(rèn)設(shè)置的樣式
- normalize.css: 會保留系統(tǒng)默認(rèn)設(shè)置的有價值的樣式, 并且修復(fù)了很多瀏覽器的BUG
自動播放背景視頻
<!--自動播放 循環(huán) 靜音 海報(視頻)-->
<video autoplay loop muted poster="images/bg.jpg">
<source src="images/bg.mp4" type="video/mp4">
<source src="images/bg.webm" type="video/webm">
</video>
video{
width: 100%;
height: 1080px;
/*被替換的內(nèi)容在保持其寬高比的同時填充元素的整個內(nèi)容框堕阔。如果對象的寬高比與內(nèi)容框不相匹配融虽,該對象將被剪裁以適應(yīng)內(nèi)容框糯累。*/
object-fit: cover;
background: red;
}
父元素定位會影響子元素a標(biāo)簽的可點(diǎn)擊性,可以修改z-index的值
三個元素,一個接一個動畫,可以設(shè)置每延遲一秒再執(zhí)行下一個元素的動畫
main>.list>li:nth-child(1){
animation: move 1s linear 1s normal;
animation-fill-mode: forwards;
}
.main>.list>li:nth-child(2){
animation: move 1s linear 2s normal forwards;
}
.main>.list>li:nth-child(3){
animation: move 1s linear 3s normal forwards;
}
@keyframes move {
from{
bottom: 0;
}
to{
bottom: 120px;
}
}
在企業(yè)開發(fā)中, 如果元素是左浮動的, 就不要設(shè)置左邊的margin;如果是右浮云,就不要設(shè)置右邊的margin