coder斌
coder斌

CSS相应式卡包

CSS相应式卡包

    • 效果展示（大屏+小屏）
    • 代码实现
      • HTML
      • CSS

点击在线体验
bilibili视频
github地址

效果展示（大屏+小屏）

大屏

小屏

代码实现

HTML


<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>可口可乐title>
    <link rel="stylesheet" href="index.css">
head>

<body>
    <div class="cart">
        <div class="circle">div>
        <img src="./imgs/real-sugar.png" alt="">
        <div class="context">
            <h3>pepsih3>
            <p>This article is about the beverage. For its manufacturer, see PepsiCo. For other uses, see Pepsi disambiguation. Pepsi is a carbonated soft drink manufactured by PepsiCo. p>
            <a href="#">buy nowa>
        div>
    div>
body>

html>

CSS

* {
     
    padding: 0;
    margin: 0;
}

body {
     
    height: 100vh;
    background-color: #131313;
    display: flex;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
}

.cart {
     
    position: relative;
    width: 450px;
    height: 260px;
}

.cart img {
     
    position: absolute;
    z-index: 1;
    height: 300px;
    left: 50%;
    top: 50%;
    transition-duration: 1s;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.cart:hover img {
     
    left: 74%;
}

.circle {
     
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.circle::after {
     
    content: "";
    width: 100%;
    height: 100%;
    display: inline-block;
    background-color: red;
    transition-duration: 1s;
    clip-path: circle(35% at 50% 50%);
}

.cart:hover .circle::after {
     
    clip-path: circle(100% at 50% 50%);
    background-color: #0077B8;
}

.context {
     
    position: absolute;
    width: 45%;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    transition-duration: 1s;
    opacity: 0;
    visibility: hidden;
    padding: 10px 10px 10px 30px;
    text-transform: uppercase;
}

.cart:hover .context {
     
    left: 27%;
    opacity: 1;
    visibility: visible;
}

.context h3 {
     
    padding: 10px 0;
}

.context p {
     
    font-size: .8em;
    line-height: 1.5em;
}

.context a {
     
    padding: 5px 10px;
    font-size: .8em;
    display: inline-block;
    font-weight: 700;
    border-radius: 10px;
    text-decoration: none;
    margin-top: 15px;
    background-color: #fff;
    color: #131313;
}

@media screen and (max-width:990px) {
     
    .cart {
     
        max-width: 300px;
    }
    .cart:hover {
     
        height: 600px;
    }
    .circle::after {
     
        clip-path: circle(45% at 50% 50%);
    }
    .cart .context {
     
        width: 60%;
    }
    .cart:hover .context {
     
        left: 50%;
        padding: 10px 10px 10px 10px;
    }
    .cart:hover img {
     
        top: 72%;
        left: 50%;
    }
}

你可能感兴趣的:(网页特效,css,html,html5,css3)

  • web前端期末大作业实例 (1500套) 集合
    文章目录web前端期末大作业(1500套)集合一、网页介绍二、网页集合表白网页125套(集合)Echarts大屏数据展示150套(集合)一、基于HTML+Echarts技术制作二、基于VUE+Echarts技术制作更多源码web前端期末大作业(1500套)集合临近期末，大一新生的各种考试和专业结课作业纷至沓来。web实训大作业、网页期末作业、web课程与设计、网页设计等，简直让人头大。你还在为网页
  • 11.Django中常用过滤器 孤寒者 Django框架从入门到实战Python全栈系列教程过滤器pythondjango自动转义
    目录：每篇前言：（1）Django模板变量过滤器详解1.过滤器的作用与特点2.基本语法3.链式调用4.带参数的过滤器5.注意事项6.总结（2）Django中实战使用——常用的过滤器：①项目目录下的views.py文件：②项目目录下templates模板文件夹下的模板文件index.html：③效果展示：date和time过滤器格式：拓展——简介自动转义：每篇前言：作者介绍：【孤寒者】—CSDN全栈
  • vue2 面试题及详细答案150道（121 - 130）
    《前后端面试题》专栏集合了前后端各个知识模块的面试题，包括html，javascript，css，vue，react，java，Openlayers，leaflet，cesium，mapboxGL，threejs，nodejs，mangoDB，MySQL，Linux…。前后端面试题-专栏总目录文章目录一、本文面试题目录121.Vue2中如何实现组件的动态样式绑定？122.Vue2中如何处理跨域请求
  • 如何用css画三角形&太极 阿小经
    一、如何用css画一个三角形搜索学习资源：Google>>csstricksshape>>画一个如下图这样的三角形三角形htmltrianglecss1.先设置div元素，为它上下边界设置不同颜色，方便改动2.使其高度、宽度为03.使其上边界值为0（蓝色部分）4.使绿色和红色区域变成透明色就可以得到我们要的三角形了。5.简化代码二、如何用css画一个太极(带animation动效)静态效果图用到伪
  • wap页面和html5,WAP网站、3G网站、html5触屏版有什么区别？
    目前手机上的网站主要就分为WAP格式和3G格式，从脚本语言来讲，我们通常喜欢说用WML开发的网站就是WAP网站，用XHTML开发的网上3G网站。WML是当初专门为2.5G时代开发的一个脚本，他的功能挺简单的，页面形式呢主要是文字居多，因为那个时候的网速带宽还有机型的限制，所以WAP网站不能用CSS，字体颜色也只有普通文字的黑色和链接文字的蓝色，至于页面背景什么的是不能设置的。3G网站，也就是我们所
  • html5这什么意思,html5是什么意思？html5和html的区别介绍 wiles super html5这什么意思
    一、HTML5是什么？HTML5是HyperTextMarkupLanguage5的缩写，HTML5是超文本标记语言的最新版本，也就是描述网页的代码，html5实际上是三种代码形式，首先是HTML提供结构，其次是层叠样式表(CSS)负责网站的样式和布局，最后是JavaScript是给网站添加动态功能。二、html5和html的区别1、定义上区别HTML5是应用超文本标记语言(HTML)的第五次修改
  • HTML和HTML5的区别 半生凉忆 htmlhtml5
    HTML和HTML5的区别什么是HTML？HTML全称为超文本标记语言(HyperTextMarkupLanguage)，它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。什么是HTML5?HTML5是HTML的第五个版本，HTML5已经远远超越了标记语言的范畴，它的设计目的是在移动设备上支持多媒体，和HTML比起来，深度和广度上都做了进一步
  • 如何在HTML5页面中嵌入视频
    在HTML5中嵌入视频主要使用标签，这是一种简单且标准的方式。以下是详细步骤和示例：基础实现视频嵌入示例您的浏览器不支持HTML5视频标签。核心属性说明controls添加播放控件（播放/暂停、进度条、音量等）width和height设置播放器尺寸（单位：像素）标签提供多个视频格式源以提高兼容性（浏览器会选择第一个支持的格式）：MP4(H.264)-兼容性最好WebM-开源格式，Chrome/Fi
  • Python爬虫实战：高效提取与解析JSON格式数据 Python爬虫项目 python爬虫宽度优先数据库json深度优先开发语言
    1.JSON数据爬取概述在当今互联网时代，JSON(JavaScriptObjectNotation)已成为最流行的数据交换格式之一。相比传统的HTML页面，JSON格式数据具有结构清晰、体积小、解析方便等优势，使得它成为API接口的首选数据格式。1.1为什么选择JSON数据爬取数据结构化：JSON数据本身就是结构化的，不需要像HTML那样进行复杂的解析传输高效：JSON通常比HTML体积小，传输
  • 2020-12-09 幸福大黑鸭
    IT1.LeetCode：汇总区间Java编写2020-12-09（228.汇总区间）2.《Java从入门到精通》明日科技：P351~355阅读记xmind笔记，并自己实现实例。知识点之前确实都学过，但还是再系统复习一下吧。3.《Semantic-awareWorkflowConstructionandAnalysisforDistributedDataAnalyticsSystems》：粗读关键
  • Web开发 02 im_AMBER 前端学习
    今天梳理出的HTML+CSS核心知识点，涵盖基础结构、布局、样式优化等实用技巧：总结1一、HTML核心知识1.基础结构文档声明：定义文档为HTML5标准。基本标签：：根元素，包裹整个页面。：元数据（标题、样式、脚本等），不显示在页面。：设置网页标题（浏览器标签显示）。：页面内容容器，所有可见内容写在这里。2.常用标签文本与标题：~：标题标签，自动加粗且有默认层级样式。：段落标签，默认有上下边距。图
  • binwalk 白天的我最菜 错题本开发语言
    windows使用这个命令时候发现要shift一直按住,右击打开cmd管理员运行才行pythonsetup.pyinstall否则没有作用自己安装python目录的Scripts文件夹里,参考如下https://www.cnblogs.com/0yst3r-2046/p/12218770.html
  • 第 13 题：谈谈你对 CSS 选择器以及优先级的理解？ Noxus丶SJ
    常用的CSS选择器ID选择器、类选择器、标签选择器、属性选择器、伪类选择器、后代选择器权重划分在同一层级下!important>内联样式>ID选择器>类选择器>（标签选择器、伪类选择器、属性选择器）不同层级下正常来说权重值越高的优先级越高，但是一直以来没有具体的权重值划分，所以目前大多数开发中层级越深的优先级越高文章的内容/灵感都从下方内容中借鉴【持续维护/更新500+前端面试题/笔记】https
  • Python 并发调试工具（py-spy、GDB、pyperf）解析 赛博社畜联盟 python开发语言
    ```htmlPython并发调试工具（py-spy、GDB、pyperf）解析Python并发调试工具（py-spy、GDB、pyperf）解析在现代软件开发中，Python以其简洁的语法和强大的库支持，成为了许多开发者首选的语言。然而，随着程序复杂度的增加，尤其是涉及并发编程时，调试和性能优化变得尤为重要。本文将介绍三个常用的Python并发调试工具：py-spy、GDB和pyperf，并深入
  • Python 依赖管理的新动向：pip、Poetry 和 Conda 谁是未来的标准？
    ```htmlPython依赖管理的新动向：pip、Poetry和Conda谁是未来的标准？Python依赖管理的新动向：pip、Poetry和Conda谁是未来的标准？在Python生态系统中，依赖管理是一个至关重要的环节。无论是小型脚本还是大型企业级项目，依赖管理的好坏直接影响到项目的开发效率和稳定性。近年来，随着Python社区的快速发展，依赖管理工具也经历了显著的变化。本文将探讨三种主流的
  • 解决nginx无法显示图片的问题 刘晓倩
    在nginx配置文件里加上这句location~.*\.(jpg|jepg|gif|css|png|ico|html)?${root/Users/liuxq/Sites;expires30d;break;}重新启动后，就ok啦。
  • HTML+CSS+JS binzhenliziyuan javascripthtmlcss
    HTML+CSS+JSHTML基础1.HTML文件中的DOCTYPE是什么作用？2.HTML、XML、XHTML之间有什么区别？3.前缀为data-开头的元素属性是什么？4.谈谈你对HTML语义化的理解？5.HTML5对比HTML4有哪些不同之处？6.meta标签有哪些常用用法？7.img标签的srcset的作用是什么？8.响应式图片处理优化:Picture标签9.在script标签上使用defe
  • spring的AnnotatedBeanDefinitionReader类
    https://docs.spring.io/spring-framework/docs/6.1.3/javadoc-api/org/springframework/context/annotation/AnnotatedBeanDefinitionReader.htmlorg.springframework.context.annotation.AnnotatedBeanDefinitionRe
  • HTML+CSS简单网页练习
    前言运用了CSS进行简单的网页制作一、效果图二、HTML代码手机alert("欢迎—>"+prompt("请输入你的姓名")+"首页智能手机平板电脑配件服务支持关于尚合最新公告：尚合Aone智能手机入网证已经获工信部门审批下发。尚合官方新品发布新闻中心致歉公告首批尚合Aone已全部售罄！【媒体报道】国产高性价比尚合Aone四核手机评测我司产品已经通过了国家强制性产品3C认证尚合Aone智能手机入网
  • HTML+CSS制作人物介绍网页 Kyra17 html5css
    *仅作个人学习记录用*网页效果视频演示代码实现HTML部分角色简介角色故事技能介绍艾尔海森「诲韬诤言」「文弱的学术分子」米哈游出品的游戏《原神》及其衍生作品中的角色，须弥教令院六大学派之一“知论派”的学者，现任教令院书记官兼任代理贤者，有过人的智慧与才能，生活得自由自在，一般人基本找不到他。在须弥的风波结束，虚空系统关闭之后，教令院还有很多亟待解决的难题。而艾尔海森身为代理贤者，又是当前教令院中非
  • 思途html学习 0717 Asu5202 html学习前端
    1.HTML基础概述HTML定义：超文本标记语言（HyperTextMarkupLanguage），用于创建网页结构。“超文本”指支持嵌入图像、音频、视频和脚本等非文本内容。编辑器推荐：VSCode、HBuilderX或IDEA都很实用。安装VSCode后，添加LiveServer插件（通过Extensions搜索安装），能实现实时预览网页（快捷键：Ctrl+S保存后自动刷新）。核心特性：空白处理
  • html css js网页制作成品——HTML+CSS中国古代物理 - 中华优秀传统文化网页设计（4页）附源码 软件技术NINI 网页源码htmlcssjavascript
    目录一、‍网站题目二、✍️网站描述三、网站介绍四、网站效果五、代码实现HTML
  • HTML与HTML5知识点复习整理 bottle Shen html前端
    **本篇文章食用的简单说明**本篇文章为复习HTML与HTML5进行了知识点梳理，其中标题六部分涉及CSS知识（有标注），加粗部分为重点！！！加粗加红为重重点！！！如有遗漏欢迎在评论区补充~推荐大家按记忆梳理部分的内容自行回忆知识点，如有遗忘部分在左下方目录处点击相应部分可以进行跳转。又是努力学习前端的一天，希望大家共同进步~~~（QAQ我只是一个表情）❤***记忆梳理***一、HTML是什么二、
  • HTML快速复习
    目录!DOCTYPE声明头部head标题title标记元信息meta标记主体body标题分割线段落加粗倾斜下划线文字加删除线预编译标签换行实体字符多媒体标签超链接设置锚点列表标签表格标签框架框架集合form表单模拟百度搜索表单元素文本框密码框单选按钮多选按钮文件隐藏域普通按钮特殊按钮下拉列表多行文本框label标签提交按钮HTML5新增的一些type类型HTML5新增的一些属性thisismyfi
  • html js 查询数据库,如何使用javascript查询数据库？
    小编典典Javascript本身不能用于处理数据库。这是使用php(或您选择的服务器端语言)完成的。Ajax用于使用javascript向您的php脚本发送请求，而javascript则会与数据库进行通信。而且不需要页面刷新。因此，您尝试使用ajax可以轻松实现。既然您提到了jquery，就可以在jquery中签出$.ajax或$.post方法，这使过程更加简单。您需要使用ajax处理表单。Aja
  • html sql连接mysql数据库_HTML连接sql数据库 旋风1968 htmlsql连接mysql数据库
    怎样从HTML网页中获取SQL数据库里的数据我现在是一名学生，第一学期快结束了，老师要CSS布局HTML小编今天和大家分享我们每个学习小组用C#做HTML是无法读取数据库的，HTML是页面前端脚本语言，要想从HTML网页中获取SQL数据库里的数据，需要借助JSP或ASP或PHP或RUBY等语言来实现。简单的关系可以这样理解：数据库JSP或ASP或PHP或RUBY等语言HTML如：在JSP页面中显示
  • html 显示 数据库图片.js,html实时显示数据 怎么让数据库的数据在html显示出来 UnstructuredIO html显示数据库图片.js
    用JS实时调用数据显示在HTML页面上不要站在现在的高度，去判定未来的事情，因为未来的你是会成长的，会有新的选择和判断。html页面上怎么显示动态数据通过AJAX实现，在html页面用ajax请分享后台获取动态数据。获取range的值就行了，然后将其显示出来，你实时改变range的值，显示的就会实时改变0functionchange(){varvalue=document.getElementBy
  • python分布式爬虫打造搜索引擎--------scrapy实现 weixin_30515513 爬虫python开发工具
    http://www.cnblogs.com/jinxiao-pu/p/6706319.html最近在网上学习一门关于scrapy爬虫的课程，觉得还不错，以下是目录还在更新中，我觉得有必要好好的做下笔记，研究研究。第1章课程介绍1-1python分布式爬虫打造搜索引擎简介07:23第2章windows下搭建开发环境2-1pycharm的安装和简单使用10:272-2mysql和navicat的安装
  • 显示连接ftp文件列表的html,FileZilla连接成功但没显示所有目录 李霁琛
    最近弄了个虚拟主机，想写写自己的博客玩玩。然后买主机，买域名，安装了wordpress写了几篇博客，就放在一边了。用的都是wordpress的模板，没有涉及到上传本地php文件到远程服务器。在虚拟主机的Cpanel里，直接上传php或较大的文件夹时通常会失败。用网页上传也很慢。于是弄了Filezilla，免费好用的FTP上传工具。然后按照虚拟主机的Cpanel里的教程，下载了配置文件，直接在fil
  • HTML的重要知识 萌新小白的逆袭 html前端
    什么是HTMLHTML是HyperTextMarkupLanguage的缩写，意思是超文本标记语言。标签标题标签：————-h1,h2,h3.....段落标签：————p换行标签：————br列表标签：有序列表：——ol无序列表：——ul超链接标签：————href属性使用路径target用于定义链接打开的方式_blank在新窗口中打开目标资源；_self在当前窗口中打开目标资源多媒体标签：图片标
  • Java常用排序算法/程序员必须掌握的8大排序算法 cugfy java
    分类： 1）插入排序（直接插入排序、希尔排序） 2）交换排序（冒泡排序、快速排序） 3）选择排序（直接选择排序、堆排序） 4）归并排序 5）分配排序（基数排序） 所需辅助空间最多：归并排序 所需辅助空间最少：堆排序 平均速度最快：快速排序 不稳定：快速排序，希尔排序，堆排序。 先来看看8种排序之间的关系：   1.直接插入排序 （1
  • 【Spark102】Spark存储模块BlockManager剖析 bit1129 manager
    Spark围绕着BlockManager构建了存储模块，包括RDD，Shuffle，Broadcast的存储都使用了BlockManager。而BlockManager在实现上是一个针对每个应用的Master/Executor结构，即Driver上BlockManager充当了Master角色，而各个Slave上(具体到应用范围，就是Executor)的BlockManager充当了Slave角色
  • linux 查看端口被占用情况详解 daizj linux端口占用netstatlsof
    经常在启动一个程序会碰到端口被占用，这里讲一下怎么查看端口是否被占用，及哪个程序占用，怎么Kill掉已占用端口的程序   1、lsof -i:port port为端口号   [root@slave /data/spark-1.4.0-bin-cdh4]# lsof -i:8080 COMMAND   PID USER   FD   TY
  • Hosts文件使用 周凡杨 hostslocahost
         一切都要从localhost说起，经常在tomcat容器起动后，访问页面时输入http://localhost:8088/index.jsp，大家都知道localhost代表本机地址，如果本机IP是10.10.134.21，那就相当于http://10.10.134.21:8088/index.jsp，有时候也会看到http: 127.0.0.1:
  • java excel工具 g21121 Java excel
    直接上代码，一看就懂，利用的是jxl： import java.io.File; import java.io.IOException; import jxl.Cell; import jxl.Sheet; import jxl.Workbook; import jxl.read.biff.BiffException; import jxl.write.Label; import
  • web报表工具finereport常用函数的用法总结（数组函数） 老A不折腾 finereportweb报表函数总结
    ADD2ARRAY ADDARRAY(array,insertArray, start):在数组第start个位置插入insertArray中的所有元素，再返回该数组。 示例： ADDARRAY([3,4, 1, 5, 7], [23, 43, 22], 3)返回[3, 4, 23, 43, 22, 1, 5, 7]. ADDARRAY([3,4, 1, 5, 7], "测试&q
  • 游戏服务器网络带宽负载计算 墙头上一根草 服务器
    家庭所安装的4M，8M宽带。其中M是指，Mbits/S 其中要提前说明的是： 8bits = 1Byte 即8位等于1字节。我们硬盘大小50G。意思是50*1024M字节，约为 50000多字节。但是网宽是以“位”为单位的，所以，8Mbits就是1M字节。是容积体积的单位。 8Mbits/s后面的S是秒。8Mbits/s意思是 每秒8M位，即每秒1M字节。 我是在计算我们网络流量时想到的
  • 我的spring学习笔记2-IoC（反向控制 依赖注入） aijuans Spring 3 系列
    IoC（反向控制 依赖注入）这是Spring提出来了，这也是Spring一大特色。这里我不用多说，我们看Spring教程就可以了解。当然我们不用Spring也可以用IoC，下面我将介绍不用Spring的IoC。 IoC不是框架，她是java的技术，如今大多数轻量级的容器都会用到IoC技术。这里我就用一个例子来说明： 如：程序中有 Mysql.calss 、Oracle.class 、SqlSe
  • 高性能mysql 之 选择存储引擎(一) annan211 mysqlInnoDBMySQL引擎存储引擎
    1 没有特殊情况，应尽可能使用InnoDB存储引擎。   原因：InnoDB 和 MYIsAM 是mysql 最常用、使用最普遍的存储引擎。其中InnoDB是最重要、最广泛的存储引擎。她   被设计用来处理大量的短期事务。短期事务大部分情况下是正常提交的，很少有回滚的情况。InnoDB的性能和自动崩溃   恢复特性使得她在非事务型存储的需求中也非常流行，除非有非常
  • UDP网络编程 百合不是茶 UDP编程局域网组播
      UDP是基于无连接的,不可靠的传输   与TCP/IP相反       UDP实现私聊,发送方式客户端,接受方式服务器 package netUDP_sc; import java.net.DatagramPacket; import java.net.DatagramSocket; import java.net.Ine
  • JQuery对象的val()方法执行结果分析 bijian1013 JavaScriptjsjquery
            JavaScript中，如果id对应的标签不存在（同理JAVA中，如果对象不存在），则调用它的方法会报错或抛异常。在实际开发中，发现JQuery在id对应的标签不存在时，调其val()方法不会报错，结果是undefined。        
  • http请求测试实例（采用json-lib解析） bijian1013 jsonhttp
            由于fastjson只支持JDK1.5版本，因些对于JDK1.4的项目，可以采用json-lib来解析JSON数据。如下是http请求的另外一种写法，仅供参考。 package com; import java.util.HashMap; import java.util.Map; import
  • 【RPC框架Hessian四】Hessian与Spring集成 bit1129 hessian
    在【RPC框架Hessian二】Hessian 对象序列化和反序列化一文中介绍了基于Hessian的RPC服务的实现步骤，在那里使用Hessian提供的API完成基于Hessian的RPC服务开发和客户端调用，本文使用Spring对Hessian的集成来实现Hessian的RPC调用。   定义模型、接口和服务器端代码 |---Model    &nb
  • 【Mahout三】基于Mahout CBayes算法的20newsgroup流程分析 bit1129 Mahout
    1.Mahout环境搭建  1.下载Mahout http://mirror.bit.edu.cn/apache/mahout/0.10.0/mahout-distribution-0.10.0.tar.gz    2.解压Mahout  3. 配置环境变量 vim /etc/profile export HADOOP_HOME=/home
  • nginx负载tomcat遇非80时的转发问题 ronin47
    　　nginx负载后端容器是tomcat（其它容器如WAS,JBOSS暂没发现这个问题）非８０端口，遇到跳转异常问题。解决的思路是：$host:port        详细如下： 　　 该问题是最先发现的，由于之前对nginx不是特别的熟悉所以该问题是个入门级别的： ? 1 2 3 4 5
  • java-17-在一个字符串中找到第一个只出现一次的字符 bylijinnan java
    public class FirstShowOnlyOnceElement { /**Q17.在一个字符串中找到第一个只出现一次的字符。如输入abaccdeff，则输出b * 1.int[] count:count[i]表示i对应字符出现的次数 * 2.将26个英文字母映射：a-z <--> 0-25 * 3.假设全部字母都是小写 */ pu
  • mongoDB 复制集 开窍的石头 mongodb
    mongo的复制集就像mysql的主从数据库，当你往其中的主复制集(primary)写数据的时候，副复制集(secondary)会自动同步主复制集(Primary)的数据,当主复制集挂掉以后其中的一个副复制集会自动成为主复制集。提供服务器的可用性。和防止当机问题             mo
  • [宇宙与天文]宇宙时代的经济学 comsci 经济
        宇宙尺度的交通工具一般都体型巨大，造价高昂。。。。。      在宇宙中进行航行，近程采用反作用力类型的发动机，需要消耗少量矿石燃料，中远程航行要采用量子或者聚变反应堆发动机，进行超空间跳跃，要消耗大量高纯度水晶体能源      以目前地球上国家的经济发展水平来讲，
  • Git忽略文件 Cwind git
         有很多文件不必使用git管理。例如Eclipse或其他IDE生成的项目文件，编译生成的各种目标或临时文件等。使用git status时，会在Untracked files里面看到这些文件列表，在一次需要添加的文件比较多时（使用git add . / git add -u），会把这些所有的未跟踪文件添加进索引。 ==== ==== ==== 一些牢骚
  • MySQL连接数据库的必须配置 dashuaifu mysql连接数据库配置
    MySQL连接数据库的必须配置   1.driverClass：com.mysql.jdbc.Driver   2.jdbcUrl：jdbc:mysql://localhost:3306/dbname   3.user：username   4.password：password   其中1是驱动名；2是url，这里的‘dbna
  • 一生要养成的60个习惯 dcj3sjt126com 习惯
    一生要养成的60个习惯 第1篇 让你更受大家欢迎的习惯 1 守时，不准时赴约,让别人等,会失去很多机会。 如何做到： ①该起床时就起床， ②养成任何事情都提前15分钟的习惯。 ③带本可以随时阅读的书，如果早了就拿出来读读。 ④有条理，生活没条理最容易耽误时间。 ⑤提前计划：将重要和不重要的事情岔开。 ⑥今天就准备好明天要穿的衣服。 ⑦按时睡觉，这会让按时起床更容易。 2 注重
  • [介绍]Yii 是什么 dcj3sjt126com PHPyii2
    Yii 是一个高性能，基于组件的 PHP 框架，用于快速开发现代 Web 应用程序。名字 Yii （读作 易）在中文里有“极致简单与不断演变”两重含义，也可看作 Yes It Is! 的缩写。 Yii 最适合做什么？ Yii 是一个通用的 Web 编程框架，即可以用于开发各种用 PHP 构建的 Web 应用。因为基于组件的框架结构和设计精巧的缓存支持，它特别适合开发大型应
  • Linux SSH常用总结 eksliang linux sshSSHD
    转载请出自出处：http://eksliang.iteye.com/blog/2186931 一、连接到远程主机   格式： ssh name@remoteserver 例如： ssh [email protected]   二、连接到远程主机指定的端口   格式： ssh name@remoteserver -p 22 例如： ssh i
  • 快速上传头像到服务端工具类FaceUtil gundumw100 android
    快速迭代用 import java.io.DataOutputStream; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.FileOutputStream; import java.io.IOExceptio
  • jQuery入门之怎么使用 ini JavaScripthtmljqueryWebcss
    jQuery的强大我何问起（个人主页：hovertree.com）就不用多说了，那么怎么使用jQuery呢？   首先，下载jquery。下载地址：http://hovertree.com/hvtart/bjae/b8627323101a4994.htm，一个是压缩版本，一个是未压缩版本，如果在开发测试阶段，可以使用未压缩版本，实际应用一般使用压缩版本(min)。然后就在页面上引用。
  • 带filter的hbase查询优化 kane_xie 查询优化hbaseRandomRowFilter
    问题描述 hbase scan数据缓慢，server端出现LeaseException。hbase写入缓慢。   问题原因 直接原因是： hbase client端每次和regionserver交互的时候，都会在服务器端生成一个Lease,Lease的有效期由参数hbase.regionserver.lease.period确定。如果hbase scan需
  • java设计模式-单例模式 men4661273 java单例枚举反射IOC
             单例模式1，饿汉模式 //饿汉式单例类.在类初始化时，已经自行实例化 public class Singleton1 { //私有的默认构造函数 private Singleton1() {} //已经自行实例化 private static final Singleton1 singl
  • mongodb 查询某一天所有信息的3种方法，根据日期查询 qiaolevip 每天进步一点点学习永无止境mongodb纵观千象
    // mongodb的查询真让人难以琢磨，就查询单天信息，都需要花费一番功夫才行。 // 第一种方式： coll.aggregate([ {$project:{sendDate: {$substr: ['$sendTime', 0, 10]}, sendTime: 1, content:1}}, {$match:{sendDate: '2015-
  • 二维数组转换成JSON tangqi609567707 java二维数组json
    原文出处：http://blog.csdn.net/springsen/article/details/7833596 public class Demo {     public static void main(String[] args) {        String[][] blogL
  • erlang supervisor wudixiaotie erlang
    定义supervisor时，如果是监控celuesimple_one_for_one则删除children的时候就用supervisor:terminate_child (SupModuleName, ChildPid)，如果shutdown策略选择的是brutal_kill，那么supervisor会调用exit(ChildPid, kill)，这样的话如果Child的behavior是gen_
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他