CSS中怎么让DIV居中
[ 2012-10-26 09:02:38 | 作者: admin ]
CSS 如何使DIV层水平居中
今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性,
网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题.
可是事实上这样的方法科学吗?
经过网络搜索和亲自实验得出以下结论:
正确的也是对页面构造没有影响的设置如下:
对需要水平居中的DIV层添加以下属性:
margin-left: auto;
margin-right: auto;
经过这么一番设置问题似乎解决了,在FF中已经居中了,可是在IE中看竟然还是没有居中!
郁闷了一下午,就是找不出问题所在,还特地比较了网上的文章竟然一模一样.
问题到底出在哪里呢?
感谢网友乐天无用帮忙找出了这个邪门问题的原因.
原来是L-Blog默认没有在HTML前加上DTD,于是IE就以HTML而不是XHTML来解释文档.
问题并不在CSS而在XHTML网页本身.
...
阅读全文…
今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性,
网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题.
可是事实上这样的方法科学吗?
经过网络搜索和亲自实验得出以下结论:
正确的也是对页面构造没有影响的设置如下:
对需要水平居中的DIV层添加以下属性:
margin-left: auto;
margin-right: auto;
经过这么一番设置问题似乎解决了,在FF中已经居中了,可是在IE中看竟然还是没有居中!
郁闷了一下午,就是找不出问题所在,还特地比较了网上的文章竟然一模一样.
问题到底出在哪里呢?
感谢网友乐天无用帮忙找出了这个邪门问题的原因.
原来是L-Blog默认没有在HTML前加上DTD,于是IE就以HTML而不是XHTML来解释文档.
问题并不在CSS而在XHTML网页本身.
...
阅读全文…
Firefox下的浏览器兼容性检测工具——Compatibility Detector
[ 2012-10-22 10:03:48 | 作者: admin ]
这里给大家推荐一个Firefox下的浏览器兼容性检测工具 —— Compatibility Detector for Firefox 。这个工具对于新手来说是非常不错的一个东东，下面我就简单说下它的优点。
作为一个前端开发者来说，最痛苦的事情之一就是要兼容现在各种五花八门的浏览器，而在实际的调试中这个调试过程又是让人劳心劳力。而Compatibility Detector能把目前很多已知的兼容性问题很easy的展现在我们面前。Compatibility Detector下有两种：基本检测和高级检测。
基本检测会检测一些基本的DTD标准、标签、属性等，如下图中提示没有设置DTD、一些不兼容使用的标签和不建议使用的属性。（特别是align属性，很多新手喜欢使用align属性来布局，这个容易引起浏览器中的兼容性问题。）
如果使用高级测试功能，这个插件会把页面重新刷新一遍来获取页面中更多的兼...
阅读全文…
作为一个前端开发者来说，最痛苦的事情之一就是要兼容现在各种五花八门的浏览器，而在实际的调试中这个调试过程又是让人劳心劳力。而Compatibility Detector能把目前很多已知的兼容性问题很easy的展现在我们面前。Compatibility Detector下有两种：基本检测和高级检测。
基本检测会检测一些基本的DTD标准、标签、属性等，如下图中提示没有设置DTD、一些不兼容使用的标签和不建议使用的属性。（特别是align属性，很多新手喜欢使用align属性来布局，这个容易引起浏览器中的兼容性问题。）
如果使用高级测试功能，这个插件会把页面重新刷新一遍来获取页面中更多的兼...
阅读全文…
IE7/IE8/IE9与ewebeditor编辑器不兼容终极解决方案！
[ 2012-09-21 12:04:52 | 作者: admin ]
最近把IE浏览器更新到了IE8.0，在用eWebEditor在线HTML文本编辑器的时候点击eWebEditor上的所有编辑按钮都没用，浏览器状态栏左下角显示网页上有错误，于是在网上找了解决办法供大家参考，解决方法如下：
在eWebEditor的目录里找到Editor.js文件，有的可能在Include目录下，也有可能在js目录下，用记事本打开，在其中找到如下代码
改为
if (element.YUSERONCLICK)
{
try
{
eval(element.YUSERONCLICK + "onclick(event)");
...
阅读全文…
在eWebEditor的目录里找到Editor.js文件，有的可能在Include目录下，也有可能在js目录下，用记事本打开，在其中找到如下代码
if (element.YUSERONCLICK) {
eval(element.YUSERONCLICK + "anonymous()");
}
eval(element.YUSERONCLICK + "anonymous()");
}
改为
if (element.YUSERONCLICK)
{
try
{
eval(element.YUSERONCLICK + "onclick(event)");
阅读全文…
如何在firefox和ie里把ul和li左边的空白消掉
[ 2012-07-16 10:11:08 | 作者: admin ]
ul 标签在Mozilla中默认是有padding值的,而在IE中只有margin有值.
一般来说，先定义
IE6 Li标签左边多出16像素(px)宽度的BUG
偶然发现，IE６的Li标签左边会多出16px的宽度，即使把list-style-type设置成none。而在Firefox中却是正常的（IE其它版本没测试，不过应该是和Firefox一样的）。
经验证，其实是IE６的list-style-position属性造成的，默认情况下，Firefox中list-style-position值为outside,即列表项符号会在LI标签的外面显示。而IE６的默认值则相反(inside)。不过这还不是问题关键，IE６完全是属于占着茅坑...
阅读全文…
一般来说，先定义
UL{
margin:0;
border:0;
padding:0;
}
margin:0;
border:0;
padding:0;
}
IE6 Li标签左边多出16像素(px)宽度的BUG
偶然发现，IE６的Li标签左边会多出16px的宽度，即使把list-style-type设置成none。而在Firefox中却是正常的（IE其它版本没测试，不过应该是和Firefox一样的）。
经验证，其实是IE６的list-style-position属性造成的，默认情况下，Firefox中list-style-position值为outside,即列表项符号会在LI标签的外面显示。而IE６的默认值则相反(inside)。不过这还不是问题关键，IE６完全是属于占着茅坑...
阅读全文…
<base id=＂headbase＂ />中base标签的作用，拒绝网站镜像和解决模板的目录问题
[ 2012-06-28 13:55:08 | 作者: admin ]
ps. 这个标签可以用来网站被镜像
查看网页源码，发现里面多了下面一段base代码：
<base id="headbase" href="http://blog.52news.com/" /> 于是百度了一下，解释为：
base标签的作用是给网页中的链接指定一个默认的URL前缀
或者是指定一个target，比如：<base target="_blank" />
指定了base之后，页面相对链接会自动加上base的href
<img src="images/a.jpg"> 就变成了 <img src="http://blog.52news.com/images/a.jpg">
还可以指定为相对根目录 <base id="headbase" href="/web1/" />
<a href="/1.html">链接1</a> 实际链接为 /1.html
<a href="1.html">链接2</a> 实际链接为 /web1/1.html
查看网页源码，发现里面多了下面一段base代码：
<base id="headbase" href="http://blog.52news.com/" /> 于是百度了一下，解释为：
base标签的作用是给网页中的链接指定一个默认的URL前缀
或者是指定一个target，比如：<base target="_blank" />
指定了base之后，页面相对链接会自动加上base的href
<img src="images/a.jpg"> 就变成了 <img src="http://blog.52news.com/images/a.jpg">
还可以指定为相对根目录 <base id="headbase" href="/web1/" />
<a href="/1.html">链接1</a> 实际链接为 /1.html
<a href="1.html">链接2</a> 实际链接为 /web1/1.html
Dreamweaver正则表达式进行批量替换
[ 2012-06-18 11:23:56 | 作者: admin ]
p.s. 使用正则这个东西做点事情往往事半功倍，而且学习简单，有个参考表就可以了
删除所有yiqifa的前置链接，把下面的正则替换为空
查找所有超链接，不包括http:// 和已经有了/
\shref\s*=["'][^(http)(/)]
href\s*=['][^(http)(/)]
href\s*=(["'])([^(http)(/)])
href=$1/$2
正则表达式将不同内容，替换或增加一些内容
比如我们要把<a href='wholesale-wedding-dresses.html' > 增加一个/
需要在查找框里把要查找的数据用括号分组， 如href\s*=(["'])([^(http)(/)])
...
阅读全文…
删除所有yiqifa的前置链接，把下面的正则替换为空
http://p\.yiqifa\.com/c\?\S*&t=
查找所有超链接，不包括http:// 和已经有了/
\shref\s*=["'][^(http)(/)]
href\s*=['][^(http)(/)]
href\s*=(["'])([^(http)(/)])
href=$1/$2
正则表达式将不同内容，替换或增加一些内容
比如我们要把<a href='wholesale-wedding-dresses.html' > 增加一个/
需要在查找框里把要查找的数据用括号分组， 如href\s*=(["'])([^(http)(/)])
...
阅读全文…
jquery 实现iframe 自适应高度
[ 2012-06-09 23:19:35 | 作者: admin ]
超级简单的方法，也不用写什么判断浏览器高度、宽度啥的。
下面的两种方法自选其一就行了。一个是放在和iframe同页面的，一个是放在test.html页面的。
注意别放错地方了哦。
iframe代码，注意要写ID
<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>
jquery代码１：
阅读全文…
下面的两种方法自选其一就行了。一个是放在和iframe同页面的，一个是放在test.html页面的。
注意别放错地方了哦。
iframe代码，注意要写ID
<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>
jquery代码１：
//注意：下面的代码是放在test.html调用
$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
...$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
阅读全文…
基于Jquery的经典UI框架 DWZ富客户端框架设计思路与学习建议
[ 2012-04-01 09:22:09 | 作者: admin ]
DWZ富客户端框架设计目标是简单实用、扩展方便灵活、快速开发、RIA思路、轻量级
设计思路
第一次打开页面时载入界面到客户端, 之后和服务器的交互只是数据交互, 不占用界面相关的网络流量.
支持HTML扩展方式来调用DWZ组件.
基于jQuery标准化Ajax开发, 降低Ajax开发成本.
学习DWZ的建议
通读DWZ文档，很多问题文档中都写了，初学者最好先读一遍文档。
看demo每个组件演示效果和代码（留意组件html结构）。
建议安装firebug，用firebug看html结构、CSS和调试JS都非常方便。见附录一 firebug介绍。
对于初学者不建议看DWZ全部源码，但还是非常有必要看看dwz.ui.js和dwz.ajax.js
可以从google code下载dwz_thinkphp版本或dwz4j(Java版本)，结合后台程序去理解DWZ和服务器端的交互方式
...
阅读全文…
设计思路
第一次打开页面时载入界面到客户端, 之后和服务器的交互只是数据交互, 不占用界面相关的网络流量.
支持HTML扩展方式来调用DWZ组件.
基于jQuery标准化Ajax开发, 降低Ajax开发成本.
学习DWZ的建议
通读DWZ文档，很多问题文档中都写了，初学者最好先读一遍文档。
看demo每个组件演示效果和代码（留意组件html结构）。
建议安装firebug，用firebug看html结构、CSS和调试JS都非常方便。见附录一 firebug介绍。
对于初学者不建议看DWZ全部源码，但还是非常有必要看看dwz.ui.js和dwz.ajax.js
可以从google code下载dwz_thinkphp版本或dwz4j(Java版本)，结合后台程序去理解DWZ和服务器端的交互方式
...
阅读全文…
