HTML中的列表HTML中列表中共有三种：有序列表、无序列表和定义列表。1、有序列表是一列使用数字进行标记的项目，它使用<li>包含于<ol>标签（ordered lists）内；<ol><li>开始部分</li><li>次要部分</li><li>结尾部分</li></ol>2、无序列表是一组使用黑点状进行标记的项目，它使用<li>包含在<ul>标签（unordered lists）内；<ul><li>关于主题</li><li>关于形式</li><li>关于内容</li></ul>3、定义列表语义上表示项目及其注释的组合，...
HTML5性能优化--减少重绘 在HTML页面完成展现之后，动态改变页面元素或调整CSS样式都会引起浏览器重绘，性能的损耗直接取决于动态改变的范围：如果只是改变一个元素的颜色之类的信息则只会重绘该元素；而如果是增删节点或调整节点位置则会引起其兄弟节点也一并重绘。 减少重绘并不是说不要重绘，而是要注意重绘范围：①改动的DOM元素越深则影响越小，所以尽量深入节点改动；②对某些DOM样式有多重变动尽量合并到一起...
编写有序列表，代码如下：<html> <h2>数字显示</h2> <ol> <li>第一天</li> <li>第二天</li> <li>第三天</li> <li>第四天</li> </ol><h2>字母显示</h2> <ol type="a"> <li>第一天</li> <li>第二天</li> <li>第三天</li> <li>第四天</li> </ol><h2>小写罗马数字显示</h2> <ol type="i"> <li>第一天</li> <li>第二天</li> <li>第三天</li> <li>第四天</li> </ol><h2>大写罗马数字显示</h2> <ol type="I"> <li>第一天</li> <li>第二天<...
radio注册了click事件以后，神奇的是用键盘上的上下左右选择时，居然会触发鼠标事件，滚轮也会触发，这种神奇的事情在mousedown下面是不会发生的。（webkit不能使用上下左右选择） checkbox注册click事件后，奇迹再次上演，当我们用空格选中checkbox时，神奇的click事件再次触发，而mousedown再次与奇迹擦身而过。（webkit还是不能用空格选择） 让我们都用click吧，给这两位老兄减负吧，不要为了他们先天不足给他们绑定一堆事件了，...
position的几种属性值：static, relative, absolute, fixed, inherit<html ><head><meta http-equiv="content-type" content="text/html" charset="gb2312"><style> *{margin:0;padding:0} </style> </head> <body> <p style="position:absolute;height:400px;width:400px;background:yellow;left:80px;top:80px;"><p style="position:absolute;height:200px;width:200px;background:red;left:100px;top:80px;"></p><p style="posi...
方法一: css1.html<html> <head> <title>内联样式(方法一)</title> </head> <body> <a href=”http://www.baidu.com” style=”color:#FF00FF; font-size:80;”>百度一下</a> </body> </html>方法二: css2.html<html> <head> <title>style标签中调用(方法二)</title> <style type=”text/css”> a{color:#FF0000;background:#FFFF00;} </style> </head> <body> <a href=”http://www.baidu.com“>百度二下</a> </body> </html> 方法...
HTML中的下拉列表： Html代码 <select> <option value ="1">Volvo</option> <option value ="2">Saab</option> <option value="3">Opel</option> <option value="4">Audi</option> </select>其中select是显示一个下拉列表(drop down list)出来，option是下拉列表中的项目(item)，而option的文本内容(text content)是下拉列表项目中显示到页面上的值，value是真正需要提交到服务端的值。 显示效果如下所示： 更复杂的下拉列...
注意HTML的语言编码的重要性目录charset编码重要性charset在html什么地方charset标签编码种类charset utf-8介绍charset GB2312介绍推荐网页编码因编码导致网页兼容一、编码重要性 - TOP编码可导致浏览者通过IE时候网页乱码，也可导致p+css的兼容性Hack。二、编码的位置 - TOP三、html编码样式 - TOP<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />通过改变charset=utf-8中的utf-8就可以改变网...
HTML 超链接（锚文本）默认打开方式与默认链接URL地址标签元素一、语法与结构<base target="_blank" href="http://www.lpcblog.com/" />二、Html base超链接默认打开地址与打开方式标签使用说明 1、Target 值： 1、_blank 新窗口打开URL链接 2、_parent 在本网页刷新全新打开对应URL地址 3、_self 4、_top 这里target 值与a链接的target值相同使用方法 2、Href值： 可以是URL地...
1.当输入用户名和密码为空的时候，需要判断。这时候就用到了校验用户名和密码，这个需要在jsp的前端页面写；有两种方法，一种是用submit提交。一种是用button提交。方法一：在jsp的前端页面的头部插入一个js方法：function checkUser(){var result = document.getElementById("userid").value;var password = document.getElementById("userpassid").value;if(result == "" ){alert("用户名不能为空");return false;}if(password ...
一、使用全角空格全角空格被解释为汉字，所以不会被被解释为HTML分隔符，可以按照实际的空格数显示。二、使用空格的替代符号替代符号就是在需要显示空格的地方加入替代符号，这些符号会被浏览器解释为空格显示。空格的替代符号有以下几种：名称编号描述 不断行的空白（1个字符宽度） 半个空白（1个字符宽度） 一个空白（2个字符宽度） 窄空白（小于1个字符宽度）可以用名称或编号作为空格的替代符号，名称必须小...
IE5.5开始支持浮动框架的内容透明。如果想要为浮动框架定义透明内容，则必须满足下列条件。1.与 iframe 元素一起使用的 allowTransparency 标签属性必须设置为 true。2.在 iframe 内容源文档，background-color 或 body 元素的 bgColor 标签属性必须设置为 transparent。具体步骤： 1. 包含框架页的代码。<body bgColor="#eeeeee"> <iframe allowTransparency="true" src="transparent.htm"> </iframe>2.transparent.htm页的代码。...
纵观时下网站，本来网速就有些慢，可是几乎每页都要放什么Banner，栏目图片，版权等一大堆雷同的东西，当然，出于网站风格统一、广告效应的需要，本无可厚非，可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了，有没有办法，让这些雷同的东西一次下载后就不用再下载，而只下载那些内容有变化区域的网页内容呢？ 答案很肯定：应用Iframe标记！ 一、Iframe标记的使用 提起Iframe，可能你早已将之扔到“被遗忘的...
关于px、pt和em的区别，自己有时候也会纠结到底该用什么单位，今天特意查了一些文章，下面这篇虽然很久远了，但解释的比较全面，转载收藏之。点击查看原文（原网址已失效，这是其他站点）这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章，题目有点吓人，但是确实是现在国内网页制作方面的一些缺陷。我一直也搞不清楚px与em之间的关系和特点，看过以后确实收获很大。平时都是用px来定义字体，所以无法用浏览器字体放大的功能...
<!DOCTYPE html> <html> <head> <title>当锚点定位遇上position: fixed</title> <style type="text/css"> * { margin: 0; padding: 0; }body { position: relative; }a { color: white; text-decoration: none; }.nav { position: fixed; top: 0; left: 0; width: 100%; height: 100px; background-color: black; }.part-one, .part-two, .part-three { width: 100%; height: 800px; }.part-one { background-color: red; padding-...