Loading...
所在位置:
论坛首页
->
┈┋电脑网络技术区┋┈
->
网页制作技术
-> 帖子列表
[
详细列表
]
新的帖子
发起交易
任务悬赏
发起投票
精华贴
回收站
贴子审核
redrat
<<
>>
站长俱乐部
学习网页中的图片如何应用CSS的滤镜的效果
2008-4-27
有时候,我们需要给网页中的图片加一些特殊的效果,比如透明、扭曲、阴影或者翻转等,我们一般都会想到用Photoshop等一些图形软件来处理,其实我们也可以利用CSS(层叠式样表)提供的一些滤镜来处理,这对于不熟悉Photoshop的网友来说,是非常好的一件事。 我们先从较简单的开始,介绍几个没有参数的滤镜。 1.Gray滤镜 Gray滤镜的作用是产生黑白效果 使用方法:<img src="http://www.zzhtz.com/upload_files/43/Rjprybhttp://www.zzhtz.com/upload_files/43/XhN2R6http://www.zzhtz.com/upload_files/43/JhurPbhttp://www.zzhtz.com/upload_files/43/Azsxq7http://www.zzhtz.com/upload_files/43/vdmfldhttp://www.zzhtz.c...
[
依恬
] 点击:108 回复:0 最后更新: 2008-4-27 10:47:01
查看全文
为什么我的设置的div最小高度不对
2008-4-27
问:为什么我设置的div的高度是1px,为什么看不到效果啊,div老是那么高。 答:给你的div加一个属性: font-size:0; 说明: 这个问题出现在IE6中; IE6中的div默认有个最小字体高度,div的最小高度就是这个高度,除非你改变这个字体的大小。这样来加: .style1{height:1px;font-size:0;} 比如想用一个div来做一个1px高的红色线条 在没有设置字体大小的时候会得到的情况: 运行代码无着色模式复制打印?< style type = "text/css" > .style1{ height:1px; background:red; ...
[
依恬
] 点击:125 回复:0 最后更新: 2008-4-27 10:46:43
查看全文
CSS长度单位的区别 - pt,px和cm的区别
2008-4-27
在CSS样式表中,我们经常会看到pt, px,em,ex ,in等这类长度单位。它们各是什么意思,有什么区别呢? 我又写了另外一个HTML例子,测试一下cm。 在CSS样式表中,长度单位分两种:相对长度单位,如px, em等 绝对长度单位,如pt,mm等也谈px和pt的区别 经常看 到有人拿px和pt比较,主要是为了争辩在确定字体大小(font-size)或其它CSS属性大小时,用什么样的CSS长度单位更加好。有人说,用pt更好,因为pt是绝对长度单位,不会因为屏幕分辨率大小,或者其它因素而改变。arw("]Fs", ark4); 我去做了一个测试,写了这样一个HTML例子。代码如下: <html> <head ><title >CSS...
[
依恬
] 点击:133 回复:0 最后更新: 2008-4-27 10:46:21
查看全文
网页未知高度的非表格垂直对齐
2008-4-27
表格单元格 行内块(inline-block) 第一个比较好理解,第二个很多人可能会忽略。比如,很多人在图片与文本混排的时候想让图片相对于文本垂直居中除了用IE的私有特性 valign="absmiddle"别无他法。记住,默认下图片就是属于inline-block,你只需简单的img {vertical-align:middle;}即可。 那么,我们进入主题。现在我们由于某些特殊需要两个并排的div想实现垂直居中。如前所述,div非表格,但是当代的浏览器中除了IE都支持display:table-cell。恰好,IE支持dispaly:inline-block,那么我们就用两种方式为当代浏览器实现非表格的垂直居中,殊途同归。 表格单元格 行内块(inline-block)第一个比较好理解,第...
[
鞋的恋爱
] 点击:131 回复:0 最后更新: 2008-4-27 10:44:15
查看全文
界面讨论网页中超链接的下划线
2008-4-27
关于超链接中的下划线这个及细节的问题,想必大家都有过讨论和思考,最重要的原则即:让使用者清楚的区分超链接文本和其他文本形式,并潜意识知道可以点击。但对于是否可以潜意识知道可以点击,还是有争议的,不同的人,不同的环境会有不同的见解。 不妨分几个场景讨论一下: 1. 导航区域,潜意识我会去点击。 即便有下划线也是个“古老形式”的摆设,所以一般没有下划线;好的设计不仅满足点击,还满足视觉的层级关系。 2. 整页全是链接,下划线成了可有可无的表现。 象新浪、搜狐首页都是可以点击的,所以下划线的有无意义也就不大,猫扑在首页设计中就去掉了可有可无的下划线。(下图自上而下依次为:新...
[
鞋的恋爱
] 点击:114 回复:0 最后更新: 2008-4-27 10:42:06
查看全文
使用CSS处理表格边框样式化
2008-4-27
在以前的web开发栏目中,我介绍了不少处理HTML表格的方法,尽管现在使用表格来布局网页的方法已经不再时髦了,但是您依然可以使用表格来显示表列数据。显示和样式化表格的方法有很多种,在这篇文章中,我将介绍使用CSS对表格边框进行样式化的方法。 链接 CSS2表格模型是基于HTML 4.01表格模型的。表格包含了一个可选的锚标记和单元格以及数据行,表格模型包含以下的元素:表格、锚、数据行、数据行组、数据列、数据列组和单元格。这篇文章将集中讲解表格中各个元素的边框处理方法。 边框 根据不同的需求,您可以对表格和单元格应用不同的边框。您可以定义整个表格的边框也可以对单独的单元格...
[
鞋的恋爱
] 点击:124 回复:0 最后更新: 2008-4-27 10:41:43
查看全文
用tabIndex轻松实现网页导航
2008-4-27
最近,当我在一个网站上输入表格数据时,我填写了一栏,并点击[Tab]键移到下一栏;当我抬头时,我惊奇的发现光标跳到页面下方的另一栏中。我用鼠标将光标移到正确的文本栏中,但不久[Tab]键又再次出现问题。这一情形使我想了解一下页面设计,以及tabIndex属性如何通过键盘帮助导航。 通过[Tab]键访问元素 HTML DOM tabIndex特性允许你设置或返回一个HTML元素的tab键顺序。IE 4.0最先支持此特性。起初,只有真正可通过[Tab]键访问的元素受到支持,如输入栏、链接等。如今,所有的网络浏览器,以及页面上显示的所有元素都支持此特性。在应用它之前,你可以双击HTML规范保证某个元素支持此特性。 tabIndex特性 应用tabIndex特性是一...
[
鞋的恋爱
] 点击:111 回复:0 最后更新: 2008-4-27 10:41:23
查看全文
如何为网页设置背景音乐
2008-4-27
往网页中插入背景音乐会使页面声色不少。但是在使用音乐背景的时候要注意,背景音乐不能太大,否则文件传输会成问题,从而使网页的吸引力下降。 在HTML中有embed标签可以实现背景音乐的插入功能,其语法规则如下: <EMBED src="music.mid" autostart="bool" loop="n" width="m" height="k" > 下表给出有关上面的语法的一些具体的值和含义: src 音乐文件的路径及文件名; autostart true为音乐文件上传完后自动开始播放,默认为false(否) loop true为无限次重播,false为不重播,某一具体值(整数)为重播多少次 volume 取值...
[
鞋的恋爱
] 点击:110 回复:0 最后更新: 2008-4-27 10:40:59
查看全文
用CSS区分浏览器Firefox、IE6、IE7的特效代码
2008-4-27
用CSS代码来判断浏览器是Firefox、IE6、IE7??的网页特效代码 <!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><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>关于用CSS区分Firefox、IE6、IE7chinahtml.com</title><style type="text/css">...
[
鞋的恋爱
] 点击:103 回复:0 最后更新: 2008-4-27 10:40:09
查看全文
CSS布局中如何组织样式表以便于简化、维护?
2008-4-27
对于简单的Web站点,可以只使用一个CSS文件。对于大型的复杂站点,对样式表进行分割以便简化维护是一种好做法。如何分割样式表是需要仔细考虑的。我一般用一个CSS文件处理基本布局,用另一个文件处理版式和设计修饰。这样的话,在布局确定之后,就很少需要修改布局样式表。这可以防止布局样式表被意外地改动或破坏。 还可以进一步细分,比如用单独的CSS文件处理颜色。这样的话,如果希望提供新的颜色方案,就只需要创建一个新的颜色样式表。如果站点上有许多表单,那么可以用单独的CSS文件处理所有表单样式。可以只在需要时链接这个文件,从而减少最初的下载开销。如果站点上的一些页面与站点的其余部分很不一样,那么可以考虑...
[
鞋的恋爱
] 点击:110 回复:0 最后更新: 2008-4-27 10:39:52
查看全文
如何定义CSS元素的显示属性
2008-4-27
处理HTML元素最关键的一个窍门,没有任何特别的,就是理解他们是如何工作的。大部分页面都可以使用一点点的标签组合起来,你可以为每一个你选定的标签样式化。浏览器默认的可视化样式元素由变化的字体样式、边界、补白和,和重要的,显示类型。 最基本的显示类型是内联inline、块block和清除none,他们分别可以用inline、block和none的值赋予display属性来操作。 i nline就如本身语义所明示的,显示随着行流动的元素。锚和强调元素都是传统的内联元素。 block使元素前后都有断行。标题和段落元素都是传统的块元素的例子...
[
鞋的恋爱
] 点击:89 回复:0 最后更新: 2008-4-27 10:39:34
查看全文
符合XHTML标准DIV+CSS布局的网站对SEO的影响
2008-4-27
符合XHTML标准DIV+CSS布局的网站,下面说说在SEO方面的影响。 代码精简 使用DIV+CSS布局,页面代码精简,这一点相信对XHTML有所了解的都知道。代码精简所带来的直接好处有两点:一是提高spider爬行效率,能在最短的时间内爬完整个页面,这样对收录质量有一定好处;二是由于能高效的爬行,就会受到spider喜欢,这样对收录数量有一定好处。 表格的嵌套问题 很多SEOer在其文章中称,搜索引擎一般不抓取三层以上的表格嵌套,这一点一直没有得到搜索引擎官方的证实。我的几项实验结果没有完全出来,但根据目前掌握的情况来看,spider爬行Table布局的页面,遇到多层表格嵌套时,会跳过嵌套的内容或直接放弃...
[
鞋的恋爱
] 点击:79 回复:0 最后更新: 2008-4-27 10:39:17
查看全文
背投广告设计:用最少的时间来做最效率的事情
2008-4-26
对于背投广告的原理来说并没有什么难度,无非打开的窗口失去焦点(blur),而原来页面得到焦点(focus)。但对于流行的浏览器来说,如果非用户行为的弹出窗口(即 onload 时,直接window.open ),会被浏览器默认拦截。 背投广告,既然被称为广告,那如何才能让广告主的钱花得实在,花得乐意呢? 我们可以增加判断,如果该弹出窗口被浏览器拦截,则只要用户点击页面就触发 window.open 事件,这样一般不会拦截,浏览器会认为这是用户的默认行为。 代码可编写如下: var $E = YAHOO.util.Event;var adPopup;var popAd = function(sURL,sName,sFeatures,bReplace) { if (adPopup) retu...
[
中国话
] 点击:139 回复:0 最后更新: 2008-4-26 11:28:42
查看全文
CSS+DIV设计实例:超酷的竖排导航栏
2008-4-26
HTML: 以下为引用的内容:<div id="navcontainer"> <ul id="navlist"> <li id="active"><a href="#" id="current">Item one</a> <ul id="subnavlist"> <li id="subactive"><a href="#" id="subcurrent">Subitem one</a></li> <li><a href="#">Subitem two</a></li> <li><a href=&...
[
中国话
] 点击:112 回复:0 最后更新: 2008-4-26 11:27:27
查看全文
CSS+DIV设计实例:纯CSS制作下拉导航菜单
2008-4-26
以下为引用的内容:<style type="text/css">.menu {font-family: verdana, sans-serif; width:750px; position:relative; font-size:0.85em;padding-bottom:250px;}.menu ul {padding:0; margin:0;list-style-type: none;}.menu ul li {float:left;position:relative;}.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000; width:139px; height:3em; color:#000; border:1px solid #fff; border-width:1px 1px 0 0; background:#dfc184; padding-left:10px; line-height:3em; 字串6 }* html .menu ul li a, .menu ul li a:visited {width:149px;w\idth:139px;}.menu ul...
[
中国话
] 点击:113 回复:0 最后更新: 2008-4-26 11:26:37
查看全文
DIV+CSS设计实例:透明的导航菜单
2008-4-26
这是个透明的CSS菜单,兼容性:IE5.5+、Opera、Frefox、Netscape。 CSS代码: 以下为引用的内容:body{ font: 80% Arial,sans-serif; background: #666; } #nav{ width: 170px; background: url(navbg.gif) bottom; list-style-type: none; margin: 0; padding: 0; } #nav a{ display: block;  ...
[
中国话
] 点击:101 回复:0 最后更新: 2008-4-26 11:25:40
查看全文
CSS让表格的溢出内容隐藏起来
2008-4-26
以下为引用的内容:<div style="width:150px;height:50px;overflow:hidden;"><table cellspacing="0" cellpadding="0"><tr><td><a href="http://homepage.yesky.com/" class="bluekey" target="_blank">网页</a>中国站长站中国站长站照顾站长站中国站长站中国站长张卓站长站长那中国站长站中国站长站中国站长站照顾站长站中国站长站中国站长张卓站长站长那中国站长站</td></tr><tr><td>中国站长站中国站长站照顾站长站...
[
中国话
] 点击:85 回复:0 最后更新: 2008-4-26 11:25:21
查看全文
CSS教程:使用ul进行网页的多列布局
2008-4-26
几天在用CSS写三列布局的时候突然想到的这样一个方法,这个想法自己都觉得有些疯狂,如果其中有什么不对的地方请各位不吝指教。 当需要写一个三列布局的时候,一般情况下我会选择使用如下的DIV布局方式: 使用这样的嵌套方式无疑可以使代码出错的概率减少很多,但同时这样的布局也略显复杂,对于后期的维护也略显不便。我们在布局导航时经常会使用到一个方法,那就是使用<ul>列表来进行布局,而导航可以形容为多列式的布局,既然如此,那么我们也就可以使用<ul>来进行页面的多列布局。 这是一个固定宽度的布局,也就是说流动性不强,流动性的布局目前还没有试验过,等有时间了再试验...
[
中国话
] 点击:74 回复:0 最后更新: 2008-4-26 11:24:37
查看全文
CSS盒模型制定网页的宽度和高度的原理
2008-4-26
当我们布局一个网页的时候,经常会遇到这样的一种情况,那就是最终网页成型的宽度或是高度会超出我们预先的计算,其实就就是所谓的CSS的盒模型造成的。 #test{margin:10px;padding:10px;width:100px;height:100px;} 如上一段的代码,很多时候我们会把它所占的位置计算成width:120px,height:120px,因为在正常的理解下,padding是内边距,应该是包括在width里面的,而margin是外边距,所以width=margin-left + margin-right + width,但是浏览器对于CSS盒模型的解释却并非如此,所以最终我们会发现布局出来的网页宽度与高度都会超出我们预期的计算,最后造成显示上的错位。 其实不然,对于test所占的位置的真正计算应...
[
中国话
] 点击:77 回复:0 最后更新: 2008-4-26 11:24:18
查看全文
新手必须掌握的8个CSS经典布局的技巧
2008-4-26
1.若有疑问立即检测 在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS都有检测工具可用,请见http: //validator.w3.org请注意,在文件开头的错误,可能因为不当的结构等因素造成更多错误;我们建议先修正一些最明显的错误之后重新检测,这样也许会让错误数量爆减。 2.使用浮动功能时记得适当清除指令 浮动是个危险的功能,未必会产生您所期望的结果。如果您遇到浮动元素延伸到外围容器的边框或者其他不正常情况,请先确定您的做法是正确的。请参阅EricMeyer在ComplexSpiralConsultingWeb网站上的教学。 3.边界重合时利用padding或border来避免 您可能会为了一点不应该出现的空间而...
[
中国话
] 点击:103 回复:0 最后更新: 2008-4-26 11:24:00
查看全文
dreamweaver制作隐藏边框表格
2008-4-23
1.样式一 无边框表格 代码如下:<table width="200" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF9966" frame=void><tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr><tr><td>&nbsp;</td><td>&...
[
我爱卷毛
] 点击:177 回复:0 最后更新: 2008-4-23 10:09:22
查看全文
Dreamweaver中线条美化
2008-4-23
1.样式一 嘿嘿,这是线条 代码如下:<hr width="50" size="50" color="#ff0000" align="left">2.样式二 实心的线条 代码如下:<hr width="200" size="4" noshade align="left">3.样式三 代码如下:<hr width="1" size="110" color="#00ff00" align="center">说明:线条的color属性在netscape中并不支持,而且作为竖线,仅能在IE中显示100像素。4.样式四 代码如下:<hr size=1 style="COLOR: red;border-style:dotted;width:300"...
[
我爱卷毛
] 点击:143 回复:0 最后更新: 2008-4-23 10:01:19
查看全文
设计网页文字要像聪明女孩穿衣服一样
2008-4-23
这世上“没有丑女人,只有懒女人”这是女人美丽圣经里的最精彩的一句话了,一个女人只要舍得花时间琢磨怎么保养,怎么打扮,总能够找到方法展现自己美丽的一面的。界面设计何尝不是如此?那就让我们来看看聪明女人的穿衣之道里有没有什么做设计可以借鉴的地方。 原则一:全身搭配的衣服主色不要超过三种 不管什么样的衣着都应该有一个主色调,代表穿衣者想彰显的气质,她不可能样样都强调——也许她有安静的一面,犹如蓝色;也可能有调皮的一面,犹如橙色:知性的一面,犹如白色:可爱的一面,犹如粉色……但是她如果把这些颜色同时穿出来,那她除了像只花蝴蝶外将一无是处。这就好比一个页面,它的主要字体和颜色搭配不应该...
[
冰凝
] 点击:165 回复:0 最后更新: 2008-4-23 10:00:08
查看全文
网页设计中长串英文字符自动换行
2008-4-23
在一个单元格内,中文字符如果超出了单元格的宽度,都会自动换行,但奇怪的是,如果全是英文的话,不过你将TD的宽度设为多大,英文字符都不会自动换行,只会一直延伸.如果做英文站点,动态输出内容,这个就麻烦了.幸好有个简单的办法可以解决:就是用CSS.只需用到:word-break:break-all就可以了. 例如:<table style="table-layout:fixed"><tr><td width="100" style="word-break:break-all">testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttestte...
[
冰凝
] 点击:140 回复:0 最后更新: 2008-4-23 9:59:48
查看全文
Dreamweaver CS3中Spry详细区域功能
2008-4-23
Dreamweaver CS3中集成了Spry功能我们都知道,Spry具有对XML数据处理的功能我们也见识过,不过对于Spry的详细区域功能似乎很少见。 Spry详细区域有点类似于新闻系统中的新闻列表页和主详细页的功能。比如我们看新闻时,其中有一个页面只会显示所有新闻的标题,当对该标题感兴趣时可以单击该标题打开一个新的网页,就可以查看到该新闻的全部内容了。那么显示所有标题列表的页面我们称为“主页”,而显示具体新闻内容的页面称为“详细页”。 很显然,这个主详细页最起码得是两页。而我们使用的Spry详细区域可以在一张网页上显示,并且是无刷新的 一,新建网页,绑定Spry XML 数据集 在网页中打开【插入...
[
冰凝
] 点击:116 回复:0 最后更新: 2008-4-23 9:59:08
查看全文
CSS Frameworks的概念
2008-4-23
最近看到N多介绍CSS框架,前些天我说过一句话:“在我有限的视野里,还没见到可以真正可以称得上css框架的东东~”,当然也可能是我的视野太小了,或者是说世界太大了,我自己还是感觉还有一大堆我看不到的东西。 先来看一下一个我比较认同的概念: 框架可分为白盒(White-Box)与黑盒(Black-Box)两种框架。 基于继承的框架被称为白盒框架。所谓白盒即具备可视性,被继承的父类的内部实现细节对子类而言都是可知的。利用白盒框架的应用开发者通过衍生子类或重写父类的成员方法来开发系统。子类的实现很大程度上依赖于父类的实现,这种依赖性限制了重用的灵活性和完全性。但解决这种局限性的方法可以是只继承抽象父类,因为抽象类基本...
[
点点头
] 点击:117 回复:0 最后更新: 2008-4-23 9:57:37
查看全文
CSS实现表格单元格强制换行和强制不换行
2008-4-23
以前总结过Div的换行和不换行的css写法。但对于表格单元格只知道一个属性nowrap可以使其不换行。 近日有此需要,但发现加上nowrap在某些情况下还是会换行!无奈,没有一个强制不换行的方法吗? baidu了一下,令俺非常欣慰,还真的找到了办法,问题解决了。 实现方法(原文copy过来):====================================== 引用 用CSS实现表格单元格数据自动换行或不换行 1、自动换行:<style type="text/css">.AutoNewline{ word-break: break-all;/*必须*/}</style> <table><tr> <td class="AutoNewline&qu...
[
点点头
] 点击:162 回复:0 最后更新: 2008-4-23 9:57:12
查看全文
css中子元素浮动后父容器的闭合
2008-4-23
关于闭合浮动元素(clearing float)的方法现在已经很多了,你还不了解的话去old9的blog看看,有一篇闭合浮动元素。 这些方法我最喜欢就是 使用:after 伪类动态的嵌入一个用于清除浮动的元素,可惜代码量太大了,看着不够简洁。现在我看到有个方法超级简单。赶紧介绍一下。 原理是这样的,外围元素之所以不能很好的延伸,问题出在了overflow上,因为overflow不可见。见W3C的解释: In addition, if the element has any floating desc...
[
点点头
] 点击:166 回复:0 最后更新: 2008-4-23 9:56:52
查看全文
使用xml构建Ext menu菜单
2008-4-23
废话就不多说了,将主要代码及效果图附上:菜单效果:、代码如下:var menuObj=[{text:"快捷",icon:'etc/default/images/icons/quick.gif'},'-'];//下面两个函数用于解析xml为树结构输出function createXMLMenu(xmlsrc) {var xmlDom=loadXML(xmlsrc);//加载xml串或url,loadXML函数的定义见http://ajaxbbs.net/blog/post/268/var str=menuItemFromXML(xmlDom.documentElement||xmlDom);&nbs...
[
点点头
] 点击:126 回复:0 最后更新: 2008-4-23 9:56:34
查看全文
橙蓝互换的CSS翻页效果
2008-4-23
CSS翻页效果在实际开发中是最常遇见的情况下面的图片是本案例中的链接背景图片: 下面是XHTML编码:Example Source Code <divid="pagebar"><ahref="#"><<</a><spanclass="page_now">1</span><ahref="#">2</a><ahref="#"&am...
[
点点头
] 点击:188 回复:0 最后更新: 2008-4-23 9:56:14
查看全文
热门帖子
第6页 共217页 本页30条 主题数 6504
<<
>>
普通贴
精华贴
固顶贴子
总固顶贴子
商品贴子
投票贴子
结贴
锁帖
首页 | 购买指南 | 商业版本 | 虚拟主机 | 特色介绍 | 下载中心 | 支付方式
Copyright 2004-2008 BBSGood.com Powered By:
BBSGood.Speed Version 5.0
咨询电话:
0575-85513832、0575-85513825
(传真)、7*24小时咨询服务:
13606552007
不良信息举报中心 浙ICP备05029817号
业务QQ:
38958768
、客服QQ1:
415896239
、客服QQ2:
343896043
、MSN:
jccsxx@hotmail.com