在设计HTML页面的过程中经常会遇到表单元素覆盖样式元素引起的问题，图一就是一个典型的例子。不要小看这个貌似“低级”的问题，即使一些规模较大的网站上类似的问题也绝不鲜见。本文探讨了造成这一问题的根本原因，并提出一种补救办法——之所以说补救办法而不是一劳永逸的解决办法，是因为微软和NetScape这两个巨头也还没有对策。一、HTML元素的显示优先级 HTML中常用的表单元素包括：文本区域（TEXTAREA），列表框（SELECT）...
无意中看到的一个非常不错的小技巧.是关于用CSS处理闭合浮动元素的方法,收藏了.关于闭合浮动元素（clearing float）的方法现在已经很多了，你还不了解的话去old9的blog看看，有一篇闭合浮动元素。这些方法我最喜欢就是 使用:after 伪类动态的嵌入一个用于清除浮动的元素，可惜代码量太大了，看着不够简洁。现在我看到有个方法超级简单。赶紧介绍一下。原文在：http://annevankesteren.nl/2005/03/clearing-floats原理是这样的，外围...
代码如下: Untitled Document .frame{ float:left; margin:2px; } .outer { height: 250px; width: 240px; overflow: hidden; background:gold; position: static !important; position: relative; display: table !important; } #middle { /* for explorer only*/ position: absolute; top: 50%; } #middle[id] { display: table-cell; vertic...
内联级元素(inline-level element)中试图插入块级(block-level element)元素。这样做是不允许的。唯一的能在内联元素中插入块级元素的例外是object标签。那么什么是内联级元素(inline-level element)和块级(block-level element)元素呢？。 块元素(block element)一般是其他元素的容器元素，块元素一般都从新行开始，它可以容纳内联元素和其他块元素,常见块元素是段落标签''P"。“form"这个块元素比较特殊，它只能用来容纳其他块元...
css元素定位 1. position:static|无定位position:static是所有元素定位的默认值, 一般不用注明，除非有需要取消继承的别的定位 example:#div-1 { position:static;} 2. position:relative|相对定位使用position:relative，就需要top,bottom,left,right4个属性来配合，确定元素的位置。如果要让div-1层向下移动20px,左移40px: example:#div-1 { position:relative; top:20px; left:40px;} 如果用到相对定位，紧随他的层divafter是不...
先来看我一个简单XHTML/HTML文件代码（部分），我们的目的是让#container水平居中。<div?id="container"> content Lorem?ipsum?dolor?sit?amet,?consectetuer?adipiscing?elit.Phasellus?varius?eleifend.
字体的处理在网页设计中无论怎么强调也不为过，毕竟网页使用来传递信息的，而最经典最直接的信息传递方式就是文字，所以，了解一点字体的基本知识对于设计来说还是非常重要的。 中文和英文的最大区别就是中文是方块字，英文是拼音文字，这对字体的处理的影响是巨大的。看看下面的图示就会发现，英文字体里的那些变化在中文字体里都弱化了。作为中文的读者，习惯性的接受方块形状做为阅读的单元，其实对于眼睛来说，这是一种容...
动态HTML的出现为用户提供了一种基于传统标准HTML来创建交互式页面的机制。本文主要针对IE 5.0谈谈如何通过其提供的HTML文档对象(DOM)模型使用脚本添加、删除、修改页面中的HTML元素(对象)及元素(对象)内容。 动态更改网页HTML元素(对象)内容 HTML块级元素(对象)提供的4个可读写属性innerHTML、innerText、 outerHTML、outerText来更改元素(对象)内容(如表1所示)。 当设置innerHTML属性时，给定字符串完全替换现有的元素(对象)内容...
前几天做自适应Skin的时候了解了一下块(block)的含义。发现了这样的一个问题。 SPAN元素和DIV元素有什么区别 解决思路： 最明显的区别是：DIV是块元素，SPAN是内嵌元素。块元素相当于内嵌元素在前后各加一个换行。其实，块元素和行内元素也不是一成不变的，只要给块元素定义display:inline，块元素就成了内嵌元素，同样地，给内嵌元素定义了display: block就成了块元素了。 具体步骤：div,span{border:1px solid #f00;margin:2} d...
推荐下面的代码代码如下:a {outline: none; /* for Forefox */ } a {star:expression(this.onFocus=this.blur()); /* for Ie*/ }下面的代码比较麻烦 我们采用htc文件的办法来解决这个问题。首页将以下代码保存为link.htc文件。 代码如下: function hscfsy(){ this.blur(); } 在HTML文件中写入以下代码，建立一个链接： jb51.net 我们开始为此链接定义CSS样式： a { display:block; width:100px; height:30px...
实现方法很简单：设置 img 元素为块元素（display:block;），并赋一个 padding 值。 Image Demo div { background: url('http://img.jb51.net/images/blur.jpg') no-repeat top left; width: 232px; height: 200px; } img { display: block; background: url('http://img.jb51.net/images/parallax.gif') no-repeat bottom left; padding: 93px 100px 75px 100px; } [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 代码...
经常会遇到这样的页面布局：在一排显示几个不同的区域内容，但它们相对于页面是居中对齐的。注意这些区域内容不只是文字，也许还有图片或者其它元素混合而成。一般这样的布局我们很容易想到要用浮动float，但是怎么样居中对齐而又兼容低端浏览器哪？请接着往下看。 首先看html代码：高大上平台|关于我们|联系我们|服务条款|人才招聘|帮助中心|帮助中心|帮助中心|帮助中心|客服中心有人会说这些item都是文本，其实把ul换成其它元素（...
本篇文章给大家带来的内容是关于CSS如何去除inline-block元素间的间距？（多种方法），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。一、现象描述真正意义上的inline-block水平呈现的元素间，换行显示或者空格隔开的情况下会有间距，这是因为浏览器在解析时，会将换行等读取成一个空格导致。二、移出空格的方法我们可以去掉元素之间的换行和空格，这样间距自然就没有了，但是这样会降低代码的可读性，不可取。<...
本篇文章给大家带来的内容是关于CSS中伪类和伪元素的详细介绍（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。一、伪类伪类包含两种：状态伪类（UI 伪类）和结构性伪类。(1)状态伪类是基于元素当前状态进行选择的。在与用户的交互过程中元素的状态是动态变化的，因此该元素会根据其状态呈现不同的样式。当元素处于某状态时会呈现该样式，而进入另一状态后，该样式也会失去。常见的状态伪类主要包括：...
这篇文章给大家介绍的是关于通过CSS定位操作的动态元素大小的内容，有感兴趣的朋友可以看一看，话不多说，我们直接看来看具体的内容。不使用宽度和高度或JS给体积提供元素的小技巧。这是一个很简单的技巧，但是很多人不知道。（推荐教程：CSS视频教程）假设你想制作一个包含每个屏幕100px以外的所有屏幕的模式框，你将如何解决这个问题？假设你想要制作一个覆盖所有屏幕的模态框，除了每个边界的100px，你会如何解决这个问题？HTML...