2017-04-22 / CSS+DIV
在苹果的iphone和ipad设备上, form表单的submit按纽会被显示成圆角, 就像是加了border-radius:20px一样,
但在电脑上就没问题, 显示如下:

百度查了查终于查到了原因, iPhone上的safari解析input[type="submit"]和input[type="reset"]按钮会以苹果浏览器的默认UI渲 染,这样就出现我刚才那种现像,我们在样式中明确的设置了button的圆角值,但到iPhone的safari上就不生效了。阅读全文...
2009-09-26 / CSS+DIV
*{ font-size:12px; margin:0; padding:0;}
方法1:
#testBox{border:1px solid #cccccc;padding:5px;width:220px;
min-height:100px;  /*高度最小值设置为:100px*/
height:auto !important; /*兼容FF,IE7也支持 !important标签*/
height:100px; /*兼容ie6*/
方法2:
/*单独用下面这个方法也可以实现*/
height:expression(this.height < 100 ? "100px" : this.height+"px");


阅读全文...
2009-09-12 / CSS+DIV

一,PNG图片透明的设置!(很多朋友应该在网页制作上遇到PNG透明图片的处理。网页默认是不能识别PNG透明度的?)

  解决方法,调放JS文件就OK.

二,表格边框的问题!

BORDER-COLLAPSE: collapse

三,图片等比例缩放 ( 想不到CSS也可以图片等比例缩放这一招,并且已测试通过,发代码如下,不懂者留言询之 )

解决方案一:(史上最好的CSS用于图片等比例代码)

img {width:expression(this.width > 100 && this.width > this.height ? 100 : true); height: expression(this.height > 100 ? 100 : true); }

阅读全文...
2009-06-08 / CSS+DIV

当你看到<input>这个html标签的时候,你会想到什么?一个文本框?一个按钮?一个单选框?一个复选框?……对,对,对,它们都对。也许你可能想不到,这个小小的input竟然可以创造出10个不同的东西,下面是个列表,看看,哪些是你没有想到的:

<input type="text" /> 文本框
<input type="password" /> 密码框
<input type="submit" /> 提交按钮
<input type="reset" /> 重置按钮
<input type="radio" /> 单选框
<input type="checkbox" /> 复选框
<input type="button" /> 普通按钮
<input type="file" /> 文件选择控件
<input type="hidden" /> 隐藏框
<input type="image" /> 图片按钮
所 以你可能会说,input真是一个伟大的东西,竟然这么有“搞头”,但是当你真正在项目中试图给不同的控件设置不同的样式时,你就会发现,input真 的可以把“你的头搞大”。我不知道为什么当初要给input赋予那么多身份,但是,他的“N重身份”给网站设计者的确带来了不少的麻烦。好在,劳动人民是 伟大的,解决问题的办法还是有滴~,虽然它们都有各自致命的缺点 Orz… 解放方法大致归纳一下,列表如下(小弟才疏,错误遗漏难免,还请各位高人指点):

阅读全文...
2009-06-06 / CSS+DIV
一.选择符模式
模式/含义/内容描述

*
匹配任意元素。(通用选择器)
E
匹配任意元素 E (例如一个类型为 E 的元素)。(类型选择器)
E F
匹配元素 E 的任意后代元素 F 。(后代选择器)
E > F
匹配元素 E 的任意子元素 F 。(子选择器)
E:first-child
当元素 E 是它的父元素中的第一个子元素时,匹配元素 E 。(:first-child 伪类)
E:link E:visited
如果 E 是一个目标还没有访问过(:link)或者已经访问过(:visited)的超链接的源锚点时匹配元素 E 。(link 伪类)
E:active E:hover E:focus
在确定的用户动作中匹配 E 。(动态伪类)
E:lang(c)
如果类型为 E 的元素使用了(人类)语阅读全文...
2009-06-04 / CSS+DIV
Div+Css网页布局一直以来是用Css制作网站的精华,一个好的网站多半是由于其合理而有意义的布局使得网站更具表现力。
正由于其是精华因此它也成为了Css学习的一个重点和难点。特别是用Position 属性布局的问题一直是Css新手的一个难点,因为绝对定位和相对定位的书面解释语通常说得比较抽象,并且里面包含一些专业术语,因此初学者看起来会比较吃力,比较难懂。
因此我在此所谈论的是在列出书面表达的同时,用图片和实际情况给大家一种更加直观明了的介绍,这样可以让大家从根本上理解和巩固Position的含义。 当你真正理解了Position属性的定义之后,我相信聪明的你定可阅读全文...
2009-01-14 / CSS+DIV

