随笔分类 - 前台HTML/CSS
摘要：如题。 最近需要使用到网页后台富文本编辑器。经过同学推荐，最后决定使用百度家的Ueditor.官方地址：http://ueditor.baidu.com/website/贴吧地址：ueditor讨论吧官方提供了网页上非常方便的自定义工具栏的功能。自定义之后直接下载对应的代码包并按照文档部署到项目中即可。其中主要的问题是路径的配置。首先是将下载好的代码包发布到我们项目的根目录下面。然后在需要添加富文本编辑器的页面头部添加如下代码： [javascript]view plaincopyprint?配置路径这一块是非常重要的。特别是下面的Ueditor的路径，是相对我们整个代码库的目录的。...
阅读全文
摘要：虽然百度ueditor的官网和文档都已经很详细了。但是自己还是记录下 自己使用uEditor的过程。这是 他的官网http://ueditor.baidu.com/website/ 例子 文档什么的都很详细。我下的是 开发版中的gbk版（视项目的编码方式而定）下载下来后 解压 把文件夹拷到你java ee项目的webroot下如图：ueditor里面的文件夹都没变 只是jsp文件夹把里面的前两个jar包弄到web-Inf里面的lib下面。把Uploader.java 放到src下面如图：包名和imageUp.jsp fileUp.jsp里面引用的一致。然后就是在jsp页面里面应用了 代码 如下
阅读全文
摘要：前天产品提了一个编辑器的bug，本人找是找到了问题的症结，就是不好改。框架是压缩兼混淆后的代码。查一下，好多年前的框架。。。咨询了一个同事有关旧框架的事情，他也建议我升级编辑器并帮忙帮我找了UEditor。嘻嘻。。。。不错，开源，文档也很好用。由百度web前端研发部开发。符合中国国情，ie6也支持的不错！官方地址：http://ueditor.baidu.com/website/index.html1.部署方法(php版本)a.下载项目需要的版本源码，以php为例b.文本编辑框所放的位置 c.加载框架脚本//$_POST['myContent'] 上传内容到服务器编辑框初...
阅读全文
摘要：byzhangxinxufromhttp://www.zhangxinxu.com 本文地址：http://www.zhangxinxu.com/wordpress/?p=1419一、前面的话HTML5提供专门的拖拽与拖放的API，以后实现这类效果就不必乱折腾了。但是，考虑到Opera浏览器似乎对此不感冒，在通用性上有待商榷，所以这里也就简单说一说。二、相关重点DataTransfer对象：退拽对象用来传递的媒介，使用一般为Event.dataTransfer。draggable属性：就是标签元素要设置draggable=true，否则不会有效果，例如：列表1ondragstart事件：当拖拽
阅读全文
摘要：基本概念：1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点对齐，从而设置块级元素内文本的水平对齐方式; 一般情况下设置文本对齐方式的时使用此属性。支持值 justify。 Example:div{text-align:left;} //文本居左对齐 注释：所有浏览器都支持 text-align 属性；任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。2.margin 是设置对象四边的外延边距，被称为外补丁或外边距。 Example:div{margin:20px10px30...
阅读全文
摘要：Special Layout lefttop leftbottom righttop rightbottom
阅读全文
摘要：【兼容html5方案】百度贴吧，百度图片的实现腾讯isux研究院的实现 淘宝- 我的淘宝页实现同上，只不过是不同版本不得不提的一个插件https://github.com/aFarkas/html5shiv在github 上达到了3453 星的高度，获得了国内外的广泛认可，如果你厌烦了满页面的div 想尽早拥抱html5 元素，就使用它吧。【兼容模式的选择】关于兼容模式百度首页使用的是百度搜索页使用的是百度图片，腾讯isux研究院，淘宝收藏页使用的是X-UA-Compatible 这是个是IE8的专用标记,用来指定IE8浏览器去模拟某个特定版本的IE浏览器的渲染方式chrome=1写法可以达到
阅读全文
摘要：http://ued.ctrip.com/blog/wp-content/webkitcss/prop/user-select.html
阅读全文
摘要：前面我们一起学习了CSS3中的渐变、圆角、阴影等几个属性的使用，今天开始我们一起来学习有关于CSS3制作动画的几个属性：变形(transform)、转换(transition)和动画(animation)等更高级的CSS3技术。本文主要介绍的是这三个属性之中的第一个──变形transform。Transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。下面我们一起来看看CSS3中transform的旋转rotate、扭曲skew、缩放scale和移动translat
阅读全文
摘要：IE6的抱怨：浮动让我沉沦现在开始真正的讲述问题的产生，原因以及解决了。首先讲讲第一种z-index无论设置多高都不起作用情况。这种情况发生的条件有三个：1、父标签 position属性为relative；2、问题标签无position属性（不包括static）；3、问题标签含有浮动(float)属性。
阅读全文
摘要：HTTP（HyperTextTransferProtocol）即超文本传输协议，目前网页传输的的通用协议。HTTP协议采用了请求/响应模型，浏览器或其他客户端发出请求，服务器给与响应。就整个网络资源传输而言，包括message-header和message-body两部分。首先传递message-header，即http header消息 。http header 消息通常被分为4个部分：general header, request header, response header, entity header。但是这种分法就理解而言，感觉界限不太明确。根据维基百科对http header内容
阅读全文
摘要：语法： background-position : length || length background-position : position || position 取值： length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅 长度单位 position : top | center | bottom | left | center | right 说明： 设置或检索对象的背景图像位置。必须先指定 background-image 属性。该属性定位不受对象的补丁属性( padding )设置影响。默认值为： 0% 0% 。此时背景图片将被定位于对象不包括补丁( pad
阅读全文
摘要：请看下面这条语句：var ns6=document.getElementById && !document.all为什么document.getElementById的后面没有括号和参数？这条语句什么意思？？首先说，不是语法错误，如果谁认为是语法错误，那说明对javascript的本质根本就不了解。javascript 的只是基本上可以分成 core javascript 和 client side javascript ，而document 则属于浏览器端（client side）的一个语言原有对象，而 getElementById 和all 这两个方法是document的原
阅读全文
摘要：今天有朋友在52css.com的留言板提出一个问题：为什么text-overflow:ellipsis的时候没有任何效果呀？text-overflow是一个比较特殊的属性，在CSS手册中，这个属性是这样定义的： 语法： text-overflow:clip|ellipsis 参数： clip: 不显示省略标记（...），而是简单的裁切 （clip这个参数是不常用的！） ellipsis: 当对象内文本溢出时显示省略标记（...） 说明：设置或检索是否使用一个省略标记（...）标示对象内文本的溢出。 请您注意，text-overflow:ellipsis属性在FF中是没有效果的。...
阅读全文
摘要：1.嵌套元素中使用负边界举例:<div class="main"><div class="content">子元素,注意自元素中的内容,这将有助于理解负边界的含义</div></div>.main{padding:50px 0 0 100px;width:350px;height:150px;background:#999999;}.content{margin:-100px 0 0 100px;width:100px;height:100px;background:#cccccc;}实现效果是:子元素的上
阅读全文
摘要：版权所有 2009-2012 武汉命运科技有限公司保留所有权利官方网站：http://www.ncmem.com/产品首页：http://www.ncmem.com/webplug/http-uploader3/index.aspx在线演示：http://www.ncmem.com/products/http-uploader3/demo/index.html产品介绍：http://www.cnblogs.com/xproer/archive/2012/02/17/2355440.html开发文档-ASP：http://www.cnblogs.com/xproer/archive/2012/0
阅读全文
摘要：之前在一个B/S项目中遇到一个需求，就是客户需要在页面上对报表的布局以及显示内容，进行自定义。最后决定使用activex技术来实现。众所周知，activex是微软搞得，因此只有ie内核的浏览器才能支持。像firefox(火狐)、Chrome、Apple Safari等非ie内核浏览器都不支持activex控件，这样就大大加大了系统使用的局限性。因此考虑是不是可以让非ie内核浏览器也能支持activex控件，目前火狐等浏览器也有类似于activex控件的技术，那就是插件。所以最终决定以插件来作为连接activex的纽带，使非ie内核浏览器也可以支持activex控件。确定了开发内容后，接下来就是
阅读全文
摘要：要实现动态加载JS脚本有4种方法：1、直接document.write<script language="javascript"> document.write("<script src='test.js'><\/script>");</script>2、动态改变已有script的src属性<script src='' id="s1"></script><script language="javascript&quo
阅读全文
摘要：SWFUpload是一个非常不错的异步上传组件，但是在Chrome、Firefox等浏览器下使用的时候会有问题。问题如下：为了防止跳过上传页面直 接向“接受SWFUpload上传的一般处理程序”（假如是Upload.ashx）发送请求造成WebShell漏洞，我的系统中对于 Upload.ashx进行了权限控制，只有登录用户才能进行上传。在IE下没问题，但是在Chrome下运行报错“用户未登录”。经过搜索得知：因为SWFUpload是靠Flash进行上传的，Flash在IE下会把当前页面的Cookie发到Upload.ashx，但是Chrome、Firefox下则不会把当前页面的Cookie发
阅读全文