html > CSS学习 >

网页吸顶灯布局鼠标下拉内容导航固定顶部特效

2018-05-08 10:10:31 导航，网页头部内容固定悬停在最顶部，称为网页吸顶CSS HTML代码模块。网页吸顶布局的HTML和CSS代码分享。

导航，网页头部内容固定悬停在最顶部，称为网页吸顶CSS HTML代码模块。网页吸顶布局的HTML和CSS代码分享。这种网页叫网页吸顶灯效果。

HTML网页吸顶特效截图

导航悬停浏览器顶部的关键CSS代码：

.nav { background: #c92d31 !important; height: 120px; width: 100%; min-width:980px; position: fixed; z-index: 100; top: 0; padding: 0 100px; box-sizing: border-box; }

关键代码为position: fixed; z-index: 100; top: 0;，设置对象相对定位在浏览器顶部为0，并且层叠值为100,值越大越靠前。

在线演示：

运行代码试试

免费下载地址：

立即下载（8.71KB）

可用于各大企业站、中小站、大站，有需要的顶部悬停吸顶的需要。

相关推荐：网页布局固定底部CSS HTML代码

相关词： 浮动 特效 顶部 悬停 吸顶
上一篇：div字间距-div内文字之间间距设置方法
下一篇：css书写规范-CSS代码命名
更新