Div / Css / XML / HTML5
关注
分享
扫一扫
文章平均质量分 83
iteye_5904
这个作者很懒，什么都没留下…
展开
-
css透明度的设置 （兼容所有浏览器）
一句话搞定透明背景！ .transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;} UPDATE: I wanted to pull this post out of the archiv...原创 2009-12-10 10:39:47 · 646 阅读 · 0 评论 -
css hacks (ie6,ie7,ie8,firefox,Chrome)
IE6能识别下划线"_"和星号" * "，IE7能识别星号" * "，但不能识别下划线"_"，IE8能识别" \9"，但不能识别下划线"_"，而firefox两个都不能认识,却可以识别‘!important’。等等书写顺序，一般是将识别能力强的浏览器的CSS写在后面。下面列举常用的CSS hack方法 1：!important!import2009-12-10 10:57:03 · 120 阅读 · 0 评论 -
input 提交表单按钮 背景图片的完美设置 (隐藏字体)
<input type="submit" id="submit_btn" src="submit_btn_bg_img.jpg" value="loginer" /> 这样的话，value值会附在背景图片的上方。 ok， 我们可以用下面的方法来替换上面的方法<input type="submit" id="submit_btn" name=2009-12-11 03:38:58 · 886 阅读 · 0 评论 -
CSS 3.0 参考手册 (中文版)
公司的页面同学们，利用业余时间整理出了一份比较完整的CSS 3.0 参考手册，非常不容易。手册是根据W3C的CSS3草案翻译，并且结合实际的示范结合而成。每一页都倾注了每一个同学的心血。 预览页面：下载地址： http://webteam.tencent.com/css3/...原创 2009-12-12 00:44:24 · 1067 阅读 · 0 评论 -
20个让Web Developer开发生涯更加轻松的工具
Typetester一个在线对比字体的工具，可以很直观得看到不同字体的差异 pForm创建HTML表单的工具，能在瞬间创建很美观的表单，并输出html代码 ColourLovers在线的调色板工具，你能够搜索到很多配色方案或提交你的配色方案 Firebug无所不能的firebug，不多介绍了 HTML ...原创 2009-12-12 00:47:15 · 129 阅读 · 0 评论 -
图片垂直水平居中
图片垂直水平居中 image center在不知道图片具体高度的情况下，使其垂直和水平都居中<div id="photo">powered by 25175.net<img src="../../../../images/img01.jpg" alt="something" /></div>CSS代码：<st原创 2009-12-13 00:50:55 · 138 阅读 · 0 评论 -
点击空链接，页面不跳到页头
<a href=”javascript:void(0);”>我的祖国</a> 页面上有空链接,点击后页面自动刷新定位到页面顶端,在某个时候,需要点击#页面不动,就可以这样写: <a href="#2">税务登记证</a> 在#后加上点别的东西就可以了,这样页面不会链到别的页面,也不会刷新定位到顶端. <a hre...原创 2009-12-13 00:51:52 · 222 阅读 · 0 评论 -
网页插入PDF
<object width="800" height="600" data="go_to_your_pdf_path.pdf" type="application/pdf"> <param name="src" value="go_to_your_pdf_path.pdf"></object&g2009-12-13 01:16:50 · 211 阅读 · 0 评论 -
input宽度自适应
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><原创 2009-12-14 00:26:55 · 1137 阅读 · 0 评论 -
几种播放器代码
Wordpress 音频播放器1、flash播放器 swf <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"...原创 2009-12-23 23:31:43 · 1002 阅读 · 0 评论 -
如何在html文件中包含其他html文件
1.IFrame 框架的形式. <iframe name="toppage" width=100% height=30 marginwidth=0 marginheight=0 src="top.htm" ></iframe> iframe也称作嵌入式框架，嵌入式框架和框架网页类似，它可以把一个网页的框架和内容嵌入在现有的网页中。它与<f...原创 2010-01-11 21:53:03 · 224 阅读 · 0 评论 -
css多行多列的新闻模式
css多行多列的新闻模式 1. 最简单的两列 <style>ul {width:250px;list-style:none;}li {width:120px;float:left;height:20px;} </style><ul><li>武松打虎</li><...原创 2010-01-26 03:41:57 · 193 阅读 · 0 评论 -
div 文字 input 垂直居中
代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>..2010-01-31 00:19:10 · 883 阅读 · 1 评论 -
input 关闭输入法
关闭输入法本文字框输入法被关闭： 语法： style="ime-mode:disabled" 范例： <input type="text" name="textfield" style="ime-mode:disabled">原创 2010-02-11 06:58:39 · 693 阅读 · 0 评论 -
浏览器兼容手册
javascript部分1. document.form.item 问题问题：代码中存在 document.formName.item("itemName") 这样的语句，不能在FF下运行解决方法：改用 document.formName.elements["elementName"]2. 集合类对象问题问题：代码中许多集合类对象取用时使用()，IE能接受，...原创 2010-02-12 03:47:22 · 109 阅读 · 0 评论 -
xml 中插入html代码
技巧就是加入<![CDATA[...]]> <?xml version="1.0" encoding="utf-8"?><article><title>xml中显示html代码</title><content> <![CDATA[<P原创 2010-10-08 00:28:37 · 1614 阅读 · 0 评论 -
XSL 入门
XML是一种元标记语言，没有许多固定的标记，为WEB开发人员提供了更大的灵活性。当我们使用HTML时，标记只是简单的表示内容的显示形式，而与表示的内容没有任何关联，为文档的进一步处理带来极大的不便。比如要表示个人简历，用HTML的表示方式如下：<HTML><BODY><TABLE border=1 cellspacing=0><...原创 2010-10-08 01:23:38 · 253 阅读 · 0 评论 -
div css 圆角样式
代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>..2010-03-12 22:44:27 · 242 阅读 · 0 评论 -
css 布局 两行, 三行等高
关键在于添加 overflow: hidden;padding-bottom:9999px; margin-bottom:-9999px; 两行： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xht...2010-03-16 02:10:56 · 903 阅读 · 0 评论 -
PNG图在IE6下透明的终极解决方案
现在做很多页面，比如阴影，或很多情况要用到透明图，GIF图一般会有很多锯齿，用PNG图吧，效果到是还好。Firefox和IE7以上版本都支持PNG透明，但IE6缺会显示灰白。百度，google搜罗一通，现总结如下两种。如有更好的方案，望交流 第一种，适用于图片做背景的时候。代码： <style> body { background: url(body...2010-03-16 02:19:33 · 141 阅读 · 0 评论 -
在网页中嵌入任意字体的解决方案 （insert any font）
字体使用是网页设计中不可或缺的一部分。经常地，我们希望在网页中使用某一特定字体，但是该字体并非主流操作系统的内置字体，这样用户在浏览页面的时候就有可能看不到真实的设计。美工设计师最常做的办法是把想要的文字做成图片， 这样做有几个明显缺陷：1. 不可能大范围的使用该字体；2. 图片内容相对使用文字不易修改；3. 不利于网站SEO（主流搜索引擎不会将图片alt内容作为判断网...2010-03-17 02:12:33 · 437 阅读 · 0 评论 -
HTML 5 canvas 基本语法
简述HTML 5 规范引进了很多新特性，其中最令人期待的 之一就是 canvas 元素。HTML 5 canvas 提供了通过 JavaScript 绘制图形的方法，此方法使用简单但功能强大。每一个 canvas 元素都有一个"上下文( context )" (想象成绘图板上的一页)，在其中可以绘制任意图形。浏览器支持多个 canvas 上下文，并通过不同的 API 提供图形绘制功能。 ...2010-03-22 04:37:51 · 130 阅读 · 0 评论 -
z-index在IE中的迷惑
今天在写页面的时候发现头部导航栏的下拉菜单，被下面的画中画遮挡住了，然后把导航的下拉菜单样式设置为z-index:999;但是在IE下没起什么作用，而在FF下起作用了。然后又把画中画的样式设置为z-index:-99;在IE下还是没反映。囧。。。 IE下: FF下: 然后在Google里搜...原创 2010-10-26 21:15:48 · 108 阅读 · 0 评论 -
20 Professional Web Admin Templates on ThemeForest
A modern and easy to use Admin User Interface is the key to success of web applications. A custom made web admin user interface usually cost you a fortune. How about using some of the professi...原创 2010-06-27 09:11:42 · 210 阅读 · 0 评论 -
XSLT入门
学习资源：1. http://www.w3school.com.cn/xsl/2. https://www6.software.ibm.com/developerworks/cn/education/xml/x-introxslt/section2.html 1.XSLT的概念我们首先来澄清一个概念，大家可能听说过XSL(eXtensible Stylesheet...原创 2010-07-13 02:50:52 · 151 阅读 · 0 评论 -
Web 前端优化
1. 内容篇 Yahoo! 的 Exceptional Performance team 在 Web 前端方面作出了卓越的贡献。广为人知的优化规则也由 13 条到 14 条，再到 20 条，乃至现在的 34 条--真是与时俱进啊。最新的 34 条也针对不同的角度做了分类。面向内容的优化规则目前有 10 条。 1. 尽量减少 HTTP 请求 (Make Few...原创 2012-01-10 04:00:02 · 363 阅读 · 0 评论 -
制作HTML类型的email邮件 Background Images and CSS in HTML Email
We’ve noticed a few people having issues with background images in their HTML email designs, so we thought we’d post some quick tips here. Lots of email applications (especially the browser-base...原创 2010-07-28 06:33:44 · 1204 阅读 · 0 评论 -
filter IE滤镜（Internet Explorer）CSS
概述CSS滤镜虽然只能在IE浏览器中表现出效果，但是仍不失为网页增加特效的好办法。 1．CSS静态滤镜样式 （filter）CSS静态滤镜样式的使用方法：{ filter : filtername( parameters1, parameters2, ...) } Filter样式 简要说明 支持参数 alpha 设置图片或文字的不透明度...原创 2011-03-04 05:06:20 · 297 阅读 · 0 评论 -
-moz火狐 （firefox）CSS
Mozilla浏览器支持一些扩展的CSS是以-moz开头的。这些措施包括了一些功能，包括圆形边界，并能够指定不同的方块的宽度和高度的计算，在非标准方式下，这种css在Mozilla浏览器下执行计算更容易得到支持。 有些特性在后来被提议列入的CSS规范，但标准的属性与-moz属性还是有些不同。 其中一些非标准属性只适用于Mozilla浏览器。 在CSS的兼容时往往不同的...原创 2011-03-04 05:18:05 · 749 阅读 · 0 评论 -
-webkit 谷歌浏览器 （chrome）CSS
OverviewMost browser support custom CSS tags, which are not (yet) part of any standard. These styles are usually prefixed with the browser name. Mozilla uses -moz-, Opera -o- and Safari...原创 2011-03-04 05:29:04 · 467 阅读 · 0 评论 -
firebug for IE6+, Firefox, Opera, Safari and Chrome
来源： http://getfirebug.com/firebuglite 其实很简单，只要在页面的<head></head>之间加入 <script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script> 或者开发模式...原创 2011-04-01 06:01:00 · 121 阅读 · 0 评论 -
特殊符号的写法 （HTML 4.01 符号实体）
本字符实体参考手册包括了数学符号、希腊字符、各种箭头记号、科技符号以及形状。注释： 实体名称对大小写敏感。HTML 支持的数学符号结果 描述 实体名称 实体编号 ∀for all&forall;&#8704;∂part&part;&#8706;...原创 2011-04-04 19:25:23 · 977 阅读 · 0 评论 -
12款很棒的浏览器兼容性测试工具推荐
对于前端开发工程师来说，确保代码在各种主流浏览器的各个版本中都能正常工作是件很费时的事情，幸运的是，有很多优秀的工具可以帮助测试浏览器的兼容性，让我们一起看看这些很棒的工具。Spoon Browser Sandbox点击你需要测试的浏览器环境，安装插件就可以进行测试了。帮助你测试网页在Safari、Chrome、Firefox和Opera浏览器中是否正常，IE以前也有的，网站上说应微...原创 2012-03-08 05:09:56 · 137 阅读 · 0 评论 -
Maximum and Minimum Height and Width in Internet Explorer
Maximum and Minimum Height and Width in Internet Explorer Behold the seventh wonder of the virtual world: max/min-height and max/min-width properties are possible in Internet Explorer! Indeed, b...原创 2013-07-31 02:27:03 · 115 阅读 · 0 评论 -
ASCII Code - The extended ASCII table
ASCII stands for American Standard Code for Information Interchange. It's a 7-bit character code where every single bit represents a unique character. On this webpage you will find 8 bits, 256 chara...原创 2013-08-08 07:44:00 · 1737 阅读 · 0 评论 -
a标签position为absolute时，IE无法点击（a position:absolute bug ie）
为什么要把a标签搞为absolute呢？很多时候为了覆盖在其他html标签上，实现一些点击，比如一个flash广告，要想在整个flash上加一个链接，单击整块flash链接到某个网页。 用一个绝对定位的a标签覆盖在flash上：<style>.flash { width:200px;height;200px;position:relative; }.flash-l...原创 2013-08-09 12:39:23 · 235 阅读 · 0 评论 -
用CSS美化你的滚动条
本文将会告诉你如何用CSS修改/美化浏览器页面上出现的滚动条。改变它们的颜色，调整它们的外形，适配你对页面UI设计。我们首先将会看看谷歌(Webkit)浏览器提供了哪些CSS属性，最后，还将介绍如何用jQuery支持其它类型的浏览器。 各种浏览器对CSS滚动条的支持情况这 里说的Webkit浏览器包括谷歌浏览器，苹果公司的Safari浏览器，以及最新的Opera浏览器。这些浏览器加...原创 2015-06-05 13:12:45 · 448 阅读 · 0 评论 -
Take a Photo and Upload it on Mobile Phones with HTML5
In my daily life, I enjoy taking photos with my smartphone and uploading them to various websites. So I started thinking, “Is it possible to implement these functions in web browser?” Although Dynam...原创 2015-07-07 12:33:09 · 357 阅读 · 0 评论 -
PHP结合HTML5使用FormData对象提交表单及上传图片
FormData 对象，可以把form中所有表单元素的name与value组成一个queryString，提交到后台。在使用Ajax提交时，使用FormData对象可以减少拼接queryString的工作量。 使用FormData对象 1.创建一个FormData空对象，然后使用append方法添加key/valuevar formdata = new FormData()...原创 2015-07-07 12:34:20 · 192 阅读 · 0 评论 -
使用HTML5 FormData轻松完成Ajax表单提交
在我们的日常开发中，经常都会用到Ajax来提交表单。让我们来看一个典型的例子: <form id="myform" action="webservice.php" method="post"> <input type="email" name="email" /> <select name=&原创 2015-07-07 12:37:01 · 387 阅读 · 0 评论