༺初辰༻
༺初辰༻

前端布局面典型案例 面试题

前端布局典型案例

一、题目要求及页面效果示意图

  • 1）如下图布局，分为上下两栏，下面一栏又分左右两栏。上栏宽度为100%、高度为200px，下栏左侧栏宽度为100px，下栏右侧栏根据页面宽度自适应。请写出具体的HTML和css代码。
  • 2）当浏览器宽度减少到700px后，顶部栏高度变为50px，下栏左侧栏消失，下栏右侧栏宽度为100%。
    前端布局面典型案例 面试题_第1张图片

二、考点分析

  • 基础的布局知识，可以用伸缩布局和定位等多种方法实现。
  • 媒体查询，媒体查询根据屏幕尺寸的变化进行动态适配，语法为 @media (条件) {}。

三、解答代码

1）定位写法


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>面试题title>
    <style>
        * {
      
            margin: 0;
            padding: 0;
        }
        @media (min-width: 701px) {
      
            .topbox {
      
                width: 100%;
                height: 200px;
                background-color: #33ccff;
            }
            .leftbox {
      
                width: 100px;
                position: absolute;
                top: 200px;
                left: 0;
                bottom: 0;
                background-color: #ffcc99;
            }
            .rightbox {
      
                position: absolute;
                top: 200px;
                left: 100px;
                right: 0;
                bottom: 0;
                background-color: #da84db;
            }
        }
        @media (max-width: 700px) {
      
            .topbox {
      
                width: 100%;
                height: 50px;
                background-color: #33ccff;
            }
            .leftbox {
      
                display: none;
            }
            .rightbox {
      
                width: 100%;
                position: absolute;
                top: 50px;
                bottom: 0;
                background-color: #da84db;
            }
        }
    style>
head>
<body>
    <div class="topbox">上栏div>
    <div class="bottombox">
        <div class="leftbox">下栏左侧栏div>
        <div class="rightbox">下栏右侧栏div>
    div>
body>
html>

2）伸缩布局写法


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>面试题title>
    <style>
        * {
      
            margin: 0;
            padding: 0;
            height: 100%;
        }
        body{
      
            display: flex;
            flex-direction:column;
            justify-content: space-between;
            height: 100%;
        }
        @media (min-width: 701px) {
      
            .topbox {
      
                width: 100%;
                height: 200px;
                background-color: #33ccff;
            }
            .bottombox{
      
                display: flex;
                justify-content: space-between;
                flex-grow: 1;
            }
            .leftbox {
      
                width: 100px;
                height: 100%;
                background-color: #ffcc99;
            }
            .rightbox {
      
                height: 100%;
                background-color: #da84db;
                flex-grow: 1;
            }
        }
        @media (max-width: 700px) {
      
            .topbox {
      
                width: 100%;
                height: 50px;
                background-color: #33ccff;
            }
            .leftbox {
      
                display: none;
            }
            .rightbox {
      
                width: 100%;
                flex-grow: 1;
                background-color: #da84db;
            }
        }
    style>
head>
<body>
    <div class="topbox">上栏div>
    <div class="bottombox">
        <div class="leftbox">下栏左侧栏div>
        <div class="rightbox">下栏右侧栏div>
    div>
body>
html>

四、页面展示

前端布局面典型案例 面试题_第2张图片

