leeeeeenas
leeeeeenas

使用html+css实现网页布局案例

使用html+css实现网页布局案例

  • 效果
    • 静态效果
    • 动图效果
  • 代码结构
  • 代码
    • html
    • css

以前学习或者练习的案例代码都没有做整理，所以这段时间在回顾一下过去写的案例巩固下基础知识点

项目代码：github。

效果

静态效果

动图效果

代码结构

使用html+css实现网页布局案例_第1张图片

代码

html

<!DOCTYPE html>
<html>
<head>
  <title>css网页页面</title>
  <meta charset="utf-8"/>
  <link rel="stylesheet" href="css/main.css"/>
</head>
<body>
  <!--头部-->
  <div class="header">
    <div class="logo">
      <img src="image/logo.png" />
    </div>
    <div class="menu">
      <ul>
        <li>手记</li>
        <li>视频</li>
        <li>图片</li>
        <li>首页</li>
      </ul>
    </div>
  </div>
  <!--主体-->
  <div class="main">
    <div class="pic">
      <img src="image/1.jpeg">
    </div>
    <!--遮罩层-->
    <div class="topLayer">

    </div>
    <div class="btn">
      <p>MY BEAUTIFUL LIFE</p>
      <button>LOOK MORE &nbsp;&nbsp;&gt;</button>
    </div>
    <!-- 内容展示区 -->
    <div class="content">
      <!-- 上部分 -->
      <div class="top">
        <div>
          <div class="icon weibo">
            <img src="image/weibo.png">
            <div class="des">MICROBLOG</div>
          </div>
          <div class="icon weixin">
  						<img src="image/weixin.png" alt="">
  						<div class="des">WECHAT</div>
  					</div>
  					<div class="icon qq">
  						<img src="image/qq.png" alt="">
  						<div class="des">QQ</div>
  					</div>
        </div>
        <div class="recept">
          "I want to give good things to record down,

          after the recall will be very beautiful."
        </div>
        <!-- 中间部分 -->
        <div class="picAndDes">
					<div class="icon2 ">
						<img src="image/03-01.jpg" alt="">
						<div class="des1">Cool Image</div>
						<div Class="des2">Record The Picture</div>
					</div>
					<div class="icon2">
						<img src="image/03-02.jpg" alt="">
						<div class="des1">Great Picture</div>
						<div class="des2">Record The Picture</div>
					</div>
					<div class="icon2">
						<img src="image/03-03.jpg" alt="">
						<div class="des1">Cool Image</div>
						<div class="des2">Record The Picture</div>
					</div>
				</div>
      </div>
      <div style="clear:both;"></div><!-- 不加这句话的话，下面的背景会上移 -->
      <!-- 下部分 -->
      <div class="bottom"><!--包裹层 -->
        <div class="bottom-content"><!--内容层 -->
          <div class="title">FROM THE PHOTO ALBUM</div>
          <div class="picContent">
						<dl>
							<dt><img src="image/04-01.jpg"></dt>
							<dd>
								Life is like a book, just read more and more refined, more write more carefully. When read, mind open, all things have been indifferent to heart. Life is the precipitation.
							</dd>
						</dl>
						<dl>
							<dt><img src="image/04-02.jpg"></dt>
							<dd>
								Life is like a cup of tea, let people lead a person to endless aftertastes. You again good taste, it will always have a different taste, different people will have different taste more.
							</dd>
						</dl>
					</div>
          <div style="clear: both;"></div>
        </div>
        <div style="clear: both;"></div>
      </div>
      <!-- 下部分 -->
      <div class="">
      </div>
    </div>

  </div>
  <!--底部-->
  <div class="footer">
    © 2016 imooc.com  京ICP备13046642号
  </div>
</body>
</html>

css

*{
  padding:0;
  margin: 0;
}
.header{
  width: 100%;
  height: 100px;
  /*test*/
  /*background-color: black;*/
}
.logo img{
  width: 300px;
  height:85px;
  padding-top: 8px;
  margin-left: 50px;
  float: left;
}
.menu{
  /*test*/
  /*background-color: green;*/
  float: right;
}
.menu ul{
  padding-right: 50px;
}
.menu ul li{
  list-style: none;
  float: right;
  height: 100px;
  line-height: 100px;
  width: 80px;
  font-weight: bold;
  text-align: center;
  font-family: "微软雅黑";
  cursor: pointer;
}
.menu ul li:hover{
  color:red;
}