#head p    p是head这个容器内的标签样式

 

#body p这种选择符写法的意思就是,id为body的容器中的p标签的样式
所以外面必须有个id为body的容器,这个容器可以是div,p,td等等你用什么都可以的
<div   id="body"><p>0000000</p></div>
或者
<p id="body"><p>0000000</p></p>
或者
<td id="body"><p>0000000</p></td>
或者
<span id="body"><p>0000000</p></span>

等等都可以的,不知道你明白了没有。

阅读全文...
2009-01-13 / CSS+DIV
  1. 添加全局CSS
  2. 添加当前页面统一CSS
  3. 将页面分成几个模块
  4. 在每个不同模块上使用id挂钩,相同模块上使用class挂钩
  5. 添加每个模块的统一CSS
  6. 将每个模块分成几个子模块,并且回到第4步开始循环直至样式添加完成。

编写良好的CSS是一个设计问题,而不是一个实现问题。我们首先应当将编写特殊性非常低的全局CSS内容,也就是我们 常用的reset.css 。它是我们整个网站中所有页面的默认样式。

如果有哪个页面具有独特的统一样式,如某一页的背景与其他页面不同,那么我们可以给某一页面添加ID,然后在ID下编写当前页面的统一CSS。

body#special{ background-color:black;}

统 一样式编写好后,我们将页面分成几个模块,如果这些模块具有基本相同的样式,那么使用class挂钩,如果样式并非相同,那么使用id挂钩,以后每次分模 块时都应当遵循这一原则,因为class的特殊性不高,所以如果不是看起来显然类似的模块,就不应当使用class。id的名字通常可以模块的用途作为名 字。如 headbottom 等。id selector在层叠中起了关键作用,因为id具有排他性,还具有较高的特殊性,能够防止CSS规则被不经意的覆盖。

阅读全文...
2009-01-12 / CSS+DIV

CSS 规则的优先级是Web前端开发人员必须理解的一个概念,我们常用的添加样式的方法有4种。

  • inline style
  • embeded style
  • external style
  • user style

inline style是丑陋的,它们穿梭在HTML文档中,与HTML元素扭成一团,给Web前端开发人员造成了许多麻烦。它们往往以这样的面目出现:

<p style="color:red;">This is a paragraph.</p>

embeded style比inline style绅士一些,它们也寄宿在HTML文档中,但是它们不屑于与HTML元素扭成一团。它们往往在 <style> 元素中出现:

<style type="text/css" media="screen"> p{ color : red; }</style>阅读全文...
2009-01-11 / CSS+DIV
4.5.1 值的继承

继承也是基于文档树的,文档树中元素的某些属性可以被其子元素继承,每一个CSS属性都定义了它能否被继承。例如有下列代码,其在浏览器内显示如图所示。

p { color: green; }
<p>文档树中一元素的<strong>某些值</strong>可以被其子元素继承。</p>

要设定文档的某些缺省样式属性,可以在文档树的根上设定该属性,如果这个属性可以继承,则其后代元素将继承这个属性,例如color、font-size等属性。在(X)HTML中,<html>或<body>元素可以实现这一功能。例如:

body { color: black; }


由于color属性是可继承的,所有<body>元素的后代都继承颜色值为“black”。
指定的百分比值不被继承,但是计算值可以被继承。例如:

阅读全文...