霜月枫桥-CSDN博客

转载负载均衡简介

负载均衡（Load Balance）是分布式系统架构设计中必须考虑的因素之一，它通常是指，将请求/数据【均匀】分摊到多个操作单元上执行，负载均衡的关键在于【均匀】。常见互联网分布式架构如上，分为客户端层、反向代理nginx层、站点层、服务层、数据层。什么是负载均衡负载均衡(Load Balance)是分布式系统架构设计中必须考虑的因素之一，它通常是指，将请求/数据【均匀】分摊到多个

2017-02-09 10:22:01 630

原创前台开发总结01

1、在网站首页中，logo采用的是h1标签，一般是为了让搜索引擎更好的抓取关键字，建议一个页面只有一个h1，而且是最重要的关键字放在里面。并且，使用text-indent对该标签样式进行设置，如下所示：h1{ text-indent:-9999px;}//从而使该在页面上消失不见。或者使用display:none;2、页面导航条，通常是使用list列表和浮动样

2017-02-07 16:33:30 640

原创在页面超链接<a>前加上图标

在前台页面设计中，为了实现更好的页面效果，我们可以在超链接文字前加上合适的小图标，从而给用户更好的视觉体验。 Document a{ display:inline-block; width: 100px; height:40px; background: gray url(../img/logo.png) no-repeat fixed 10px center;

2017-02-07 16:16:32 10546

原创设置页面元素垂直居中的几种方法

一、对于行内元素若该行内元素只有一行，且该行内元素父元素的高度一定，可以设置该行内元素的line-height属性，属性值为父元素的高度。二、对于块元素通过设置vertical-align属性实现垂直居中。1、在元素的中使用vertical属性。td{ vertical-align:middle;}2、对于普通的元素，首先设置该元素display

2017-02-07 11:22:35 6254

原创 <a href="mailto:">发送邮件

如何使用mailto？1）基本用法send email或者mailto后跟的是收信人。可使用参数列表to收信人suject主题cc抄送bcc暗抄送body内容参数传递方式同页面之间传递值一样，可以使用查询字符

2017-01-23 16:06:12 21667 1

转载 HTML5图片映射——<map>+<area>

在一些购物网站，我们总能看到一张大图，上面铺满充满诱惑的礼品，当我们轻轻地用鼠标单击一下，就跳转到这个宝贝的页面。对于这个神奇的功能，身边的小伙伴们往往都被震惊了。要是能够学会这招技能，那该多好啊，以后再也不用去找美工切图，并且也不用为兼容这种浏览器而发愁了。　　其实，对于这个看起来神奇的功能，实现起来却是相当的容易。只需要使用HTML的标签、标签和标签就能实现这个强大的功能。但是如

2017-01-22 10:50:40 3058

原创 js控制多种css样式依次显示

js控制多种css样式依次显示，一共有两种方法，第一种是传统的方法，使用window自带的setTimeout()，第二种是使用addEventListener()。 $(function(){ $("#div2").click(function(){ $("#div2").css({"transform":"translate(200px,100px)

2017-01-18 10:31:58 1906

转载 CSS3属性transform详解之（旋转:rotate,缩放:scale,倾斜:skew,移动:translate）

在CSS3中，可以利用transform功能来实现文字或图像的旋转、缩放、倾斜、移动这四种类型的变形处理，本文将对此做详细介绍。一.旋转 rotate用法：transform: rotate(45deg);共一个参数“角度”，单位deg为度的意思，正数为顺时针旋转，负数为逆时针旋转，上述代码作用是顺时针旋转45度。二.缩放 scale用法：transform

2017-01-17 14:26:51 4304

转载 text-fill-color加text-stroke实现页面艺术字

语法：text-fill-color：text-fill-color会覆盖color所定义的字体颜色：代码text-fill-color:#f00;color:#000;效果如果你的浏览器支持text-fill-color，将看到我是红色* 在webkit下你将看到红色的文字text-fill-color打造镂空文字：代码

2017-01-16 15:38:36 1066

原创 css样式继承

什么是css 继承？要想了解css样式表的继承，我们先从文档树（HTML DOM）开始。文档树由HTML元素组成。文档树和家族树类似，也有祖先、后代、父亲、孩子和兄弟^_^。这很容易理解吧，笔者在这里就不一一赘述了。希望深入了解的朋友请google之。那么CSS样式表继承指的是，特定的CSS属性向下传递到子孙元素。下面举个例子，有如下html代码片段：

2017-01-16 14:58:29 872

原创 js控制HTML元素自身属性的使用

HTML元素有许多自身的属性，例如disabled、readonly、required、selected……这些属性我们可以直接在HTML元素中设置也可以使用js设置HTML的自带属性。js设置HTML自带属性，使用removeAttr()和attr()方法设置HTML元素的属性。其中，attr()可以同时设置多个值，而removeAttr()则同时只能设置一个值。attr()设置

2017-01-16 13:51:51 1946

原创 css3弹性伸缩布局

css3提供了一种崭新的布局方式：Flexbox布局，即弹性伸缩布局模型（Flexible Box），该布局目前处于W3C的草案阶段，分为旧版本、新版本、新旧混合版本三个版本一、旧版本的弹性布局方案旧版本使用的示例如下： …… ……下面的属性都是写在div{ }中的。1、display属性值设为box或inline-boxbox

2017-01-15 21:04:18 1055

原创 columns属性——多列布局

columns[ˈkɑ:ləm] 多列布局与之相关的属性或子属性如下所示一、columns 集成column-width和column-count两个属性二、column-width 定义每列列宽度属性值如下所示：1、auto 默认值，自适应2、长度值设

2017-01-15 21:03:28 11039

原创 css3传统布局+box-sizing+resize

一、页面布局可以分为：固定布局、流动/流体布局、响应式布局HTML布局有三种布局方式，分别为：表格、浮动float、定位position二、元素定位position属性值有：static、relative、absolute、fixed注意：绝对定位属性absolute和fixed的区别absolute绝对定位是相对于static定位以外的第一个父元素进行定位，拖动浏览器的滚

2017-01-15 21:02:57 665

原创 animation属性——css3动画效果

animation css动画属性一、animation实现动画效果主要由两部分组成：1、通过类似flash动画中关键帧声明一个动画2、在animation属性中调用关键帧声明的动画二、主要步骤1、关键帧属性 @keyframes 声明一个关键帧属性的动画例如，在css中书写以下代码@keyframes myani{

2017-01-15 21:02:08 993

原创 transition属性——css3过渡效果

transition 实现过渡效果：通过一些简单的css动作触发平滑过渡功能任何用户动作，都可以触发元素的过渡效果，例如伪类动作:hover、:focus、:active、:checked；例如点击事件等只要使元素（如图片）的样式发生改变，都可以触发该元素的过渡效果。包含属性如下：一、transition-property 指定过渡或动态模拟的css属

2017-01-15 21:00:03 2298

原创 transform属性——css3变形效果3D

由于3D是立体三维，在x、y轴的基础上一般会多出一个z轴，深入跃出轴。要使用transform实现3D效果，首先需要为该元素或该元素的直接父元素设置如下2个属性属性1、transform-style 该属性是指定嵌套元素如何在3D空间中呈现属性值： flat 默认值，表示所有子元素在2D平面呈现 preserve-3d 表示

2017-01-15 20:59:16 3884

原创 transform属性——css3变形效果2D

一、transform 该属性允许我们对元素进行移动、缩放、旋转或倾斜transform的属性值如下所示：1、none 无变换2、translate 可使用长度值或百分数值，在水平方向、垂直方向或两个方向上translateX 平移元素translateY

2017-01-15 20:58:40 2311

原创 border-image，边框图片效果详解

border-image 设置边框图片的效果border-image-source //引入背景图片地址border-image-slice //切割引入的背景图片，只需要写数值，不需要带单位border-image-width //边框背景图片的宽度//如果你设置了边框的宽度border-width

2017-01-15 20:57:51 1628

原创 liferay ga6获取当前语言环境

当前语言环境指的是指的是门户网站cookie中，名为GUEST_LANGUAGE_ID的值，例如简体中文为zh_CN，美国英语为en_USliferay ga6可以在3处获取当前语言环境，分别为theme中，java后台中和jsp页面中一、theme主题中通过liferay自定义的变量$themeDisplay.getLanguageId()二、java后台中ThemeDisp

2017-01-15 20:54:43 805

原创 linear-gradient和radial-gradient属性——css3渐变效果

一、线性渐变 linear-gradient 背景颜色渐变功能该属性一共有三个属性值，分别为：方位(可选)、起始色（必选）、末尾色（必选）方位可以如下取值：1、使用方位，如：to top; to top right; to right; to bottom; to bottom left; to left; to top left；to bottom

2017-01-09 19:39:58 2334

原创 css阴影box-shadow+text-shadow和轮廓outline

一、box-shadow 向框添加一个或多个阴影该属性是由逗号分割的阴影列表，每个阴影是由2——4个长度值、可选的颜色值以及可选的inset关键词来规定。省略长度的值是0。h-shadow 阴影的水平偏移量，是一个长度值，正值向右偏移，负值向左偏移v-shadow 阴影的垂直偏移量，是一个长度值，正值向上偏移，负值向

2017-01-09 19:39:17 1139

原创 css表格和样式

一、border-collapse 设置表格的边框是否合并为一个单一的边框separate 默认值，边框会被分开collapse 边框会合并成一个单一的边框，会忽略border-spacing和empty-cells二、border-spacing 设置表格单元格边框之间的间距三、caption-

2017-01-09 19:38:38 636

原创 css3前缀、rem和浏览器css3支持版本

一、css3的样式，主流浏览器不同版本的支持度不同，可通过http://caniuse.com查看是否需要css3属性加前缀。二、前缀新版本的浏览器都不需要加前缀，加前缀是为了兼容老版本的浏览器，使老版本浏览器也可以使用css3样式。但是，现在的css3已经成为了行业标准，所有的高版本主流浏览器都可以使用css3，因此，部分主流浏览器已经不支持加前缀的css3样式。若你希望自己

2017-01-09 19:38:07 1106

原创 css边框和背景设置

一、initialinitial 关键字用于设置 CSS 属性为它的默认值。initial 关键字可用于任何 HTML 元素上的任何 CSS 属性。他和inherit类似，inherit是使用其父元素的对应属性。二、border-radius 圆角边框的设置border-radius可以设置四个值，分别是左上角、右上角、左下角、右下角。你也可以分开来使用，按

2017-01-09 19:37:20 618

原创 liferay ga6主题工程研究随笔

Liferay主题注意：我使用的liferay ga6环境，主题工程创建时的配置选项为一、在liferay主题（Theme）的编写中，如果要在portal_normal.vm中导入js或css包（例如jQuery包），可以使用以下两种方法：1、2、它们的路径相当于http://localhost:8080/test-theme/js类似的还有$themeDisplay.ge

2017-01-09 19:36:03 414

原创 js中实现验证码功能

Document $(function(){ changeCheckCode(); $("#checkCode").click(function(){ changeCheckCode(); }); });

2017-01-09 19:35:18 883

原创 ajax中JSON.stringify()和JSON.parse()方法的使用

我们平时使用ajax向后台传递数据时，通常会传递json格式的数据（写在dataType中），当然这里还有其它格式，比如xml、html、script、text、jsonp格式。json类型的数据包含json对象和json类型的字符串1、json对象示例如下：var jsondata={"Participant":[{"Name_1":"1","Position_1":"1

2017-01-04 18:58:43 18545

原创 jQuery实现操作框的实现和隐藏功能

问题描述：如下图所示，要实现以下功能。1、实现点击蓝色操作按钮，左边出现操作框。2、再点击一次操作按钮，出现的操作框消失。3、点击其他行的操作按钮，原先的出现操作框消失。4、点击页面空白处，原先出现的操作框消失。js代码如下： var beforeButton=null; $(function(){ // 点击空白

2017-01-04 18:57:37 1285

原创 jQuery之position()方法的具体使用

问题描述：今天我在解决一个HTML块元素显示问题，需求是有一个操作按钮，点击操作按钮，便在该操作按钮左边显示一个块元素，块元素中列出增删改查等操作，点击增删改查可完成该行数据的对应操作。我的jsp代码如下： +操作详细信息删除

2017-01-04 18:56:02 5785

原创 HTML、css、js控制页面元素的显示及个人对浮动的理解

一、HTML、jQuery、css都有自己的控制元素隐藏与显示的功能。HTML使用hidden属性jQuery使用hide(),show(),toggle(),fadeIn(),fadeOut(),fadeTo(),fadeToggle(),slideDown(),slideUp(),slideToggle()css控制元素的隐藏与显示，有display和visibility属性(

2017-01-04 18:51:07 1689

原创 css3字体样式

一、font-family的使用font-family属性可以设置HTML文本的字体样式，eg.*{ font-family: Arial,"Microsoft YaHei";}注意：当字体名称中包括空格、#、$之类的符号，则使用''font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体，则会尝试下一个。也就是说，font

2017-01-04 18:50:17 976

原创 css3伪类选择器使用总结

伪类选择器分为结构性、子元素、 UI、动态和其它伪类选择器大部分伪类选择器如下图所示:root返回在下面的示例中：div > p:only-child{ color:red; //不变红}div > p:only-of-type{ color:red; //变红}

2016-12-26 19:44:50 7626

原创 offset+position点击按钮弹出提示框，且提示框紧贴按钮

实现效果：点击按钮弹出绿色区域，绿色区域紧贴按钮，且缩小浏览器边框时，绿色区域依旧紧贴按钮。代码如下：$(function(){var top=$("#input1").offset().top;var left=$("#input1").offset().left-100;$("#div1").css({"top":top,"left":left,});

2016-12-22 18:02:01 725

原创 HTML5学习随笔

HTML5中各类型元素的具体使用，可以查看http://www.w3school.com.cn/tags/tag_input.asp1、中有accept属性，可以限制上传的类型。2、元素中有size属性，可以设置下拉框的高度，若选项多于下拉框的高度，则会出现下拉条。元素还有multiple属性，可以设置是否对选，用法类似于disabled。可以对中的进行分类，eg.……

2016-12-20 20:46:51 664

原创 HTML5学习随笔02

1、元素中的ismap属性，可以在浏览器导航栏显示鼠标点击图片的坐标，类似于jQuery中的pageX/pageYeg. 2、元素的usemap属性，关联元素，可以实现当点击图片中某一规定区域时，浏览器打开设定好的链接，类似于地图查询。eg. 3、中的属性书写类似于，都有src、width、height等。其中，，

2016-12-19 17:01:26 678

转载 WebService的两种方式SOAP和REST比较 (转)

我的读后感：由于第一次接触WebService，对于很多概念不太理解，尤其是看到各个OpenAPI的不同提供方式时，更加疑惑。如google map api采用了AJAX方式，通过javascript提供API,而淘宝TOP则采用直接的HTTP+XML请求方式，最令我疑惑的是教材上讲的WSDL，UDDI从没有在这些API中出现过。现在知道了WebService原来有两种方式，一是SOAP协议方式，

2016-12-16 14:18:41 1564

原创 HTML5学习随笔01

1、安全换行，分割过长单词为几部分，当窗口宽度缩小时，过长单词会一部分一部分的换行2、、分别为添加上标和下标eg. html5 //下标 ; html5 //上标3、可以使一些文字位于另一些文字的上方，例如可以实现在汉字上加汉语拼音4、有序链表，可以设置列表项从多大值开始，方法有以下两种： ·1、设置中的start属性，例如，那么列表项的数字将会从

2016-12-14 15:01:30 491

原创 js用==比较两个相等的字符串时，报错

问题描述：今天我在js中比较两个两个字符串时，发现明明值相等的两个变量，在if else语句中，却不进入if中，而是去else中运行。代码如下：var checkedLanguage=$("#checked-language").text(); if(' en_US '==checkedLanguage){ $("span#checked-en").css('display','in

2016-11-28 11:00:25 6710