.main .pic img{
   width: 100%;
   height: 600px;
   position: relative;
}
.main .topLayer{
  width:100%;
  height: 600px;
  position: absolute;
  top:100px;
  left: 0;
  background-color: #000;
  opacity: 0.5;
  z-index: 1;
}
.main .btn{
  width: 500px;
  height: 300px;
  /*test*/
  /*background-color: blue;*/
  position: absolute;
  top:400px;
  margin-top: -150px;
  right: 50%;
  margin-right: -250px;
  text-align: center;
  z-index: 2;
  border:0;

}
.main .btn p{
  padding-top: 100px;
  color:#fff;
  font-size: 45px;
  font-family: "微软雅黑";
  font-weight: bold;
}
.main .btn button{
  margin-top: 50px;
  width: 200px;
  height: 60px;
  color:#fff;
  font-family: "微软雅黑";
  font-size: 14px;
  background-color: #F5704F;
  border-radius: 8px;
  text-align: center;
  font-weight: bold;
  border:0;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  cursor: pointer;
}

.main .btn button:hover{
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}

.main .content{
  color: #7c7d7f;
	font-size: 20px;
	font-weight: bold;
}

.main .content .top{
	width: 1000px;
	padding-top: 50px;
	margin:0 auto;
}
.main .content .top .icon{
  float: left;
  width: 33.3%;
  padding-top: 50px;
  text-align: center;
}
.main .content .top .icon img{
  width: 100px;
  height: 100px;
}
.main .content .top .icon .des{
	padding-top: 20px;
}
.main .content .top .recept{
  padding-top: 50px;
  clear: both;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  font-style: italic;
  color:#E19796
}
.main .content .top .picAndDes{
  padding-top: 50px;
}
.main .content .top .picAndDes .icon2{
  float: left;
  padding: 10px;
  text-align: center;
}
.main .content .top .picAndDes .icon2 img{
  width: 310px;
  height: 260px;
}
.main .content .top .picAndDes .icon2 .des1{
	padding-top: 10px;
	font-size: 20px;
	font-weight: bold;
	color: #7c7d7f;
}
.main .content .top .picAndDes .icon2 .des2{
	color: #BDBDBC;
	padding-top: 10px;
}
.main .content .bottom{
  width: 100%;
  padding-top: 30px;
  background-color: #F9F9F9;
}
.main .content .bottom .bottom-content{
  width: 1000px;
  margin: 0 auto;
  margin-bottom: 50px;
  /**test**/
/**  background-color: black;**/
}
.main .content .bottom .bottom-content .title{
  text-align: center;
  padding-top: 50px;
  font-family: "微软雅黑";
  padding-bottom: 40px;
  font-size: 20px;
}
.main .content .bottom .bottom-content .picContent dl{
  width: 470px;
  float: left;
  margin: 10px 12px;
}
.main .content .bottom .bottom-content .picContent dl dt img{
	width:470px;
	height:480px;
}
.main .content .bottom .bottom-content .picContent dl dd{
	padding-top: 20px;
}

.footer{
  width: 100%;
  height: 100px;
  line-height: 100px;
  text-align: center;
  background-color: #292C35;
	color: #ffffff;
  font-family: "微软雅黑";
	font-size: 15px;
}