你可能感兴趣的:(web前端,css,面试)

  • selenium+pytest自动化脚本生成报告乱码问题 xiaobawang001 seleniumpytest自动化
    在运行pytest生成报告的时候，中文会显示为？如下图尝试多种修改conftest的编码格式后，未能成功，最终直接修改python路径\Lib\site-packages\pytest_html内的html_report.py将这句head=html.head(html.meta(charset="utf-8"),html.title(self.title),html_css)修改为：head=h
  • 2022年最新【Java八股文背诵版面试题】面试必备，查漏补缺；多线程+spring+JVM调优+分布式+redis+算法 Java面试_ Javajava面试jvm
    前言春招，秋招，社招，我们Java程序员的面试之路，是挺难的，过了HR，还得被技术面，小刀在去各个厂面试的时候，经常是通宵睡不着觉，头发都脱了一大把，还好最终侥幸能够入职一个独角兽公司，安稳从事喜欢的工作至今...近期也算是抽取出大部分休息的时间，为大家准备了一份通往大厂面试的小捷径，准备了一整套Java复习面试的刷题以及答案，我知道很多同学不知道怎么复习，不知道学习过程中哪些才是重点，其实，你们
  • 运维面试常问的100道题（大数据统计） m0_67403143 面试学习路线阿里巴巴运维面试大数据
    一、基础知识类1、请解释什么是运维？运维是指对企业的IT系统进行运行维护，包括硬件设备、软件系统、网络等的监控、管理、优化和故障处理，以确保系统的稳定、高效运行，满足业务需求。2、简述运维的主要职责有哪些？服务器的安装、配置、维护和监控。网络设备的管理和维护。数据库的管理和维护。应用系统的部署、升级和维护。故障处理和应急响应。性能优化和容量规划。安全管理和漏洞修复。3、什么是服务器？有哪些类型？服
  • 影视仓—2025年最新源接口，最强大便捷的影视盒子工具 SunnyRun！ 智能电视电视盒子tvbox影视仓影视仓最新接口源2025影视仓最新接口电视安装三方软件
    《前端开发面试题进阶秘籍》：前端登顶-前端知识点梳理小米盒子丨小米丨红米电视安装第三方软件教程！华为荣耀电视智慧屏安装第三方软件教程！天猫魔盒安装第三方软件、设置第三方软件自启方法！海信电视安装第三方软件通用教程！创维电视安装第三方软件！影视仓配置教程与使用小技巧！影视仓最新接口,2025免费API接口,TVBox源,影视仓源,4K配置接口,免费数据调用,绛州速寄,五折快递,寄大件物流,TV盒子配
  • java 高级工程师面试题集锦,持续更新~ aifans_bert java学习java开发语言后端
    找大厂面试题,看套路!Java面试题及答案及面试解析说到找工作,你认为现在最重要的事情是什么?当然找大厂面试题,看套路!以下面试题就是小编为大家准备的,希望对大家有用!1.面向对象的特征请阅读严宏博士的Java模式或设计模式解释中的桥梁模式)。封装:一般认为封装是将数据和操作数据的方法绑定起来,数据的访问只能通过定义。吐血总结!50道Python面试题集锦(附答案)这些面试题涉及Python基础知
  • 2021 React面试题知识点很全面 尘之微识 react.js面试
    一，什么是虚拟DOM？虚拟DOM（VDOM）它是真实DOM的内存表示,一种编程概念，一种模式。它会和真实的DOM同步，比如通过ReactDOM这种库，这个同步的过程叫做调和(reconcilation)。虚拟DOM更多是一种模式，不是一种特定的技术。二，类组件和函数组件之间有什么区别？类组件（Classcomponents）无论是使用函数或是类来声明一个组件，它决不能修改它自己的props。所有R
  • 2024年Python最全用Python制作一个自动抢票脚本_python抢票脚本，Python面试项目全代码 Android失眠夜 程序员python学习面试
    网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化学习资料的朋友，可以戳这里获取一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！classConcert:def__init__(
  • 【面试】【程序员基本知识】计算机网络，设计模式，正则，安全 患得患失949 面试考题专栏（前后端）安全面试计算机网络
    一、计算机网络（一）基本概念计算机网络是一种将多台计算机通过硬件和软件互联，以实现资源共享和数据传输的技术。组成部分：(1)硬件：路由器、交换机、网卡、光纤等。(2)软件：协议栈、操作系统、网络应用等。（二）网络分层模型OSI七层模型(1)物理层：负责数据的物理传输。(2)数据链路层：提供节点间的数据传输。(3)网络层：负责路由与寻址（如IP协议）。(4)传输层：提供端到端的通信（如TCP/UDP
  • 【Java程序员面试专栏 数据结构】五 高频面试算法题：二叉树 存在morning Java程序员技术栈#二叉树java面试算法
    一轮的算法训练完成后，对相关的题目有了一个初步理解了，接下来进行专题训练，以下这些题目就是二叉树相关汇总的高频题目总的来说，前序遍历是自上而下调整或比较节点，中序遍历用来对节点排序，后序遍历是自下而上的寻找或求最值供上层决策，这里的上下指的是树的层高题目关键字解题思路时间空间二叉树的前序遍历DFS-前序遍历按照根左右的顺序进行递归，补充迭代思路，依赖辅助栈O(n)O(n)二叉树的中序遍历DFS-中
  • How to learn html？基于chatGLM-b生成示例（仅供参考） 不是吧这都有重名 html前端
    如何学习HTML目录章节11.1.HTML基础概念章节22.1.HTML文档结构章节33.1.HTML基本标签章节44.1.HTML文本格式化章节55.1.HTML列表和表格章节66.1.HTML表单和输入章节77.1.HTML图片和多媒体章节88.1.HTML链接与导航章节99.1.HTML样式与CSS的基本应用章节1010.1.HTML常用属性与属性标签章节1111.1.HTML注释与特殊字符
  • c++数据结构面试题 c++代码诗人 c/c++面试题c语言c++
    测试题一、C语言部分：1、爱因斯坦出了一道这样的数学题：有一条长阶梯，若每步跨2阶，则最后剩一阶，若每步跨3阶，则最后剩2阶，若每步跨5阶，则最后剩4阶，若每步跨6阶则最后剩5阶。只有每次跨7阶，最后才正好一阶不剩。请问这条阶梯至少有多少阶？（5分）2、一球从100米高度自由落下，每次落地后，反弹回原高度的一半，再下落，编写程序，输入下落次数，便知此次下落后的反弹高度。（5分）3、有5个人坐在一起
  • C++: 二叉树进阶面试题 酷酷学!!! C++刷题指南c++开发语言算法leetcode数据结构
    做每件事之前都心存诚意,就会事半功倍.目录前言1.根据二叉树创建字符串2.二叉树的层序遍历Ⅰ3.二叉树的层序遍历Ⅱ4.二叉树的最近公共祖先5.二叉搜索树与双向链表6.根据一棵树的前序遍历与中序遍历构造二叉树7.根据一棵树的中序遍历与后序遍历构造二叉树8.二叉树的前序遍历，非递归迭代实现9.二叉树中序遍历，非递归迭代实现10.二叉树的后序遍历，非递归迭代实现前言一些面试中可能会遇到的二叉树的进阶题目
  • Oracle和Mysql数据库使用Where 1=1 会使索引失效吗？ 小小鱼儿小小林 #mysql面试宝典#oracle基础面试这样回答mysqloracle索引
    该文章专注于面试，面试只要回答关键点即可，不需要对框架有非常深入的回答，如果你想应付面试，是足够了，抓住关键点面试官：Oracle和Mysql数据库使用Where1=1会使索引失效吗"WHERE1=1"通常被用作一个占位条件，在动态生成SQL语句时非常有用。它可以作为一个基本的WHERE条件，然后根据需要动态添加其他条件。这样在代码层面可以少做很多的判断，不然代码里面一堆的ifelse在我们日常开
  • 如何编写一个MyBatis插件？ java1234_小锋 javajava开发语言
    大家好，我是锋哥。今天分享关于【Redis为什么这么快?】面试题。希望对大家有帮助；如何编写一个MyBatis插件？1000道互联网大厂Java工程师精选面试题-Java资源分享网编写MyBatis插件需要使用MyBatis提供的插件接口，MyBatis插件机制允许你在执行SQL语句时拦截MyBatis的SQL过程，从而自定义SQL执行的行为。插件主要用于以下几个场景：记录日志性能监控权限控制SQ
  • 怎么实现Redis的高可用？ java1234_小锋 javaredis数据库缓存
    大家好，我是锋哥。今天分享关于【请介绍一些常用的Java负载均衡算法，以实现高并发和高可用性?】面试题。希望对大家有帮助；怎么实现Redis的高可用？1000道互联网大厂Java工程师精选面试题-Java资源分享网要实现Redis的高可用性，通常有以下几种常见的方案。每种方案都能确保Redis在面对故障时仍能持续提供服务。以下是实现Redis高可用的几种常见方法：1.RedisSentinelRe
  • 题解 | #武汉工程大学第六届ACM程序设计竞赛（同步赛）# 2301_79125431 java
    各位，如果来了，就来了，别慌了，看命吧，各位，如果来了，就来了，别慌了，看命吧，慌改变不了什么，还是要打工吃饭的。#铜五铁六真的存在吗？(51062)##铜五铁六真的存在吗？#我选铜五必存！#牛客帮帮团来啦！有问必答(50227)#牛客帮帮团来啦！有问必答#25届双非java后端求助。请问各位大佬，现在双非后端很难进大厂，所以杭州亚信科技26号做的笔试，有牛友收到面试通知了吗本菜鸟双非零实习零竞赛
  • RDD 算子全面解析：从基础到进阶与面试要点 天冬忘忧 Sparkspark大数据
    Spark的介绍与搭建：从理论到实践_spark环境搭建-CSDN博客Spark的Standalone集群环境安装与测试-CSDN博客PySpark本地开发环境搭建与实践-CSDN博客Spark程序开发与提交：本地与集群模式全解析-CSDN博客SparkonYARN：Spark集群模式之Yarn模式的原理、搭建与实践-CSDN博客Spark中RDD的诞生：原理、操作与分区规则-CSDN博客Spar
  • 360大数据面试题及参考答案 大模型大数据攻城狮 大数据数据治理jvm内存CAS数据开发指标开发数据分析
    数据清理有哪些方法？数据清理是指发现并纠正数据文件中可识别的错误，包括检查数据一致性，处理无效值和缺失值等。常见的数据清理方法有以下几种：去重处理：数据中可能存在重复的记录，这不仅会占用存储空间，还可能影响分析结果。通过对比每条记录的关键属性，若所有关键属性值都相同，则判定为重复记录，可保留其中一条，删除其余重复项。例如在客户信息表中，若有两条记录客户姓名、联系方式、地址等关键信息都一样，就可进行
  • 可爱狗狗的404动画页面HTML源码 酷爱码 htmlhtml5前端
    源码介绍可爱狗狗的404动画页面HTML源码，源码由HTML+CSS+JS组成，记事本打开源码文件可以进行内容文字之类的修改，双击html文件可以本地运行效果效果预览源码获取可爱狗狗的404动画页面HTML源码
  • 由于直接提供完整的游戏商城代码超出了简单回答的范围，并且游戏商城的实现可以相当复杂，涉及前端展示、后端逻辑、数据库设计等多个方面，我会分别用几种流行的编程语言和技术栈概述如何开始搭建一个基本的游戏商城 编程小飞侠a 游戏前端数据库
    前端（HTML/CSS/JavaScript+React）React示例:fengbaoshun.com首先，你需要安装Node.js和npm（Node包管理器），然后使用CreateReactApp来快速启动你的前端项目。bashnpxcreate-react-appgame-store-frontendcdgame-store-frontendnpmstart接下来，你可以使用React组件来
  • 由于直接提供完整的大型项目代码（如购物商城）在单一回答中是不切实际的，我将为你概述如何在几种流行的编程语言中设置购物商城的基本框架和思路。这包括前端（如HTML/CSS/JavaScript）和后端（ SigridFelix 前端htmlcss
    前端（HTML/CSS/JavaScript）dz61.comHTML:创建基础的页面结构，如主页、商品列表页、购物车页和结账页。html我的购物商城欢迎来到我的购物商城商品列表购物车CSS:简单的样式表，用于美化页面。css/*styles.css*/body{font-family:Arial,sans-serif;}h1{color:#333;}ul{list-style-type:none
  • leetcode 面试经典 150 题：有效的括号 码流怪侠 #leetcode面试算法有效的括号栈stackc++
    链接有效的括号题序号20题型字符串解法栈难度简单熟练度✅✅✅题目给定一个只包括‘(’，‘)’，‘{’，‘}’，‘[’，‘]’的字符串s，判断字符串是否有效。有效字符串需满足：左括号必须用相同类型的右括号闭合。左括号必须以正确的顺序闭合。每个右括号都有一个对应的相同类型的左括号。示例1：输入：s=“()”输出：true示例2：输入：s=“()[]{}”输出：true示例3：输入：s=“(]”输出：f
  • Monorepo 在网易的工程改造实践 若川视野 前端javascriptnpmvue.js开发语言
    大家好，我是若川。我持续组织了近一年的源码共读活动，感兴趣的可以点此扫码加我微信lxchuan12参与，每周大家一起学习200行左右的源码，共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》包含20余篇源码文章。历史面试系列。另外：目前建有江西|湖南|湖北籍前端群，可加我微信进群。背景目前云音乐内有多个RN收银台场景分布在不同的工程，比如页面收银台，浮层收银台，个性收银台等，后续可能还会有别
  • Redis分布式锁 赶路人儿 nosql分布式锁
    Redis分布式锁分布式锁在很多场景中是非常有用的原语，不同的进程必须以独占资源的方式实现资源共享就是一个典型的例子。有很多分布式锁的库和描述怎么实现分布式锁管理器（DLM)的博客,但是每个库的实现方式都不太一样，很多库的实现方式为了简单降低了可靠性，而有的使用了稍微复杂的设计。这个页面试图提供一个使用Redis实现分布式锁的规范算法。我们提出一种算法，叫Redlock,我们认为这种实现比普通的单
  • HTML+CSS初学 （day3） 灵封～ html前端css
    HTML，全称为超文本标记语言（HyperTextMarkupLanguage），是一种用于创建网页的标准标记语言。HTML是构建Web页面的基础，它使用一系列称为标签的关键字来定义页面的结构。一、HTML的基本概念定义：HTML通过标签来描述网页中的各个元素，如标题、段落、图片、链接等。这些标签告诉浏览器如何显示内容，包括文字、图片、视频等。作用：定义网页的结构和内容，使网页内容能够按照预定的格
  • Thymeleaf基础知识语法 沐暖沐 thymeleaf开发语言
    1、简介Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎，能够处理HTML、XML、JavaScript、CSS、TEXT、RAW这六种模板。这六种模版模式包含两种标记模板模式（HTML和XML），三种⽂本模板模式（TEXT，JAVASCRIPT和CSS）和⼀个⽆操作模板模式（RAW）。①简单表达式变量表达式：${…}选择变量表达式：*{…}消息表达：#{…}链接URL表达式
  • 阿里、字节：一套高效的iOS面试题（修正版） 侃侃而谈。句句是你 八卦及经验分享面试javaandroidpythonios
    简述笔者最近收集梳理了一些iOS相关的问题，其中大部分都是大厂面试或者面试其他人用到的，能命中大部分的面试和日常工作，更希望你可以用它来检验自己由于问题量太大，本文只是给了问题，希望发挥圈友的动手能力，自己去探索下，也可以在下方进行评论回复你的答案或者提出更高质量的问题！！！runtime相关问题runtime是iOS开发最核心的知识了，如果下面的问题都解决了，那么对runtime的理解已经很深了
  • 工程化概述 WJP丶 前端工程化实战前端工程化概述
    工程化的定义和主要解决的问题前端工程化指遵循一定的规范，通过工具提升效率，降低成本的一种手段。前端日常开发遇到的问题想要使用ES6+新特性，但是兼容性有问题想要使用Less/Sass/PostCss增强css编程性，但是运行环境不能直接支持想要使用模块化的方式提高项目的可维护性，但是运行环境不能直接支持部署上线前需要手动压缩代码及资源文件、部署过程需要手动上传代码到服务器多人协作开发，无法硬性同一
  • 字节iOS面试经验分享：HTTP与网络编程 LucianaiB 网络ios面试
    字节iOS面试经验分享：HTTP与网络编程嗨，我是LucianaiB！总有人间一两风，填我十万八千梦。路漫漫其修远兮，吾将上下而求索。目录字节iOS面试经验分享：HTTP与网络编程HTTP协议简介iOS中HTTP请求的实现原理HTTPS与HTTP的区别TCP与UDP的区别三次握手四次挥手Cookie与Session流量控制与拥塞控制虚拟内存多线程并发访问共享资源iOS中线程数量的限制堆和栈的区别a
  • web自动化——前端知识 大哥喝阔落 前端自动化运维
    是HTML中的一个元素，用于在当前网页中嵌入另一个网页或文档。它就像一个“窗口”，可以在页面中显示其他内容。主要特点：嵌入外部内容：可以在网页中嵌入其他网页、视频、地图等。独立上下文：嵌入的内容与主页面相互独立，拥有自己的JavaScript和CSS环境。可定制：可以通过属性调整大小、边框等。常用属性：src：指定要嵌入内容的URL。width和height：设置iframe的宽度和高度。fram
  • 矩阵求逆（JAVA）初等行变换 qiuwanchi 矩阵求逆（JAVA）
    package gaodai.matrix; import gaodai.determinant.DeterminantCalculation; import java.util.ArrayList; import java.util.List; import java.util.Scanner; /** * 矩阵求逆(初等行变换) * @author 邱万迟 *
  • JDK timer antlove javajdkschedulecodetimer
    1.java.util.Timer.schedule(TimerTask task, long delay)：多长时间（毫秒）后执行任务 2.java.util.Timer.schedule(TimerTask task, Date time)：设定某个时间执行任务 3.java.util.Timer.schedule(TimerTask task, long delay,longperiod
  • JVM调优总结 -Xms -Xmx -Xmn -Xss coder_xpf jvm应用服务器
    堆大小设置JVM 中最大堆大小有三方面限制：相关操作系统的数据模型（32-bt还是64-bit）限制；系统的可用虚拟内存限制；系统的可用物理内存限制。32位系统下，一般限制在1.5G~2G；64为操作系统对内存无限制。我在Windows Server 2003 系统，3.5G物理内存，JDK5.0下测试，最大可设置为1478m。 典型设置： java -Xmx
  • JDBC连接数据库 Array_06 jdbc
    package Util; import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; public class JDBCUtil { //完
  • Unsupported major.minor version 51.0（jdk版本错误） oloz java
    java.lang.UnsupportedClassVersionError: cn/support/cache/CacheType : Unsupported major.minor version 51.0 (unable to load class cn.support.cache.CacheType) at org.apache.catalina.loader.WebappClassL
  • 用多个线程处理1个List集合 362217990 多线程threadlist集合
      昨天发了一个提问，启动5个线程将一个List中的内容，然后将5个线程的内容拼接起来，由于时间比较急迫，自己就写了一个Demo，希望对菜鸟有参考意义。。 import java.util.ArrayList; import java.util.List; import java.util.concurrent.CountDownLatch; public c
  • JSP简单访问数据库 香水浓 sqlmysqljsp
    学习使用javaBean，代码很烂，仅为留个脚印 public class DBHelper { private String driverName; private String url; private String user; private String password; private Connection connection; privat
  • Flex4中使用组件添加柱状图、饼状图等图表 AdyZhang Flex
    1.添加一个最简单的柱状图 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <?xml version= "1.0"&n
  • Android 5.0 - ProgressBar 进度条无法展示到按钮的前面 aijuans android
    在低于SDK < 21 的版本中，ProgressBar 可以展示到按钮前面，并且为之在按钮的中间，但是切换到android 5.0后进度条ProgressBar 展示顺序变化了，按钮再前面，ProgressBar 在后面了我的xml配置文件如下：   [html]  view plain copy   <RelativeLa
  • 查询汇总的sql baalwolf sql
    select   list.listname, list.createtime,listcount from dream_list as list ,   (select listid,count(listid) as listcount  from dream_list_user  group by listid  order by count(
  • Linux du命令和df命令区别 BigBird2012 linux
            1，两者区别             du，disk usage,是通过搜索文件来计算每个文件的大小然后累加，du能看到的文件只是一些当前存在的，没有被删除的。他计算的大小就是当前他认为存在的所有文件大小的累加和。        
  • AngularJS中的$apply，用还是不用？ bijian1013 JavaScriptAngularJS$apply
            在AngularJS开发中，何时应该调用$scope.$apply()，何时不应该调用。下面我们透彻地解释这个问题。         但是首先，让我们把$apply转换成一种简化的形式。         scope.$apply就像一个懒惰的工人。它需要按照命
  • [Zookeeper学习笔记十]Zookeeper源代码分析之ClientCnxn数据序列化和反序列化 bit1129 zookeeper
    ClientCnxn是Zookeeper客户端和Zookeeper服务器端进行通信和事件通知处理的主要类，它内部包含两个类，1. SendThread 2. EventThread， SendThread负责客户端和服务器端的数据通信，也包括事件信息的传输，EventThread主要在客户端回调注册的Watchers进行通知处理   ClientCnxn构造方法   &
  • 【Java命令一】jmap bit1129 Java命令
    jmap命令的用法：   [hadoop@hadoop sbin]$ jmap Usage: jmap [option] <pid> (to connect to running process) jmap [option] <executable <core> (to connect to a
  • Apache 服务器安全防护及实战 ronin47
    此文转自IBM. Apache 服务简介 Web 服务器也称为 WWW 服务器或 HTTP 服务器 (HTTP Server)，它是 Internet 上最常见也是使用最频繁的服务器之一，Web 服务器能够为用户提供网页浏览、论坛访问等等服务。 由于用户在通过 Web 浏览器访问信息资源的过程中，无须再关心一些技术性的细节，而且界面非常友好，因而 Web 在 Internet 上一推出就得到
  • unity 3d实例化位置出现布置？ brotherlamp unity教程unityunity资料unity视频unity自学
    问：unity 3d实例化位置出现布置？ 答：实例化的同时就可以指定被实例化的物体的位置,即 position  Instantiate (original : Object, position : Vector3, rotation : Quaternion) : Object 这样你不需要再用Transform.Position了,   如果你省略了第二个参数(
  • 《重构，改善现有代码的设计》第八章 Duplicate Observed Data bylijinnan java重构
    import java.awt.Color; import java.awt.Container; import java.awt.FlowLayout; import java.awt.Label; import java.awt.TextField; import java.awt.event.FocusAdapter; import java.awt.event.FocusE
  • struts2更改struts.xml配置目录 chiangfai struts.xml
    struts2默认是读取classes目录下的配置文件，要更改配置文件目录，比如放在WEB-INF下，路径应该写成../struts.xml(非/WEB-INF/struts.xml) web.xml文件修改如下：   <filter> <filter-name>struts2</filter-name> <filter-class&g
  • redis做缓存时的一点优化 chenchao051 redishadooppipeline
            最近集群上有个job，其中需要短时间内频繁访问缓存，大概7亿多次。我这边的缓存是使用redis来做的，问题就来了。       首先，redis中存的是普通kv，没有考虑使用hash等解结构，那么以为着这个job需要访问7亿多次redis，导致效率低，且出现很多redi
  • mysql导出数据不输出标题行 daizj mysql数据导出去掉第一行去掉标题
    当想使用数据库中的某些数据，想将其导入到文件中，而想去掉第一行的标题是可以加上-N参数 如通过下面命令导出数据： mysql -uuserName -ppasswd -hhost -Pport -Ddatabase -e " select * from tableName"  > exportResult.txt 结果为： studentid
  • phpexcel导出excel表简单入门示例 dcj3sjt126com PHPExcelphpexcel
    先下载PHPEXCEL类文件，放在class目录下面，然后新建一个index.php文件，内容如下 <?php error_reporting(E_ALL); ini_set('display_errors', TRUE); ini_set('display_startup_errors', TRUE);   if (PHP_SAPI == 'cli') die('
  • 爱情格言 dcj3sjt126com 格言
     1) I love you not because of who you are, but because of who I am when I am with you. 　　 我爱你，不是因为你是一个怎样的人，而是因为我喜欢与你在一起时的感觉。 　　2) No man or woman is worth your tears, and the one who is, won‘t
  • 转 Activity 详解——Activity文档翻译 e200702084 androidUIsqlite配置管理网络应用
    activity 展现在用户面前的经常是全屏窗口，你也可以将 activity 作为浮动窗口来使用（使用设置了 windowIsFloating 的主题），或者嵌入到其他的 activity （使用 ActivityGroup ）中。 当用户离开 activity 时你可以在 onPause() 进行相应的操作 。更重要的是，用户做的任何改变都应该在该点上提交 ( 经常提交到 ContentPro
  • win7安装MongoDB服务 geeksun mongodb
    1.  下载MongoDB的windows版本：mongodb-win32-x86_64-2008plus-ssl-3.0.4.zip，Linux版本也在这里下载，下载地址： http://www.mongodb.org/downloads   2.  解压MongoDB在D:\server\mongodb, 在D:\server\mongodb下创建d
  • Javascript魔法方法:__defineGetter__,__defineSetter__ hongtoushizi js
    转载自： http://www.blackglory.me/javascript-magic-method-definegetter-definesetter/ 在javascript的类中,可以用defineGetter和defineSetter_控制成员变量的Get和Set行为 例如,在一个图书类中,我们自动为Book加上书名符号: function Book(name){
  • 错误的日期格式可能导致走nginx proxy cache时不能进行304响应 jinnianshilongnian cache
    昨天在整合某些系统的nginx配置时，出现了当使用nginx cache时无法返回304响应的情况，出问题的响应头： Content-Type:text/html; charset=gb2312 Date:Mon, 05 Jan 2015 01:58:05 GMT Expires:Mon , 05 Jan 15 02:03:00 GMT Last-Modified:Mon, 05
  • 数据源架构模式之行数据入口 home198979 PHP架构行数据入口
    注：看不懂的请勿踩，此文章非针对java，java爱好者可直接略过。   一、概念 行数据入口（Row Data Gateway）：充当数据源中单条记录入口的对象，每行一个实例。   二、简单实现行数据入口 为了方便理解，还是先简单实现： <?php /** * 行数据入口类 */ class OrderGateway { /*定义元数
  • Linux各个目录的作用及内容 pda158 linux脚本
    1）根目录“/” 　　根目录位于目录结构的最顶层，用斜线（/）表示，类似于 Windows 操作系统的“C:\“，包含Fedora操作系统中所有的目录和文件。 　　2）/bin 　　/bin 　　目录又称为二进制目录，包含了那些供系统管理员和普通用户使用的重要 linux命令的二进制映像。该目录存放的内容包括各种可执行文件，还有某些可执行文件的符号连接。常用的命令有：cp、d
  • ubuntu12.04上编译openjdk7 ol_beta HotSpotjvmjdkOpenJDK
    获取源码 从openjdk代码仓库获取(比较慢) 安装mercurial Mercurial是一个版本管理工具。 sudo apt-get install mercurial 将以下内容添加到$HOME/.hgrc文件中，如果没有则自己创建一个： [extensions] forest=/home/lichengwu/hgforest-crew/forest.py fe
  • 将数据库字段转换成设计文档所需的字段 vipbooks 设计模式工作正则表达式
            哈哈，出差这么久终于回来了，回家的感觉真好！         PowerDesigner的物理数据库一出来，设计文档中要改的字段就多得不计其数，如果要把PowerDesigner中的字段一个个Copy到设计文档中，那将会是一件非常痛苦的事情。
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他