weixin_30278311
weixin_30278311

rem布局简介

移动端常见布局：

　　1.流式布局

　　高度固定，宽度自适应

　　2.响应式布局

　　能够用一套代码适应不同尺寸屏幕

　　3.rem布局

　　宽高自适应，能实现整个页面像一张图片一样缩放且不失真的效果。

rem布局：

  • em：是一个相对单位，计算方法为用元素的带px属性值除以自身字体大小，用的很少。
  • rem:是一个相对单位，计算方法为一个html文件中任意元素的带px属性值除以根元素html的字体大小，从而实现宽高自适应。

简单实例:

　　1.em布局

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Documenttitle>
  <style>
    div {
      font-size: 100px;
      width: 4em; /* 400px */
      height: 4em; /* 400px */
      background-color: pink;
    }
  style>
head>
<body>
  <div>我是400*400的盒子div>
body>
html>

　　效果如图：div内字体大小为100px

rem布局简介_第1张图片

　　2.rem布局

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Documenttitle>
  <style>
    html {
      font-size: 100px;
    }
    div {
      font-size: 16px;
      width: 4rem; /* 400px */
      height: 4rem; /* 400px */
      background-color: pink;
    }
  style>
head>
<body>
  <div>我是400*400的盒子div>
body>
html>

　　效果如图：div内字体大小为16px

rem布局简介_第2张图片

rem布局实现自适应:

　　1.配合媒体查询

DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Titletitle>
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <style>
    /* 一个盒子, 在 750 屏幕上显示 200*200,   在375屏幕上显示 100*100 */
    
    /* 375px屏幕中, font-size: 50px */
    @media screen and (width: 375px){
      html {
        font-size: 50px;
      }
    }
    /* 750px屏幕中, font-size: 100px */
    @media screen and (width: 750px){
      html {
        font-size: 100px;
      }
    }
    div {
      width: 2rem;
      height: 2rem;
      background-color: pink;
    }
  style>
head>
<body>
  <div>div>
body>
html>

　　2.通过javascript实现

DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Titletitle>
  <style>
    body {
      font-size: 16px;
    }
    /* 设计图尺寸 640px  基准值 100px */
    div {
      width: 2rem;
      height: 2rem;
      font-size: .3rem;
      background-color: pink;
    }
  style>
head>
<body>
  <div>我是自适应的文字div>
  <script>
    var design = 640;
    var base = 100;
    function responsive() {
      var width = window.innerWidth;
      // 所求font-size = 当前屏幕宽度 / 设计图 * 基准值
      var size = width / design * base;
      document.documentElement.style.fontSize = size + "px";
    }
    responsive();
    window.addEventListener("resize", responsive);
  script>
body>
html>

　　3.使用flexible.js

　　flexible.js是淘宝移动适配方案，基本原理与上面的通过javascript实现自适应相同，但是做了很多兼容性处理，其中定义：基准值(即html根元素字体大小) = 设计图尺寸 / 10。使用的时候直接在文件中引入包即可。

　　下载地址：https://github.com/amfe/lib-flexible

转载于:https://www.cnblogs.com/yream/p/10212596.html

