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. 把网页转换成图片或者pdf--wkhtmltopdf

    一.下载并安装wkhtmltopdf https://wkhtmltopdf.org/downloads.html 按照需要自己下载安装就可以了: 二.使用步骤--启动和生成图片或pdf 1.下载wk ...

  2. 定制你自己的CRF模型

    如何训练自己的CRF模型 Ansj从5.0版本之后支持训练自己的crf模型,在此之前虽然已经很早支持了CRF模型,但是在用户的自训练上要求苛刻,而且本身实现的CRF从性能到准确率都不如CRF++或者第 ...

  3. web.xml文件的作用及基本配置

    Java的web工程中的web.xml文件有什么作用呢?它是每个web工程都必须的吗? 一个web中完全可以没有web.xml文件,也就是说,web.xml文件并不是web工程必须的. 那什么时候需要 ...

  4. Delphi中Frame的使用方法（1）

    Frame是组件面板上的第一个组件,但不是每个人都知道怎么用它,因为它不像Button和Label一样简单明了.实际上,Frame按钮只是打开一个Frame的列表,如果你没有创建任何的Frame,自然 ...

  5. DevExpress 小计 GridControl 隔行换行

    摘自: http://www.cnblogs.com/yuerdongni/archive/2012/09/08/2676753.html 1. 如何解决单击记录整行选中的问题 View->Op ...

  6. 开发 nodejs REST 个人感想

    本来想拿 nodejs 做个 ip 查询小应用的,做的时候想着把基础弄好再做应用,没想到做着做着就变成 spring 了 可能太多数人觉得不知道怎么用,以后我会写详细点使用教程 个人感觉自己做出来的东 ...

  7. js 在表单提交前进行操作

    最近在写页面的时候,需要手动写一些在表单进行提交前的验证操作,正好看到了2种阻止表单提交的方法,可以进行一些逻辑处理 方法一:使用return false 原生js写法: <form id=&q ...

  8. Spring 自定义配置类bean

    <!-- 引入配置文件 --> <bean id="propertyConfigurer" class="org.springframework.bea ...

  9. MVC工作原理

    MVC(Model-View-Controller,模型—视图—控制器模式)用于表示一种软件架构模式.它把软件系统分为三个基本部分:模型(Model),视图(View)和控制器(Controller) ...

  10. android适配的努力

    1. 优测 http://utest.qq.com/ 2. 云测 3. 阿里云移动 4. 百度移动测试.