你可能感兴趣的:(前端实战小案例)

  • 系列3：【深入】qiankun动态与按需加载子应用—像电影一样控制出现时机 rabbit_it qiankun学习前端框架前端阿里云
    一、引言：为何需要动态加载在现代前端开发中，性能优化始终是一个关键问题。对于微前端架构而言，管理多个子应用带来了前所未有的灵活性，但也对资源的加载和使用效率提出了更高要求。假设你的微前端项目就像一场电影，而子应用是场景或演员。在不同的情节中，我们只需要特定的场景和演员出现，而不需要所有场景和演员一开始就站在舞台上等待。这时，动态加载和按需加载就成为了关键工具——让需要的内容在正确的时机上场，节省性
  • ODOO不同版本与平台选择 chouchengyin2080 c#操作系统运维
    1.10.0vs11.0vs8.0截至2017年底，最新的ODOO发布版为ODOO11.0，但功能上有一定精简（去除财务模块，去除工作流支持），技术上变动较大（代码逐步迁移至Python3，前端框架改写得抽象）。所以如果是从生产使用的角度来讲，ODOO10.0是当前最好选择，因为其更稳定，第三方模块也更多更全面。而如果是ODOO技术爱好从业者，则逐步迁移至ODOO11.0也有必要，因为其底层技术架
  • 全自动解密解码神器 — Ciphey K'illCode python_模块pythonvscode
    Ciphey是一个使用自然语言处理和人工智能的全自动解密/解码/破解工具。简单地来讲，你只需要输入加密文本，它就能给你返回解密文本。就是这么牛逼。有了Ciphey，你根本不需要知道你的密文是哪种类型的加密，你只知道它是加密的，那么Ciphey就能在3秒甚至更短的时间内给你解密，返回你想要的大部分密文的答案。下面就给大家介绍Ciphey的实战使用教程。1.准备开始之前，你要确保Python和pip已
  • 【编译原理】方舟编译技术课程 — 词法分析 CSU_THU_SUT 编译原理编译器编译原理llvm
    打开目录阅读更佳参考视频：方舟·编译技术入门与实战以及西交冯博琴老师的相关视频编译的过程包括词法分析（分析程序符号）、语法分析（分析语法单位）、中间代码生成、代码优化和目标代码生成。一、编译过程各部分的任务（1）词法分析：输入源程序，扫描分解源程序字符串，识别五类符号，包括定义符、标识符、运算符、界符和常数，转为单词符号。（2）语法分析：在词法分析基础上，将单词符号转为语法单位（如短句、子句、句子
  • Nuxt Kit 自动导入功能：高效管理你的模块和组合式函数 qcidyu 好用的工具集合代码效率前端技巧Vue开发组合式函数模块管理自动导入NuxtKit
    title:NuxtKit自动导入功能：高效管理你的模块和组合式函数date:2024/9/14updated:2024/9/14author:cmdragonexcerpt:通过使用NuxtKit的自动导入功能，您可以更高效地管理和使用公共函数、组合式函数和VueAPI。无论是单个导入、目录导入还是从第三方模块导入，您都可以通过简单的API调用轻松实现。categories:前端开发tags:N
  • 外卖霸王餐返利外卖会员卡小程序开发 闹小艾 good506070微信小程序小程序
    外卖霸王餐返利外卖会员卡小程序开发"社交电商赋能下的外卖返利小程序"是专为商家与用户双赢而设计的创新平台。以下是其开发方案的详细步骤：一、需求梳理：首先，我们需要明确小程序的核心功能和特色。包括设定活动类型、返利策略，以及用户体验友好的界面设计。二、技术决策：技术选型是关键。我们采用小程序的开发框架，利用JavaScript作为前端开发语言，并结合微信提供的API进行后端接口调用与数据处理。三、账
  • python logging使用_Python实战之logging模块使用详解 weixin_39548832 pythonlogging使用
    用Python写代码的时候，在想看的地方写个printxx就能在控制台上显示打印信息，这样子就能知道它是什么了，但是当我需要看大量的地方或者在一个文件中查看的时候，这时候print就不大方便了，所以Python引入了logging模块来记录我想要的信息。print也可以输入日志，logging相对print来说更好控制输出在哪个地方，怎么输出及控制消息级别来过滤掉那些不需要的信息。1、日志级别im
  • 终于搞懂TS中的泛型啦! | typescript 入门指南 04 程序员王天 TypeScript实践指南前端javascripttypescript
    大家好，我是王天~今天分享的是《ts入门指南》系列中第四篇，主要讲解ts中的泛型应用泛型在ts中是比较重要的概念，我花挺长时间才搞明白，整理输出这篇文章，希望能帮助到大家~《ts入门指南》系列，点击下方蓝色字体即可访问TsvsJs谁适合前端开发？|TypeScript入门指南01详解tsconfig.json配置文件|TypeScript入门指南02必学！TypeScript语法类型基础|Type
  • 前端HTML+CSS+JS的入门学习 俊昭喜喜里 前端htmlcss
    一.HTMLHTML（HyperTextMarkupLanguage）即超文本标记语言，是用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言，而是一种标记语言，通过一系列的元素（elements）来告诉浏览器如何显示网页上的内容，如文本、图片、链接、表格、列表等。HTML文档由一系列的标签（tags）组成，这些标签告诉浏览器如何显示内容。标签通常成对出现，例如和，其中是开始标签，表示一个
  • Open Feign 实战笔记 自强-X spring-cloudjavaspring微服务ribbonspringcloud
    OpenFeign笔记概念声明式的web服务客户端。使用接口加注解的形式编程。它是对RestTemplate和ribbon做了进一步封装。Feign已经停更，OpenFeign是在Feign的基础上又做了进一步的封装。Feign：Feign是SpringCloud组件中的一个轻量级RESTful的HTTP服务客户端Feign内置了Ribbon，用来做客户端负载均衡，去调用服务注册中心的服务。Fei
  • 全面指南：用户行为从前端数据采集到实时处理的最佳实践 数字沉思 营销流量运营系统架构前端内容运营大数据
    引言在当今的数据驱动世界，实时数据采集和处理已经成为企业做出及时决策的重要手段。本文将详细介绍如何通过前端JavaScript代码采集用户行为数据、利用API和Kafka进行数据传输、通过Flink实时处理数据的完整流程。无论你是想提升产品体验还是做用户行为分析，这篇文章都将为你提供全面的解决方案。设计一个通用的ClickHouse表来存储用户事件时，需要考虑多种因素，包括事件类型、时间戳、用户信
  • 大胆猜！主持人大赛第二阶段，谁最有望夺冠 童说家
    看完第六期又再次刷新了小编的认知，简直太过瘾了。选手们的实力就不用说了，光出题嘉宾的阵容就够人惊叹了，甚至连央视boys在这一期都合体了。好不容易熬到了上周六，可是第七期节目却因为节目编排的原因停更了，小编只好再刷遍第六期过足眼瘾啦！来源于主持人大赛第二赛段的“经典节目实战”难度提高了不少，央视的十档经典节目在场上被参赛选手重新演绎，不仅考验选手对相关内容的把握能力，对事物的分析、提炼和概括表述能
  • 前端使用react-intl-universal进行国际化 Stephy_Yy #调研reactjsjavascriptcss
    一、国际化/i18n目前国际化，就是开发者写对象，一个key关联若干语种的翻译。相比于浏览器自带的翻译功能，语义更加准确。“国际化”的简称：i18n（其来源是英文单词internationalization的首末字符i和n，18为中间的字符数）二、react项目国际化react-intl是业界最受欢迎的软件包之一：React-intl是雅虎的语言国际化开源项目FormatJS的一部分，通过其提供的
  • html打开本地excel文件夹,html使用excel表格数据库-html读取本地excel文件并展示 睿理
    html表格如何导入到excel中在vs里面用添加数据源就可以啊,再使用数据控件,就可以操作.添加数据源可以用odbc数据源,两种方式1,是在控制面板的管理工具里在ODBC里先设置好.2,是使用连接字符串.用vs的添加数据源向导做.html中有没有类似excel表格，可以填数的表格控件？首先html不能读取本地excel文件其次就算是javascript也是不允许的这是为了安全考虑如果前端脚本可以
  • Java在Controller生成Excel供前端直接下载 pengjunlee SpringBoot重点详解导出文件POIexcelController
    在许多企业办公系统中，经常会有用户要求，需要对数据进行统计并且可以直接下载Excel文件，这样子的话，既然客户提出了要求，我们就应该去满足吖，毕竟客户是上帝嘛，那么我们如何去实现呢？且看我为你一一道来。POI简介JakartaPOI是一套用于访问微软格式文档的JavaAPI。JakartaPOI有很多组件组成，其中有用于操作Excel格式文件的HSSF和用于操作Word的HWPF，在各种组件中目前
  • 解决前端导出excel文件，打开为乱码 荔枝，你让我拿什么荔枝！ vue前端elementuivue.js
    前端开发中，导入和导出文件是比较常见的业务场景，常见的情况是：后端返回一个二进制的流文件，前端将其转化为excel文件即可。但是往往会出现转化后的excel文件内容位乱码的情况，本文中提供了两个解决方案：方案一：用户自定义上传方法添加附件添加附件代码解读：上述代码采用了element-ui的el-upload文件上传的组件。改组件有两种文件上传的方式：1.组件自带的上传方法，只需要给其设置acti
  • 【Java】如何将二进制转换成MultipartFile Mxin5 Javajava开发语言
    业务场景：前端发送请求到后端进行文件上传，后端接收文件并调用第三方接口进行文件处理，响应格式为二进制，然后我们需要将二进制进行转换为MultipartFile进行文件上传。如果你想要将File转换成MultipartFile，可以参考：【Java】如何将File转换成MultipartFile_javafile转multipartfile_MXin5的博客-CSDN博客1.传递二进制respons
  • 【Java将File完美转为MultipartFile】:亲测有效 阿火~ java
    由于multipartFile有很多有用的api,但是有时候我们接收到前台的参数是文件名和文件内容,而不是文件,此时不能使用multipartFile接收,导致处理起来很不方便,比如我用minio上传文件,minio需要multipartFile类型的文件,而我拿到前端传来的文件名和文件内容只能自己通过File类创建文件,所以如果想用multipartFile类型就需要自己转换,然而天不遂人愿,并
  • 基于Google authentic实现的双因子登录认证系统前后台基于SSMP+Vue+Element（解决SecureRandom造成的服务器请求缓慢） Tate_Brown gitJAVAIDEADEBUGVUE
    用md5两次加盐密码，可以灵活更换算法--直接上代码地址：JAVA后台：https://github.com/TateBrownJava/TwoFALogindemoBackendVue前端：https://github.com/TateBrownJava/TwoFALoginDemofrontend-------------------------------------------------
  • Mall4j商城实战 - 部署 canal 数据库增量日志解析 yueerba126 Mall4j商城实战数据库springcloud微服务架构
    Canal简介Canal是基于MySQL数据库增量日志解析的工具，主要用于增量数据的订阅和消费。Canal主要用途基于MySQL数据库增量日志解析详细功能：实时解析MySQL的二进制日志（Binlog）。捕获数据库中的所有增量变更，如插入、更新和删除操作。使用场景：适用于实时监控数据库变化的应用，比如数据复制、数据备份或实时数据分析等。提供增量数据订阅和消费服务
  • 网上商城项目总结报告 WEB前端程序贵 前端
    网上商城项目总结报告1：掌握的知识通过网上商城这个实战项目的开发，不仅了解到了一个项目的业务逻辑，而且掌握了实现相关业务功能的方法。通过这个实战项目，了解到了模块化开发项目的基础结构的搭建，以及项目文件的管理方式。通过这个实战项目，运用封装的接口api文档实现了客户端服务器之间的交互知识。通过封装的axios实例对象与方法，向服务器请求数据，然后渲染页面。通过运用localStorage本地储存的
  • 前端基础面试题·第三篇——JavaScript（其二） DT—— 前端面试javascript面试
    1.深浅拷贝1.浅拷贝浅拷贝会创建一个新的对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值，如果属性是引用类型，拷贝就是改引用类型的地址。//常见的浅拷贝1.Object.assign({},obj)//对象浅拷贝assign⽅法可以⽤于处理数组，不过会把数组视为对象，⽐如这⾥会把⽬标数组视为是属性为0、1、2的对象，所以源数组的0、1属性的值覆盖了⽬标对
  • nginx部署前端项目的一些配置【刚入门】 weixin_30847271 运维前端ViewUI
    前期准备：在linux上安装nginx，我用的是腾讯云centos7服务器，具体的安装过程可以到腾讯云的开发者实验室里体验，自己先试试水。修改nginx.conf配置文件，我用到的修改只是以下的部分。1.端口号2.项目的存放位置server{listen8088default_server;#访问的端口号。listen[::]:8088default_server;server_name_;#ro
  • Java并发编程-AQS详解及案例实战（上篇） 猿与禅 Java技术栈源码分析javaAQS并发编程原理
    文章目录AQS概述AQS的核心概念AQS的工作原理AQS的灵活性使用场景使用指南使用示例AQS的本质:为啥叫做异步队列同步器AQS的核心机制“异步队列”的含义“同步器”的含义总结加锁失败的时候如何借助AQS异步入队阻塞等待AQS的锁队列加锁失败时的处理流程异步入队的机制总结ReentractLock如何设置公平锁策略以及原理设置公平锁策略公平锁的运作原理尝试获取锁释放锁性能与公平性的权衡tryLo
  • AJAX异步请求数据 铸键为犁 JavaWebajaxservletjavascript
    文章目录前言一、AJAX是什么？二、使用步骤1.语法格式2.示例2.注意事项总结前言本篇主要介绍怎么使用AJAX向服务器请求数据。一、AJAX是什么？异步请求技术,可以实现页面局部刷新,在不刷新页面的情况下发送请求到后台加载数据,并且展现在前端二、使用步骤1.语法格式代码如下：$.get(url,data,function(data){})发送get请求参数1:url是后台服务器地址参数2:dat
  • Keras深度学习框架入门及实战指南 司莹嫣Maude
    Keras深度学习框架入门及实战指南keraskeras-team/keras:是一个基于Python的深度学习库，它没有使用数据库。适合用于深度学习任务的开发和实现，特别是对于需要使用Python深度学习库的场景。特点是深度学习库、Python、无数据库。项目地址:https://gitcode.com/gh_mirrors/ke/keras一、项目介绍Keras简介Keras是一款高级神经网络
  • python基于django/flask的NBA球员大数据分析与可视化python+java+node.js QQ_511008285 pythondjangoflaskjavaspringboot数据分析
    前端开发框架:vue.js数据库mysql版本不限后端语言框架支持：1java(SSM/springboot)-idea/eclipse2.Nodejs+Vue.js-vscode3.python(flask/django)--pycharm/vscode4.php(thinkphp/laravel)-hbuilderx数据库工具：Navicat/SQLyog等都可以本文针对NBA球员的大数据进行
  • Java基于spring boot的国产电影数据分析与可视化python+java+node.js QQ_511008285 javaspringboot数据分析pythondjangovue.jsflask
    前端开发框架:vue.js数据库mysql版本不限后端语言框架支持：1java(SSM/springboot)-idea/eclipse2.Nodejs+Vue.js-vscode3.python(flask/django)--pycharm/vscode4.php(thinkphp/laravel)-hbuilderx数据库工具：Navicat/SQLyog等都可以  该系统使用进行大数据处理和
  • Python实时聊天室架构与API实战应用 幂简集成 python
    尊敬的各位读者，欢迎参与本次共享研讨项目——利用Python构建实时聊天室。在本项目中，我们将引进一款前沿工具——发布订阅频道API，以实现聊天室内的实时交互功能。在当今信息泛滥的社会环境下，实时交流已成为人们日常生活中不可或缺的组成部分。不论是社交平台上的即时通讯，抑或是网络游戏中的实时对决，实时通信技术始终在幕后默默支持着我们的每一次互动。今日，让我们共同踏入Python的奇妙世界，亲手打造专
  • vue 表格左右拖拽调整列宽_vue中实现拖动调整左右两侧div的宽度的示例代码 weixin_40008969 vue表格左右拖拽调整列宽
    写在最前最近在使用vue的时候，遇到一个需求，实现左右div可通过中间部分拖拽调整宽度，类似于这样这是我最终的实现效果还是老话，因为我不是专业的前端工程师，只是兼职写一些简单的前端，所以这个功能的实现得益于以下博客，《vue拖动调整左右两侧div的宽度》、《vuejs中拖动改变元素宽度实现宽度自适应大小》，而我只是针对于他们提供的代码，加了亿点点自己所需要的细节。实现原理如上图所示，我们需要将要实
  • 面向对象面向过程 3213213333332132 java
    面向对象：把要完成的一件事，通过对象间的协作实现。 面向过程：把要完成的一件事，通过循序依次调用各个模块实现。 我把大象装进冰箱这件事为例，用面向对象和面向过程实现，都是用java代码完成。 1、面向对象 package bigDemo.ObjectOriented; /** * 大象类 * * @Description * @author FuJian
  • Java Hotspot: Remove the Permanent Generation bookjovi HotSpot
      openjdk上关于hotspot将移除永久带的描述非常详细，http://openjdk.java.net/jeps/122   JEP 122: Remove the Permanent Generation Author Jon Masamitsu Organization Oracle Created 2010/8/15 Updated 2011/
  • 正则表达式向前查找向后查找,环绕或零宽断言 dcj3sjt126com 正则表达式
    向前查找和向后查找 1. 向前查找：根据要匹配的字符序列后面存在一个特定的字符序列(肯定式向前查找)或不存在一个特定的序列(否定式向前查找)来决定是否匹配。.NET将向前查找称之为零宽度向前查找断言。     对于向前查找，出现在指定项之后的字符序列不会被正则表达式引擎返回。 2. 向后查找：一个要匹配的字符序列前面有或者没有指定的
  • BaseDao 171815164 seda
    import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException; import java.sql.PreparedStatement; import java.sql.ResultSet; public class BaseDao { public Conn
  • Ant标签详解--Java命令 g21121 Java命令
            这一篇主要介绍与java相关标签的使用         终于开始重头戏了，Java部分是我们关注的重点也是项目中用处最多的部分。           1
  • [简单]代码片段_电梯数字排列 53873039oycg 代码
           今天看电梯数字排列是9 18 26这样呈倒N排列的,写了个类似的打印例子，如下:       import java.util.Arrays; public class 电梯数字排列_S3_Test { public static void main(S
  • Hessian原理 云端月影 hessian原理
    Hessian 原理分析 一．      远程通讯协议的基本原理 网络通信需要做的就是将流从一台计算机传输到另外一台计算机，基于传输协议和网络 IO 来实现，其中传输协议比较出名的有 http 、 tcp 、 udp 等等， http 、 tcp 、 udp 都是在基于 Socket 概念上为某类应用场景而扩展出的传输协
  • 区分Activity的四种加载模式----以及Intent的setFlags aijuans android
      在多Activity开发中，有可能是自己应用之间的Activity跳转，或者夹带其他应用的可复用Activity。可能会希望跳转到原来某个Activity实例，而不是产生大量重复的Activity。 这需要为Activity配置特定的加载模式，而不是使用默认的加载模式。 加载模式分类及在哪里配置 Activity有四种加载模式： standard singleTop
  • hibernate几个核心API及其查询分析 antonyup_2006 html.netHibernatexml配置管理
    (一)  org.hibernate.cfg.Configuration类         读取配置文件并创建唯一的SessionFactory对象.(一般,程序初始化hibernate时创建.)         Configuration co
  • PL/SQL的流程控制 百合不是茶 oraclePL/SQL编程循环控制
    PL/SQL也是一门高级语言,所以流程控制是必须要有的,oracle数据库的pl/sql比sqlserver数据库要难,很多pl/sql中有的sqlserver里面没有   流程控制; 分支语句 if 条件 then 结果 else 结果 end if ; 条件语句 case when 条件 then 结果; 循环语句 loop
  • 强大的Mockito测试框架 bijian1013 mockito单元测试
    一.自动生成Mock类        在需要Mock的属性上标记@Mock注解，然后@RunWith中配置Mockito的TestRunner或者在setUp()方法中显示调用MockitoAnnotations.initMocks(this);生成Mock类即可。二.自动注入Mock类到被测试类  &nbs
  • 精通Oracle10编程SQL(11)开发子程序 bijian1013 oracle数据库plsql
    /* *开发子程序 */ --子程序目是指被命名的PL/SQL块，这种块可以带有参数，可以在不同应用程序中多次调用 --PL/SQL有两种类型的子程序：过程和函数 --开发过程 --建立过程：不带任何参数 CREATE OR REPLACE PROCEDURE out_time IS BEGIN DBMS_OUTPUT.put_line(systimestamp); E
  • 【EhCache一】EhCache版Hello World bit1129 Hello world
    本篇是EhCache系列的第一篇，总体介绍使用EhCache缓存进行CRUD的API的基本使用，更细节的内容包括EhCache源代码和设计、实现原理在接下来的文章中进行介绍   环境准备 1.新建Maven项目   2.添加EhCache的Maven依赖 <dependency> <groupId>ne
  • 学习EJB3基础知识笔记 白糖_ beanHibernatejbosswebserviceejb
    最近项目进入系统测试阶段，全赖袁大虾领导有力，保持一周零bug记录，这也让自己腾出不少时间补充知识。花了两天时间把“传智播客EJB3.0”看完了，EJB基本的知识也有些了解，在这记录下EJB的部分知识，以供自己以后复习使用。   EJB是sun的服务器端组件模型，最大的用处是部署分布式应用程序。EJB (Enterprise JavaBean)是J2EE的一部分，定义了一个用于开发基
  • angular.bootstrap boyitech AngularJSAngularJS APIangular中文api
    angular.bootstrap 描述：     手动初始化angular。     这个函数会自动检测创建的module有没有被加载多次，如果有则会在浏览器的控制台打出警告日志，并且不会再次加载。这样可以避免在程序运行过程中许多奇怪的问题发生。   使用方法：     angular .
  • java-谷歌面试题-给定一个固定长度的数组，将递增整数序列写入这个数组。当写到数组尾部时，返回数组开始重新写，并覆盖先前写过的数 bylijinnan java
    public class SearchInShiftedArray { /** * 题目：给定一个固定长度的数组，将递增整数序列写入这个数组。当写到数组尾部时，返回数组开始重新写，并覆盖先前写过的数。 * 请在这个特殊数组中找出给定的整数。 * 解答： * 其实就是“旋转数组”。旋转数组的最小元素见http://bylijinnan.iteye.com/bl
  • 天使还是魔鬼？都是我们制造 ducklsl 生活教育情感
    ----------------------------剧透请原谅，有兴趣的朋友可以自己看看电影，互相讨论哦！！！     从厦门回来的动车上，无意中瞟到了书中推荐的几部关于儿童的电影。当然，这几部电影可能会另大家失望，并不是类似小鬼当家的电影，而是关于“坏小孩”的电影！     自己挑了两部先看了看，但是发现看完之后，心里久久不能平
  • [机器智能与生物]研究生物智能的问题 comsci 生物
          我想,人的神经网络和苍蝇的神经网络,并没有本质的区别...就是大规模拓扑系统和中小规模拓扑分析的区别....       但是,如果去研究活体人类的神经网络和脑系统,可能会受到一些法律和道德方面的限制,而且研究结果也不一定可靠,那么希望从事生物神经网络研究的朋友,不如把
  • 获取Android Device的信息 dai_lm android
    String phoneInfo = "PRODUCT: " + android.os.Build.PRODUCT; phoneInfo += ", CPU_ABI: " + android.os.Build.CPU_ABI; phoneInfo += ", TAGS: " + android.os.Build.TAGS; ph
  • 最佳字符串匹配算法（Damerau-Levenshtein距离算法）的Java实现 datamachine java算法字符串匹配
    原文：http://www.javacodegeeks.com/2013/11/java-implementation-of-optimal-string-alignment.html------------------------------------------------------------------------------------------------------------
  • 小学5年级英语单词背诵第一课 dcj3sjt126com englishword
    long 长的 show 给...看，出示 mouth 口，嘴 write 写   use 用，使用 take 拿，带来 hand 手 clever 聪明的   often 经常 wash 洗 slow 慢的 house 房子   water 水 clean 清洁的 supper 晚餐 out 在外   face 脸，
  • macvim的使用实战 dcj3sjt126com macvim
    macvim用的是mac里面的vim, 只不过是一个GUI的APP, 相当于一个壳   1. 下载macvim https://code.google.com/p/macvim/   2. 了解macvim :h               vim的使用帮助信息 :h macvim  
  • java二分法查找 蕃薯耀 java二分法查找二分法java二分法
    java二分法查找 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年6月23日 11:40:03 星期二 http:/
  • Spring Cache注解+Memcached hanqunfeng springmemcached
    Spring3.1 Cache注解  依赖jar包： <!-- simple-spring-memcached --> <dependency> <groupId>com.google.code.simple-spring-memcached</groupId> <artifactId>simple-s
  • apache commons io包快速入门 jackyrong apache commons
    原文参考 http://www.javacodegeeks.com/2014/10/apache-commons-io-tutorial.html   Apache Commons IO 包绝对是好东西，地址在http://commons.apache.org/proper/commons-io/，下面用例子分别介绍：   1）  工具类   2
  • 如何学习编程 lampcy java编程C++c
    首先,我想说一下学习思想.学编程其实跟网络游戏有着类似的效果.开始的时候,你会对那些代码,函数等产生很大的兴趣,尤其是刚接触编程的人,刚学习第一种语言的人.可是,当你一步步深入的时候,你会发现你没有了以前那种斗志.就好象你在玩韩国泡菜网游似的,玩到一定程度,每天就是练级练级,完全是一个想冲到高级别的意志力在支持着你.而学编程就更难了,学了两个月后,总是觉得你好象全都学会了,却又什么都做不了,又没有
  • 架构师之spring-----spring3.0新特性的bean加载控制@DependsOn和@Lazy nannan408 Spring3
    1.前言。    如题。 2.描述。    @DependsOn用于强制初始化其他Bean。可以修饰Bean类或方法，使用该Annotation时可以指定一个字符串数组作为参数，每个数组元素对应于一个强制初始化的Bean。 @DependsOn({"steelAxe","abc"}) @Comp
  • Spring4+quartz2的配置和代码方式调度 Everyday都不同 代码配置spring4quartz2.x定时任务
    前言：这些天简直被quartz虐哭。。因为quartz 2.x版本相比quartz1.x版本的API改动太多，所以，只好自己去查阅底层API……   quartz定时任务必须搞清楚几个概念： JobDetail——处理类 Trigger——触发器，指定触发时间，必须要有JobDetail属性，即触发对象 Scheduler——调度器，组织处理类和触发器，配置方式一般只需指定触发
  • Hibernate入门 tntxia Hibernate
      前言   使用面向对象的语言和关系型的数据库，开发起来很繁琐，费时。由于现在流行的数据库都不面向对象。Hibernate 是一个Java的ORM（Object/Relational Mapping）解决方案。   Hibernte不仅关心把Java对象对应到数据库的表中，而且提供了请求和检索的方法。简化了手工进行JDBC操作的流程。   如
  • Math类 xiaoxing598 Math
    一、Java中的数字（Math）类是final类，不可继承。 1、常数 PI：double圆周率 E：double自然对数 2、截取（注意方法的返回类型） double ceil(double d) 返回不小于d的最小整数 double floor(double d) 返回不大于d的整最大数 int round(float f) 返回四舍五入后的整数 long round
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他