你可能感兴趣的:(rem布局简介)

  • C++设计模式——Strategy策略模式 程序员与背包客_CoderZ C/C++设计模式c++设计模式策略模式c语言开发语言
    一，策略模式简介策略模式是一种行为型设计模式，策略模式在软件开发场景中定义了一系列的算法，并将每个算法单独封装在可替换的对象中，使应用程序在运行时可以根据具体的上下文来动态地选择和切换算法，同时保持原有的代码架构不被修改。策略模式的设计使得算法的实现与调用被分离，让算法可以独立于外部客户端进行开发和改动，使用独立的类来封装特定的算法，也避免了不同算法策略之间的互相影响。策略模式能适应多种应用场景，
  • Spring Security 详解：涵盖架构原理、多种认证授权方式、集成运用及安全配置要点汇总 软件职业规划 springspring架构安全
    一、SpringSecurity概述（一）简介SpringSecurity是一个功能强大且高度可定制的身份验证和访问控制框架，用于在Java应用程序中提供安全机制。它构建在Spring框架之上，能够轻松地集成到基于Spring的应用程序中，包括SpringBoot应用。（二）核心功能认证（Authentication）这是确认用户身份的过程。SpringSecurity支持多种认证方式，如基于表单
  • element ui Table组件内容自适应的情况下实现表头相对页面固定 木有是我 jshtmlvuecssjs
    一、elementuiTable只要在el-table元素中定义了height属性，即可实现固定表头的表格，而不需要额外的代码。此时有一个弊端，如果页面布局内容较多，会出现两个滚动条，一个table的一个页面的，我们的需求是页面高度随着数据数量而自适应撑开，而不是固定table视窗的高度二、效果图对比如下：三、实现步骤1、首先监听页面滚动事件、因为滚动事件触发太过频繁我就带了500毫秒的节流mou
  • 支持向量机图像分类matlab,基于支持向量机的图像分类.MATLAB 流光微言 支持向量机图像分类matlab
    【实例简介】基于支持向量机的图像分类.MATLAB【实例截图】【核心代码】基于支持向量机的图像分类├──code.zip├──pictures│├──car││├──car10.jpg││├──car11.jpg││├──car12.jpg││├──car13.jpg││├──car14.jpg││├──car15.jpg││├──car16.jpg││├──car17.jpg││├──car18
  • 基于AT32(STM32)单片机的模块化代码之——按键代码模块化 大白哦 单片机c语言案例项目开发
    基于AT32(STM32)单片机的模块化代码之按键模块化1.环境介绍平台：AT32F415单片机，雅特力公司的AT32系列单片机其实跟STM32系列单片机大同小异，包括库函数等基本都是一样的，所以这款代码无论是AT32还是STM32都是适用的。开发环境：MDKV5forarm简介：最近做项目经常用得到按键模块，包括按键扫描，按键长按，短按，组合按的判定，所以特地把按键模块做了整理，让其模块化更加好
  • openbmc简介 天地元黄 linux
    openbmc简介OpenBMCIPMI简介OpenBMC软件架构OpenBMC在说OpenBMC之前，先说一下BMC（BaseboardManagerController，简称BMC），BMC应用了IPMI架构的智能性，是嵌入在计算机（通常是服务器）主板上的专用的微控制器。它是负责管理系统和管理软件与服务器平台硬件之间的一个接口。根据IPMI规范，BMC需要满足如下条件：具有IMPI命令;提供B
  • 如何找回丢失的智能合约（SimpleToken ）地址并清理合约 纸鸢666 合约破解案例区块链
    简介在以太坊和其他区块链平台上，智能合约的部署和交互非常重要。然而，在实际应用中，开发者有时会遇到一些问题，比如丢失了已经部署的合约地址。在本文中，我们将探讨一个简单的智能合约示例，说明如何找回丢失的合约地址，并清理这些合约以避免资源浪费。1.问题背景假设有一个非常简单的代币工厂合约，任何人都可以通过它轻松创建新的代币合约。这个代币合约会接收以太币并根据以太币数量发行代币。在合约创建后，代币合约部
  • 桌面应用程序开发：跨平台方案方案有什么？ 柚米汇 开发语言
    目前市面上最流行的桌面开发程序框架和工具包括以下几种：1.Electron简介：使用Web技术（HTML、CSS、JavaScript）开发跨平台桌面应用，结合Node.js和Chromium。优点：广泛使用的Web技术，开发门槛低。丰富的插件和生态系统支持。许多成功的应用案例（如VisualStudioCode、Slack、Discord）。工具：VisualStudioCode、Atom。2.
  • 数据采集与存储——Elasticsearch实战详解 AI天才研究院 Python实战深度学习实战自然语言处理人工智能语言模型编程实践开发语言架构设计
    作者：禅与计算机程序设计艺术1.简介Elasticsearch是一个基于Lucene构建的开源分布式搜索引擎，主要用于大规模数据的存储、检索、分析等功能。Elasticsearch非常适合处理结构化和非结构化的数据，并且提供完整的RESTfulAPI接口，可以与多种语言的客户端进行交互。本文将从以下几个方面对Elasticsearch进行详细介绍：⒈Elasticsearch的历史及特性介绍；⒉E
  • 简介：编译、链接、静态库那点事儿 liulun 数据库c++
    编译一个C程序文件非常简单，如果你用MSVC编译器，那命令行是：>clhello.c//同目录下生成hello.execl.exe是你安装VisualStudio自带的，一般你在"x64NativeToolsCommandPromptforVS2022"环境下就能直接用它。编译多个C程序文件也可以用同样的方式，如下指令所示：>clhello.callen.c//同目录下生成hello.exe当然，
  • mysql 出现 Incorrect string value for column ‘表项‘ at row 1 错误解决方案 Tiantangbujimo7 数据库mysql数据库database
    今天使用mysql编写服务端时遇到中文字符串无法插入数据库表的成员中，报错如下：Incorrectstringvalue:'\xB2\xE2\xCA\xD4\xB2\xE2...'forcolumn'Remark'atrow1尝试了各种方案，用命令设置格式为utf8都不管用直到使用以下指令：MYSQL_RES*DBModuleMysql::QueryStore(constchar*sql,bool
  • 【学习笔记】昇思25天学习打卡(D14)CV05-SSD目标检测.ipynb UnseenMe 昇思学习笔记目标检测
    SSD目标检测模型简介SSD，全称SingleShotMultiBoxDetector，是WeiLiu在ECCV2016上提出的一种目标检测算法。使用NvidiaTitanX在VOC2007测试集上，SSD对于输入尺寸300x300的网络，达到74.3%mAP(meanAveragePrecision)以及59FPS；对于512x512的网络，达到了76.9%mAP，超越当时最强的FasterRC
  • 快速入门使用Redis缓存 阳光宅男dh 进阶学习redis缓存数据库
    Redis简介Redis是一个高性能的内存数据库，以key-value方式存储数据，可以作为缓存使用。为什么使用缓存？高并发MySQL的连接数存在瓶颈，连接过大可能导致MySQL宕机解决方法：部署多个MySQL服务，主从复制部署缓存，承担一部分的并发高性能基于内存，内存IO效率远远高于磁盘Redis的特点：性能高（读的速度是110000次/s,写的速度是81000次/s，单机redis支撑万级并发
  • 视频系统网络架构和相关计算 乌鹊月 弱电设计音视频网络架构
    目录内容简介一、视频系统的经典架构1.1不同交换机1.2推荐（仅参考）二、摄像机编码方式2.1摄像机码流值三、交换机带宽选择3.1接入层交换机3.2汇聚层交换机3.3核心层交换机四、存储容量的计算4.1带宽、网速、流量区分4.2视频存储容量五、上传宽带5.1双码流技术5.2用户读取数目5.3计算参考内容简介这里只关注视频系统的网络架构和存储。关于经典三层架构的网络交换机的选择，不同摄像机的码流是多
  • webstorm 推送项目到github stephen--zhu git前端webstorm
    1.在github中建立对应仓库。webstorm会建立连接，在github中建立对应的仓库。根据提示，会执行commit，以及push。然而，webstorm默认使用的是ssh连接。push失败。因此，执行第二步,设置remotes为https格式。2.添加远程仓库https格式在为：https://github.com/lven/es6.git设置webstorm的gitRemotes为htt
  • Python - 安装 Python、pip、virtualenv 伊织产研 #Pythonpythonpip源
    文章目录一、PythonUbuntu安装Python问题创建虚拟环境一些使用问题Nomodulenamed'_sqlite3'二、pip（管理第三方库）1、查看pip版本2、安装pip3、升级pip4、卸载pip5、查看已安装的pkg6、第三方库site-packages地址：7、更新8、切换源9、根据requirements.txt安装其它三、virtualenv（管理多个env）1、安装2、查
  • 【Matlab高端绘图SCI绘图模板】第05期 绘制高阶折线图 小熊科研路（同名GZH） 可视化matlab信息可视化开发语言
    1.折线图简介折线图是一个由点和线组成的统计图表，常用来表示数值随连续时间间隔或有序类别的变化。在折线图中，x轴通常用作连续时间间隔或有序类别（比如阶段1，阶段2，阶段3）。y轴用于量化的数据，如果为负值则绘制于y轴下方。连线用于连接两个相邻的数据点。折线图用于分析事物随时间或有序类别而变化的趋势。如果有多组数据，则用于分析多组数据随时间变化或有序类别的相互作用和影响。折线的方向表示正/负变化。折
  • 【Pytest】基础到高级功能的理解使用 卜及中 Python基础pytest学习python开发语言python3.11
    文章目录第一部分：Pytest简介1.1什么是Pytest？1.2Pytest的历史1.3Pytest的核心概念1.4Pytest的特点1.5为什么选择Pytest？第二部分：Pytest的基本使用2.1安装Pytest2.2编写第一个测试用例2.2.1创建一个简单的测试函数2.2.2运行测试2.3测试报告和输出2.3.1简单输出2.3.2显示详细的失败信息2.3.3生成HTML报告2.4组织和运
  • gRPC协议简介 xidianhuihui golang
    gRPC是谷歌开源的一套RPC协议框架。主要做两件事情：一是数据编码，二是请求映射。数据编码数据编码顾名思义就是在将请求的内存对像转化成可以传输的字节流发给服务端，并将收到的字节流再转化成内存对像。方法有很多，常见的有XML、JSON、Protobuf。XML已经日薄西山，JSON风头正盛，Protobuf则方兴未艾。gRPC默认选用Protobuf，早期貌似只支持Protobuf，现在号称也支持
  • Mybatis plus的基本使用 厂里英才 Mybatisplusmybatisplusspringbootjava
    目录1Mybatisplus的简介(来自官网)2基本使用步骤2.1引入依赖坐标2.2定义Mapper并继承BaseMapper接口3直接使用一部分自动生成的方法4基本规则5常用注解(都用于实体类)[email protected]@TableId5.3@TableField6常见配置1Mybatisplus的简介(来自官网)Mybatisplus（简称MP）是一个Mybatis的增强工具，在MyBa
  • Windows系统安装Docker环境详细教程 江湖有缘 Docker小白快速入门windowsdocker容器
    Windows系统安装Docker详细教程一、相关名词解释1.1WSL2简介1.2WSL安装版本要求1.3Docker简介二、本次实践介绍三、启用虚拟机功能3.1打开以PowerShell3.2开启虚拟化四、安装DockerDesktop工具4.1下载DockerDesktop4.2安装DockerDesktop4.3重启系统4.4接受协议4.5安装设置工作4.6进入DockerDesktop主界
  • python之函数的定义 徐jiankang python基础日常总结python开发语言
    博主简介：原互联网大厂tencent员工，网安巨头Venustech员工，阿里云开发社区专家博主，微信公众号java基础笔记优质创作者，csdn优质创作博主，创业者，知识共享者,欢迎关注，点赞，收藏。目录一、背景二、函数的定义三、参考四、总结一、背景  实际开发过程中，经常会遇到很多完全相同或者非常相似的操作，这时，可以将实现类似操作的代码封装为函数，然后在需要的地方调用该函数。这样不仅可以实现代
  • 请简述vue2和vue3的区别 youhebuke225 vue面试题vue.js前端javascript
    Vue2和Vue3作为Vue.js框架的两个主要版本，在多个方面存在显著的差异。以下是它们之间主要区别的详细概述：生命周期函数钩子：Vue2：包含了一系列的生命周期钩子函数，如beforeCreate、created、beforeMount等，这些函数在组件的不同生命周期阶段被调用。Vue3：对生命周期函数进行了调整，setup成为了新的入口点，代替了beforeCreate和created。同时
  • 设计模式-桥接模式 C++ 星星典典 设计模式c++桥接模式
    一、简介1、什么是桥接模式桥接（Bridge）是用于把抽象化与实现化解耦，使得二者可以独立变化。这种类型的设计模式属于结构型模式，它通过提供抽象化和实现化之间的桥接结构，来实现二者的解耦。需要注意的是，这里面说的抽象化和实现化并不是指抽象基类和具体派生类的关系。即桥接模式的目的并不是把抽象基类和具体派生类进行分离。而是指把问题的具体特质分离出来，以关联的关系加入对象的实例化过程。可以结合下面的桥接
  • 深度学习｜表示学习｜卷积神经网络｜由参数共享引出的特征图｜08 漂亮_大男孩 表示学习深度学习学习cnn
    如是我闻：FeatureMap（特征图）的概念与ParameterSharing（参数共享）密切相关。换句话说，参数共享是生成FeatureMap的基础。FeatureMap是卷积操作的核心产物，而卷积操作的高效性正是由参数共享带来的。下面我们详细看一下FeatureMap和ParameterSharing之间的关系：1.什么是FeatureMap？定义：FeatureMap是卷积操作生成的输出结
  • Vue企业开发实战——学习心得 sienn vue.js前端javascript
    一、Vue.js简介Vue.js是一个渐进式JavaScript框架，用于构建用户界面。它与其他大型框架的不同之处在于，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，也便于与第三方库或已有项目整合。二、环境配置安装Node.js和npm：Vue.js的开发需要使用Node.js和npm（Node包管理器）。可以从Node.js的官网下载并安装Node.js，它会自动
  • Ｑt C++设计模式-＞桥接模式 多喝热水-多读书 c++设计模式桥接模式qt
    桥接模式简介桥接模式（BridgePattern）是一种结构型设计模式，它将抽象部分与它的实现部分分离，使它们都可以独立地变化。桥接模式通过组合的方式来代替继承，使得系统可以在多个维度上独立变化。它非常适合用于需要在多个层次上扩展和变化的场景。桥接模式的应用场景假设你在开发一个跨平台的Qt应用程序，需要处理不同类型的设备（比如手机、平板、PC），并且还需要支持不同的操作系统（比如Windows、M
  • 探秘FreeMovie：一个开源的电影推荐系统 孟振优Harvester
    探秘FreeMovie：一个开源的电影推荐系统去发现同类优质开源项目:https://gitcode.com/项目简介是一个基于深度学习的开源电影推荐系统，由pojiezhiyuanjun开发并维护。该项目的目标是为用户提供个性化的电影推荐服务，通过机器学习算法理解用户的观影偏好，并据此进行智能推荐。技术分析FreeMovie的核心架构包括以下关键组件：数据处理-项目采用Hadoop进行大数据预处
  • 『大模型笔记』AI自动化编程工具汇总[持续更新ING]！ AI大模型前沿研究 大模型笔记大模型AI自动化工具bolt.newCursorV0
    『大模型笔记』AI自动化编程工具汇总！文章目录一.Bolt.new(开源AI驱动全栈Web开发工具)1.1.Bolt.new介绍1.2.编程小白如何打造自己的导航网站二.Cursor(人工智能代码编辑器)2.1.Cursor入门教程2.2.Cursor左侧布局设置和VSCode一样2.3.Cursor效率之道：Agent模式＋7大高级技巧详解三.Windsurf(颠覆Cursor的全新工具)3.1
  • C++设计模式——Bridge桥接模式 程序员与背包客_CoderZ C/C++设计模式c++设计模式开发语言c语言linux桥接模式
    一，桥接模式简介桥接模式是一种结构型设计模式，用于将抽象与实现分离，这里的"抽象"和"实现"都有可能是接口函数或者类。桥接模式让抽象与实现之间解耦合，使得开发者可以更关注于实现部分，调用者(Client)可以更关注于抽象部分。桥接模式可以将一个复杂的类进行拆分为好几个类，开发者可以修改其中任意一个类的实现，而不影响其他类的正常运行，该模式可以降低代码的维护工作量，降低代码风险。桥接模式的核心就是：
  • mondb入手 木zi_鸣 mongodb
    windows 启动mongodb  编写bat文件， mongod --dbpath D:\software\MongoDBDATA mongod --help  查询各种配置 配置在mongob 打开批处理，即可启动，27017原生端口，shell操作监控端口  扩展28017，web端操作端口 启动配置文件配置， 数据更灵活 
  • 大型高并发高负载网站的系统架构 bijian1013 高并发负载均衡
            扩展Web应用程序 一.概念         简单的来说，如果一个系统可扩展，那么你可以通过扩展来提供系统的性能。这代表着系统能够容纳更高的负载、更大的数据集，并且系统是可维护的。扩展和语言、某项具体的技术都是无关的。扩展可以分为两种：         1.
  • DISPLAY变量和xhost(原创) czmmiao display
    DISPLAY 在Linux/Unix类操作系统上, DISPLAY用来设置将图形显示到何处. 直接登陆图形界面或者登陆命令行界面后使用startx启动图形, DISPLAY环境变量将自动设置为:0:0, 此时可以打开终端, 输出图形程序的名称(比如xclock)来启动程序, 图形将显示在本地窗口上, 在终端上输入printenv查看当前环境变量, 输出结果中有如下内容:DISPLAY=:0.0
  • 获取B/S客户端IP 周凡杨 java编程jspWeb浏览器
       最近想写个B/S架构的聊天系统，因为以前做过C/S架构的QQ聊天系统，所以对于Socket通信编程只是一个巩固。对于C/S架构的聊天系统，由于存在客户端Java应用，所以直接在代码中获取客户端的IP，应用的方法为：    String ip = InetAddress.getLocalHost().getHostAddress(); 然而对于WEB
  • 浅谈类和对象 朱辉辉33 编程
        类是对一类事物的总称，对象是描述一个物体的特征，类是对象的抽象。简单来说，类是抽象的，不占用内存，对象是具体的， 占用存储空间。     类是由属性和方法构成的，基本格式是public  class 类名{ //定义属性 private/public 数据类型 属性名； //定义方法 publ
  • android activity与viewpager+fragment的生命周期问题 肆无忌惮_ viewpager
    有一个Activity里面是ViewPager，ViewPager里面放了两个Fragment。 第一次进入这个Activity。开启了服务，并在onResume方法中绑定服务后，对Service进行了一定的初始化，其中调用了Fragment中的一个属性。 super.onResume(); bindService(intent, conn, BIND_AUTO_CREATE);
  • base64Encode对图片进行编码 843977358 base64图片encoder
    /** * 对图片进行base64encoder编码 * * @author mrZhang * @param path * @return */ public static String encodeImage(String path) { BASE64Encoder encoder = null; byte[] b = null; I
  • Request Header简介 aigo servlet
    当一个客户端(通常是浏览器)向Web服务器发送一个请求是，它要发送一个请求的命令行，一般是GET或POST命令，当发送POST命令时，它还必须向服务器发送一个叫“Content-Length”的请求头(Request   Header)   用以指明请求数据的长度，除了Content-Length之外，它还可以向服务器发送其它一些Headers，如：    
  • HttpClient4.3 创建SSL协议的HttpClient对象 alleni123 httpclient爬虫ssl
    public class HttpClientUtils { public static CloseableHttpClient createSSLClientDefault(CookieStore cookies){ SSLContext sslContext=null; try { sslContext=new SSLContextBuilder().l
  • java取反 -右移-左移-无符号右移的探讨 百合不是茶 位运算符 位移
    取反： 在二进制中第一位，1表示符数，0表示正数 byte a = -1; 原码：10000001 反码：11111110 补码：11111111 //异或: 00000000 byte b = -2; 原码：10000010 反码：11111101 补码：11111110 //异或: 00000001
  • java多线程join的作用与用法 bijian1013 java多线程
            对于JAVA的join，JDK 是这样说的：join public final void join （long millis ）throws InterruptedException Waits at most millis milliseconds for this thread to die. A timeout of 0 means t
  • Java发送http请求(get 与post方法请求) bijian1013 javaspring
    PostRequest.java package com.bijian.study; import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.IOException; import java.io.InputStreamReader; import java.net.HttpURL
  • 【Struts2二】struts.xml中package下的action配置项默认值 bit1129 struts.xml
    在第一部份，定义了struts.xml文件，如下所示：   <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts
  • 【Kafka十三】Kafka Simple Consumer bit1129 simple
    代码中关于Host和Port是割裂开的，这会导致单机环境下的伪分布式Kafka集群环境下，这个例子没法运行。 实际情况是需要将host和port绑定到一起，   package kafka.examples.lowlevel; import kafka.api.FetchRequest; import kafka.api.FetchRequestBuilder; impo
  • nodejs学习api ronin47 nodejs api
    NodeJS基础 什么是NodeJS JS是脚本语言，脚本语言都需要一个解析器才能运行。对于写在HTML页面里的JS，浏览器充当了解析器的角色。而对于需要独立运行的JS，NodeJS就是一个解析器。 每一种解析器都是一个运行环境，不但允许JS定义各种数据结构，进行各种计算，还允许JS使用运行环境提供的内置对象和方法做一些事情。例如运行在浏览器中的JS的用途是操作DOM，浏览器就提供了docum
  • java-64.寻找第N个丑数 bylijinnan java
    public class UglyNumber { /** * 64.查找第N个丑数 具体思路可参考 [url] http://zhedahht.blog.163.com/blog/static/2541117420094245366965/[/url] * 题目：我们把只包含因子 2、3和5的数称作丑数（Ugly Number）。例如6、8都是丑数，但14
  • 二维数组（矩阵）对角线输出 bylijinnan 二维数组
    /** 二维数组 对角线输出 两个方向 例如对于数组： { 1, 2, 3, 4 }, { 5, 6, 7, 8 }, { 9, 10, 11, 12 }, { 13, 14, 15, 16 }, slash方向输出： 1 5 2 9 6 3 13 10 7 4 14 11 8 15 12 16 backslash输出： 4 3
  • [JWFD开源工作流设计]工作流跳跃模式开发关键点(今日更新) comsci 工作流
       既然是做开源软件的,我们的宗旨就是给大家分享设计和代码,那么现在我就用很简单扼要的语言来透露这个跳跃模式的设计原理    大家如果用过JWFD的ARC-自动运行控制器,或者看过代码,应该知道在ARC算法模块中有一个函数叫做SAN(),这个函数就是ARC的核心控制器,要实现跳跃模式,在SAN函数中一定要对LN链表数据结构进行操作,首先写一段代码,把
  • redis常见使用 cuityang redis常见使用
    redis 通常被认为是一个数据结构服务器，主要是因为其有着丰富的数据结构 strings、map、 list、sets、 sorted sets 引入jar包 jedis-2.1.0.jar  (本文下方提供下载) package redistest; import redis.clients.jedis.Jedis; public class Listtest
  • 配置多个redis dalan_123 redis
    配置多个redis客户端 <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"       xmlns:xsi=&quo
  • attrib命令 dcj3sjt126com attr
      attrib指令用于修改文件的属性.文件的常见属性有:只读.存档.隐藏和系统.    只读属性是指文件只可以做读的操作.不能对文件进行写的操作.就是文件的写保护.    存档属性是用来标记文件改动的.即在上一次备份后文件有所改动.一些备份软件在备份的时候会只去备份带有存档属性的文件. 
  • Yii使用公共函数 dcj3sjt126com yii
    在网站项目中，没必要把公用的函数写成一个工具类，有时候面向过程其实更方便。 在入口文件index.php里添加 require_once('protected/function.php'); 即可对其引用，成为公用的函数集合。 function.php如下：   <?php /**   * This is the shortcut to D
  • linux 系统资源的查看（free、uname、uptime、netstat） eksliang netstatlinux unamelinux uptimelinux free
    linux 系统资源的查看 转载请出自出处：http://eksliang.iteye.com/blog/2167081   http://eksliang.iteye.com 一、free查看内存的使用情况 语法如下：   free [-b][-k][-m][-g] [-t] 参数含义 -b:直接输入free时，显示的单位是kb我们可以使用b(bytes),m
  • JAVA的位操作符 greemranqq 位运算JAVA位移<<>>>
    最近几种进制，加上各种位操作符，发现都比较模糊，不能完全掌握，这里就再熟悉熟悉。   1.按位操作符 ：    按位操作符是用来操作基本数据类型中的单个bit,即二进制位，会对两个参数执行布尔代数运算，获得结果。    与（&）运算：    1&1 = 1, 1&0 = 0, 0&0 &
  • Web前段学习网站 ihuning Web
      Web前段学习网站 菜鸟学习：http://www.w3cschool.cc/   JQuery中文网：http://www.jquerycn.cn/   内存溢出：http://outofmemory.cn/#csdn.blog   http://www.icoolxue.com/   http://www.jikexue
  • 强强联合：FluxBB 作者加盟 Flarum justjavac r
    原文：FluxBB Joins Forces With Flarum作者：Toby Zerner译文：强强联合：FluxBB 作者加盟 Flarum译者：justjavac FluxBB 是一个快速、轻量级论坛软件，它的开发者是一名德国的 PHP 天才 Franz Liedke。FluxBB 的下一个版本(2.0)将被完全重写，并已经开发了一段时间。FluxBB 看起来非常有前途的，
  • java统计在线人数（session存储信息的） macroli javaWeb
    这篇日志是我写的第三次了 前两次都发布失败！郁闷极了！   由于在web开发中常常用到这一部分所以在此记录一下，呵呵，就到备忘录了！ 我对于登录信息时使用session存储的，所以我这里是通过实现HttpSessionAttributeListener这个接口完成的。 1、实现接口类，在web.xml文件中配置监听类，从而可以使该类完成其工作。 public class Ses
  • bootstrp carousel初体验 快速构建图片播放 qiaolevip 每天进步一点点学习永无止境bootstrap纵观千象
    img{ border: 1px solid white; box-shadow: 2px 2px 12px #333; _width: expression(this.width > 600 ? "600px" : this.width + "px"); _height: expression(this.width &
  • SparkSQL读取HBase数据，通过自定义外部数据源 superlxw1234 sparksparksqlsparksql读取hbasesparksql外部数据源
    关键字：SparkSQL读取HBase、SparkSQL自定义外部数据源     前面文章介绍了SparSQL通过Hive操作HBase表。   SparkSQL从1.2开始支持自定义外部数据源(External DataSource)，这样就可以通过API接口来实现自己的外部数据源。这里基于Spark1.4.0，简单介绍SparkSQL自定义外部数据源，访
  • Spring Boot 1.3.0.M1发布 wiselyman spring boot
        Spring Boot 1.3.0.M1于6.12日发布，现在可以从Spring milestone repository下载。这个版本是基于Spring Framework 4.2.0.RC1,并在Spring Boot 1.2之上提供了大量的新特性improvements and new features。主要包含以下：   1.提供一个新的sprin
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他