position:fixed来实现.

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>菜单栏固定</title>

    <style>

        body {

            margin: 0;

        }

        .menu {

            height: 48px;

            background-color: black;

            position: fixed;

            top: 0;

            left: 0;

            right: 0;

        }

        .content {

            margin-top: 50px;

            height: 5000px;

            background-color: beige;

        }

    </style>

</head>

<body>

<div class="menu">菜单栏</div>

<div class="content">内容页</div>

</body>

</html>

position固定菜单栏的更多相关文章

  1. VC++单文档程序固定菜单栏和工具栏

    MainFrm.cpp框架类下,找到OnCreate方法 m_wndMenuBar.EnableDocking(CBRS_ALIGN_ANY); m_wndToolBar.EnableDocking( ...

  2. <html> ---- position

    position 固定的属性,是全局的.和DIV层次无关. <!DOCTYPE html> <html lang="en"> <head> &l ...

  3. Python开发【前端】：CSS

    css样式选择器 标签上设置style属性: <body> <div style="background-color: #2459a2;height: 48px;" ...

  4. jQuery.stickUp插件重构

    stickUp插件用于实现固定菜单栏效果,原理很简单,说白了就是监听document的scroll事件,滚动到特定值时,将特定元素的position设置为fixed,核心代码如下:   $(docum ...

  5. DOM+Javascript一些实例

    1.内容+遮罩层+悬浮对话框 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  6. 【前端】:css

    前言: 关于前端的第二篇博客,会写关于css的,内容比较基础.写完这篇博客,会做一个类似美乐乐家具的界面.good luck to me~ 一.css-引用样式 标签上设置style属性: <b ...

  7. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  8. Web前端学习——CSS

    一.CSS简介CSS全称cascading style sheeding,层叠样式列表.CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化.二.CSS组成1.选择器(1) ...

  9. CSS基础--常用样式

    一.背景相关 背景颜色 background-color :颜色名称/rgb值/十六进制值 背景图片 background-image :url('') 背景图片平铺方式 background-rep ...

随机推荐

  1. Android内存优化5 了解java GC 垃圾回收机制3

    引言 接App优化之内存优化(序), 作为App优化系列中内存优化的一个小部分. 由于内存相关知识比较生涩, 内存优化中使用到的相关工具, 也有很多专有名词. 对Java内存管理, GC, Andro ...

  2. 支持向量机（SVM）介绍

    一.了解支持向量机   支持向量机(support vector machings, SVM) 是一种二分类模型,其基本模型定义为特征空间上的间隔最大的线性分类器,其学习策略便是间隔最大化,最终可转化 ...

  3. 探讨android更新UI的几种方法(转)

    作为IT新手,总以为只要有时间,有精力,什么东西都能做出来.这种念头我也有过,但很快就熄灭了,因为现实是残酷的,就算一开始的时间和精力非常充足,也会随着项目的推进而逐步消磨殆尽.我们会发现,自己越来越 ...

  4. java--生成实体类方法

    由于工作中使用eclipse开发,没有安装hibernate插件,所以无法使用自动生成实体类的功能,为了方便在网上找了段别人写的自动生成实体类方法,稍加修改,直接运行就可以生成对应表的实体类. 注意使 ...

  5. fc游戏反编译流程

    最近打算玩一下nes游戏,重拾一下6502汇编. 摸索了几天,觉得下面这个反汇编的流程比较好: 用 fceux 载入游戏,选择debug菜单Code/Data Logger,点击Start,稍微玩一下 ...

  6. JOptionPane的经常使用4种对话框

    JOptionPane类有4个用于显示对话框的静态方法: 消息.选项.确认,输入对话框 showMessageDialog://显示一条消息并等待用户OK showConfirmDialog://显示 ...

  7. Style对象之一

    <html> <style type="text/css"> body{ background-color="#FFCC80"; bac ...

  8. org.eclipse.e4.core.di.InjectionException:org.eclipse.swt.SWTException: Widget is disposed

    org.eclipse.e4.core.di.InjectionException:org.eclipse.swt.SWTException: Widget is disposed 开发环境为ecli ...

  9. 详细解说 STL 排序(Sort)（转）

    作者Winter 详细解说 STL 排序(Sort) 0 前言: STL,为什么你必须掌握 1 STL提供的Sort 算法 1.1 所有sort算法介绍 1.2 sort 中的比较函数 1.3 sor ...

  10. c++11 Using Callable Objects, std::thread, std::bind, std::async, std::call_once