Loading...
所在位置：
论坛首页
->
┈┋电脑网络技术区┋┈
->
网页制作技术
-> 帖子列表
［
详细列表
］
新的帖子
发起交易
任务悬赏
发起投票
精华贴
回收站
贴子审核
redrat
<<
>>
站长俱乐部
一个效果很不错的CSS列表
2008-4-23
CSS代码：Example Source Code [*{margin:0;padding:0;list-style:none;border:none;}body{font-size:12px;font-family:Verdana;line-height:1.8;padding:30px;}.c{clear:both;}a:link,a:visited{color:#FFF;text-decoration:none;}a:hover,a:active{color:#FFCC00;text-decoration:underline;}.info{background:#06518A;width:500px;padding:25px10px10px10px;}.infodiv{border:2pxsolid#B48E47;background:url(bg.gi...
[
年少轻狂
] 点击:214 回复:0 最后更新: 2008-4-23 9:54:50
查看全文
网页设计中清除浮动的最优方法
2008-4-23
在CSS群里讨论一个margin的问题中无意间发现overflow也可以用来清除浮动，嘿嘿，这个方法不单使用简单，而且FF、OP、IE7都支持，从此可以告别那又长兼容性又差的FF清浮动的方法了。方法真的很简单，只要为需要清浮动的标签加上overflow这个属性。CSS代码:ul{list-style:none;height:auto;margin:0;padding:0;background-color:#436973;}li{float:left;width:80px;height:80px;background-color:#83B1DF;}.demo{clear:both;border:1px solid #FF00FF;margin-bottom:5px;}.overflow{overflow:auto;zoom:1;background-color:#43FF73;}ul{list-style:none;height:auto;margin:0;padding:0;background-color:#436973;}li{float:left;width...
[
年少轻狂
] 点击:171 回复:0 最后更新: 2008-4-23 9:54:08
查看全文
控制网页文件大小通过精简CSS实现
2008-4-23
尽管对于现如今的带宽来说，网页文件那仅以K来算的大小实在是微不足道，但如何将这以K来计算的网页文件精简到最小还是网页设计师们所应该考虑的问题之一。 众所周之，在不影响整个网页构架与功能的情况下，网页文件越小越好，因为更小的网页文件有利于浏览器对网页的解释时间缩到更短，自然访客也就不用面临等待网页缓慢呈现的烦躁了，这一点对于那些带宽少网速慢的用户犹为明显。试想一下，你会是希望打开一个网站的时候整个站点马上呈现在你面前呢？还是喜欢花上十几秒甚至是几分钏来看整个站点一点一点的被浏览器解释出来呢？ 在Table布局的时代，代码无数次的随着表格在页面里重复，致使整个网页文件变得臃肿无比，代...
[
年少轻狂
] 点击:168 回复:0 最后更新: 2008-4-23 9:52:37
查看全文
推荐的CSS 书写顺序
2008-4-23
//显示属性displaylist-stylepositionfloatclear //自身属性widthheightmarginpaddingborderbackground //文本属性colorfonttext-decorationtext-alignvertical-alignwhite-spaceother textcontent...
[
年少轻狂
] 点击:127 回复:0 最后更新: 2008-4-23 9:52:05
查看全文
使用DIV+CSS后，表格Table还有用吗？
2008-4-23
符合网页标准的网页是DIV+Css制作的，那么我们以前使用的表格Table还有用吗？是不是要彻底放弃呢？ 关于DIV和TABLE表格的使用疑问有不少人很是疑惑，整理一下思路！ 关于表格 使用WEB标准之后,并不是说排除表格的使用,表格并不是鸡肋,而正好相反是一道大餐,之所以在很多关于CSS布局的文章中常提到"为什么使用表格排版是不明智的"这句话,可能是大家对他的理解有误,这里注意一点"使用表格排版"是"不明智"的.指的是我们使用了很多年的,用表格来排版是不明智的,表格归根截底是一种显示"数据"的方式,大家可以想象一下Excel,表格就是起这个使用的,有的时候信息使用表格显示让我们能...
[
年少轻狂
] 点击:113 回复:0 最后更新: 2008-4-23 9:51:43
查看全文
如何像table一样对层div进行轻松布局
2008-4-23
下面是我翻译的内容，是根据我对文章的理解意译的，你就别挑哪里翻译的不对了，我的目的只是传达这个CSS技巧。 许多网页设计师都喜欢，将两个或者多个容器等高的并排放置，并在里面展示每个容器的内容，就象经典表格布局中的单元格控制几个栏目的位置，也喜欢容器的内容居中或顶部对齐显示。但是你又不喜欢用table来实现他，那怎么办呢？实现的方法很多，有根据视觉错觉实现的，有用JS控制使高度相等的，还有采用容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法来解决列高度相同的问题。其实有个简单的方法，使用display:table, display:table-row and display:table-cell 就可以实现，而且高度小的容器会自适应那些高度相...
[
年少轻狂
] 点击:117 回复:0 最后更新: 2008-4-23 9:51:23
查看全文
初学DIV+CSS应该理解HTML标签的语义
2008-4-23
如今Web标准都被通俗的叫做“div+css”或者“层布局”。我不反对这种便宜行事的叫法。但是这样会陷入一个误区：即大量的使用div标签作为结构元素。事实上这是一种更高级的div滥用(Jeffrey Zeldman在《网站重构》一书中提到）。 HTML为我们提供了相当丰富的标签，每个标签都有它各自的含义。我认为在设计时，除了遵循HTML语法以外，应该充分利用并遵守各标签的“语义”。如标题文字应该包含在h1-h6中，大段的文字内容应该由<p>进行分段而不是<br />，列表项应该放在ul或ol或dl中，表格形式的数据应该仍然用table布局。 为什么要这样做？一个很有说服力的原因是，保证在用户去掉CSS显示的情况下，网页能...
[
年少轻狂
] 点击:119 回复:0 最后更新: 2008-4-23 9:51:01
查看全文
CSS教程:CSS文件应该保持整洁和统一
2008-4-23
一位网友遇到了一个头疼的问题。需要对经过若干次修改以后的网站进行重整，需要剔除冗余的代码，在CSS样式重整方面，比较头疼，不仅需要对现有的样式进行合并与精简，还需要为网站增加换肤功能。 不难看出，这是一个令人感觉很烦躁的工作，面对一行一行代码头皮发麻。如果我们养成良好的习惯，或许可以让工作更容易一些。就此问题与经验，以下的文字或许有很大的参考价值： 使用链接或者导入样式表的方法对于中阶或高阶的CSS开发人员来说都是再正常不过的事情，但是我在这里依然会强调一下这种方法的重要性。我见过的许多站点，在创站之初，CSS文件很整洁，组织的也井井有条，但是随着时间的推移，这些文档由于内嵌的甚至...
[
年少轻狂
] 点击:140 回复:0 最后更新: 2008-4-23 9:50:13
查看全文
做网页，用DIV布局好还是table布局好?
2008-4-20
做网页，用DIV布局好？还是table布局好？？请问他们的优缺点各是什么呢?div相对table布局来说,调试起来要麻烦多了。因为要考虑各种浏览器下的css支持标准兼容性. 实际上,布局时根据需要来决定,倾向于table表示数据,div用来布局.div,table都是HTML标签，怎么用，只要表达给网站浏览者信息就足够了，如何组织信息是设计者的问题。表格代码冗长，维护麻烦，如今推行WEB标准，用丰富的标签设置更灵活，维护也更方便，当然包括TABLE和DIV。如今DIV的滥用程度似乎有超越TABLE之嫌该用什么标签用什么标签，尽可能地还原标签原本代表的意义。如果你习惯了Web标准，会感觉用他要比Table布局的建站方便的多。...
[
有时也很傻
] 点击:269 回复:0 最后更新: 2008-4-20 10:58:40
查看全文
absolute与relative的运用示例
2008-4-20
Div + CSS 进行网页布局，适当地运用 absolute 与 relative，能给布局带来意想不到的效果和方便，达到事半功倍…本文介绍了关于 absolute 与 relative 的运用。 详细讲解两者的关系，需要配合例子，请先看例子： 以下是引用片段：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxml(标准化越来越近了)ns="http://www.w3.org/1999/xhtml"> <head&am...
[
有时也很傻
] 点击:216 回复:0 最后更新: 2008-4-20 10:57:54
查看全文
争夺特定选择符控制权的多个CSS样式表
2008-4-20
CSS样式 层叠顺序 当使用了多个样式表，样式表需要争夺特定选择符的控制权。在这些情况下，总会有样式表的规则能获得控制权。以下的特性将决定互相对立的样式表的结果。 正如以前所提及的，网页制作者和读者都有能力去指定样式表。当两者的规则发生冲突，网页制作者的规则会凌驾于读者的其它相同权重的规则。而网页制作者和读者的样式表都超越浏览器的内置样式表。 网页制作者应该小心地使用! important 规则，因为它们会超越用户任何的! important 规则。例如，一个用户由于视觉关系，会要求大字体或指定的颜色，而且这样的用户会有可能声明确定的样式规则为! important，因为这些样式对于用户阅读网页是极为重要的。...
[
有时也很傻
] 点击:171 回复:0 最后更新: 2008-4-20 10:57:38
查看全文
相关表格边框的CSS语法
2008-4-20
表格是数据的载体，不再是布局的方式，虽然我们不需要表格来进行网页布局了，但很多表格式的数据，还是需要表格这一形式发挥它的作用！我们知道Dreamweaver在表格制作方面做得非常出色，但是在某些时候还是必须结合css才能达到一些特定效果，下面我们先把有关表格边框的css语法整理出来，然后另外介绍怎样用css美化表格的边框。 1.上边框宽度 以下是引用片段： 语法:border-top-width:<值> 允许值:thin|medium|thick|<长度> ...
[
有时也很傻
] 点击:154 回复:0 最后更新: 2008-4-20 10:57:21
查看全文
CSS上中下三行布局实例教程
2008-4-20
CSS布局实例:上中下三行布局，上下定高，中间栏自适应浏览器高度，且内容垂直居中。本文代码在firefox 2.0 / win ie 6/ win ie 7 /opera 8.5 cn/win safari 测试通过。对于非ie内核浏览器，通过设定display:table、display:table-row和display:table-cell来模拟表格的表现形式。 最外层#box { display:table; }，高度100%，其子层#header/#main/#footer为{ display:table-row; }，因此可以模拟表格的行效果，上下定高，则中间不定高的层自适应高度。 #wrap层为{ display:table-cell; }模拟单元格，因此可以设定{ vertical-align:middle; }，垂直居中。 由于Win IE不支持{ display:table; }，因此，只能采取定位的方式...
[
兜迷儿
] 点击:155 回复:0 最后更新: 2008-4-20 10:56:19
查看全文
word-wrap与word-break的区别
2008-4-20
本文列举了兼容 IE 和 FF 的换行 CSS 推荐样式，详细介绍了word-wrap同word-break的区别。 兼容 IE 和 FF 的换行 CSS 推荐样式 最好的方式是 以下是引用片段： word-wrap:break-word;overflow:hidden; 而不是 以下是引用片段： word-wrap:break-word;word-break:break-all; 也不是 以下是引用片段： word-wrap:break-word;overflow:auto; 在 IE 下没有任何问题，在 FF 下，长串英文会被遮住超出的内容。 word-wrap同word-break的区别 word-wrap: normal Default. Content exceeds the boundaries of its container. ...
[
兜迷儿
] 点击:143 回复:0 最后更新: 2008-4-20 10:56:00
查看全文
以CSS中absolute与relative的运用
2008-4-20
Div + CSS 进行网页布局，适当地运用 absolute 与 relative，能给布局带来意想不到的效果和方便，达到事半功倍…本文介绍了关于 absolute 与 relative 的运用。 详细讲解两者的关系，需要配合例子，请先看例子： 以下是引用片段：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxml(标准化越来越近了)ns="http://www.w3.org/1999/xhtml"> <head> <metahttp-e...
[
兜迷儿
] 点击:143 回复:0 最后更新: 2008-4-20 10:55:24
查看全文
创建三栏网页布局CSS代码示例
2008-4-20
三栏布局是目前最常见的网页布局，主要页内容放在中间一栏，边上的两栏放置导航链接之类的内容。基本布局一般是标题之下放置三栏，三栏占据整个页面的宽度，最后在页的底端放置页脚，页脚也占据整个页面宽度。 绝大多数网页设计者都熟悉传统的网页设计技术，用这些技术可以生成带有表格、创建固定宽度布局或者“液态”(它可以根据用户浏览器窗口宽度自动伸缩)布局的网页。 现在，我们都开始抛弃基于表格的布局技术，许多网络设计者正在从XHTML标记和CSS格式这一新范例中寻找创建三栏布局的方法。用绝对定位的方法从CSS中得到固定宽度的布局并不困难;但是得到液态布局就有点困难了。因此，本文介绍一种用CSS的float和clear属...
[
兜迷儿
] 点击:197 回复:0 最后更新: 2008-4-20 10:55:05
查看全文
让文字居于div的底部的CSS代码
2008-4-20
css对文字的布局上没有靠容器底部对齐的参数，目前使用的一个不错的方法也比较好.就是用position属性来解决，看下面的代码，用position的相对和绝对定位功能也轻松的实现了，文字靠近div低部对齐，并且靠近的距离还可以精确到像素，自己可以调节，是不是很不错呢? 以下是引用片段：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>无标题文档</tit...
[
兜迷儿
] 点击:213 回复:0 最后更新: 2008-4-20 10:54:45
查看全文
CSS使网页风格设计与模板维护更简单
2008-4-20
CSS语法立意让网页内容与视觉呈现分离，一方面使得页面维护工作更容易，不会因内容或视觉效果改变影响到另一方，这样的页面设计，也对搜寻引擎更为友善，更容易搜寻到页面内容。 CSS，Cascading Style Sheets 串接样式表，网页外观的控制语法 World Wide Web最早是以文件的概念组成，希望透过网页与超链接，让文件与知识更容易连接援引。从HTML语法大量使用文件概念的标签（例如代表标题的＜H1＞，代表段落的＜P＞），就不难看出WWW的这个特质。 ...
[
兜迷儿
] 点击:306 回复:0 最后更新: 2008-4-20 10:54:08
查看全文
无延迟翻滚的图形与CSS混合风格按钮
2008-4-20
在一个具有图形背景的按钮中添加CSS风格的文本，这种建立按钮的方法结合了具有CSS翻滚(CSS rollover)标记的开发速度和效率，从而有效地提高按钮外表图像的三维效果。 相比于常规的图形按钮，这些图形/CSS混合按钮可易于建立和载入，因为你只需要为空白按钮外面建立和载入一个图像，而不是为每一个按钮建立各自的图像。 同一个图像可以使用在网页所有按钮的背景。按钮的文本标签都是简单的CSS风格文本。 预先载入的图形/CSS混合风格的为数不多问题之一是对翻滚效果有所限制。使用这一技术的最简单的方法是，指定CSS风格文本的翻滚效果，并使用所有翻滚状态(rollover states)的相同按钮外形图像。这可以给你带来快速、...
[
兜迷儿
] 点击:212 回复:0 最后更新: 2008-4-20 10:53:52
查看全文
绝对居中的层div+css代码示例
2008-4-20
绝对居中的层div+css代码示例 以下是代码：<html> <head> <title>NiceandFreeCSSTemplate11</title> <metahttp-equiv="Content-Type"content="text/html;charset=iso-8859-1"/> <styletype="text/css"><!-- /*bodyundschriftdeffinitionen*/ body{ background-color:#e1ddd9; font-size:12...
[
兜迷儿
] 点击:142 回复:0 最后更新: 2008-4-20 10:53:34
查看全文
div+css非常好的三栏浮动菜单示例
2008-4-20
div+css非常好的三栏浮动菜单示例 以下是代码：<html> <head> <title>FreeCSSTemplate5</title> <styletype="text/css"media="screen"><!-- /*bodyundschriftdeffinitionen*/ html{ padding:0px; margin:0px; } body{ background-color:#e1ddd9; font-size:12px; font-family:Verdana,Arial,SunSans-Regular,Sans-S...
[
疯狂石头
] 点击:156 回复:0 最后更新: 2008-4-20 10:52:24
查看全文
四栏标准DIV+CSS布局示例
2008-4-20
四栏标准DIV+CSS布局示例 以下是代码：<html> <head> <metahttp-equiv="content-type"content="text/html;charset=iso-8859-1"/> <title>NiceandFreeCSSTemplate4</title> <styletype="text/css"media="screen"><!-- /*bodyundschriftdeffinitionen*/ html{ padding:0px; margin:0px; } bo...
[
疯狂石头
] 点击:203 回复:0 最后更新: 2008-4-20 10:52:00
查看全文
三栏式带滚动条自动伸展的DIV+CSS布局示例
2008-4-20
自动伸缩效果. 以下是代码：<html> <head> <title>NiceandFreeCSSTemplate3</title> <styletype="text/css"media="screen"><!-- /*bodyundschriftdeffinitionen*/ html{ padding:0px; margin:0px; } body{ background-color:#e1ddd9; font-size:12px; font-family:Verdana,Arial,SunSans-Regular,&nb...
[
疯狂石头
] 点击:162 回复:0 最后更新: 2008-4-20 10:51:08
查看全文
带滚动条的两栏标准DIV+CSS布局示例
2008-4-20
当窗口收缩时超出层的宽度时会自动出现滚动条... 以下是代码：<html> <head> <title>NiceandFreeCSSTemplate2a</title> <styletype="text/css"media="screen"><!-- /*bodyundschriftdeffinitionen*/ html{ padding:0px; margin:0px; } body{ background-color:#e1ddd9; font-size:12px; font-family:Verdana,Arial,...
[
疯狂石头
] 点击:154 回复:0 最后更新: 2008-4-20 10:50:44
查看全文
左右两栏式WEB标准(DIV+CSS)布局代码
2008-4-20
单层固定宽度，内容层自适应.. 以下是代码：<html> <head> <title>NiceandFreeCSSTemplate2</title> <styletype="text/css"media="screen"><!-- /*bodyundschriftdeffinitionen*/ html{ padding:0px; margin:0px; } body{ background-color:#e1ddd9; font-size:12px; font-family:Verdana,Arial,SunSans-...
[
疯狂石头
] 点击:144 回复:0 最后更新: 2008-4-20 10:50:14
查看全文
firefox火狐浏览器与ie浏览器在html代码编写时的差异
2008-4-20
写时的差异,程序员有进行开发调试时,可按下面说到的HTML标签进行调试. 1.ul不同，ie下默认是margin留白，FF下默认是padding留白，所以要先用margin:0;padding:0;来实现兼容。2.给定高度后，当内容过多，真实高度大于给定高度时，两者不同还有呢？在ff测试div+css的过程中发现不少问题，主要原因是代码的不规范书写。1、居中问题div里的内容，ie默认为居中，而ff默认为左对齐。使ff内容居中的方法是增加代码margin:auto;2、高度问题设有两横行div排列，上面的div设置高度(height)，如果div里的实际内容大于所设高度，在ff中会出现两个div重叠的现象；但在ie中， 下面的div会自动给上面的div让出空间。所以为避免出现层的重叠，高度一定...
[
疯狂石头
] 点击:155 回复:0 最后更新: 2008-4-20 10:49:11
查看全文
如何锁定input内容不可修改
2008-4-20
如何锁定input内容不可修改呢? <input type="text" size="60"name="j01" value="www.alixiix.com">锁定value不可修改的方法可以用disabled属性.. 这个是input控件的基本属性 <input type="text" disabled size="60"name="j01" value="xxxxx"> 最好是 disabled="disabled" 如果你要获取这里的内容，但又不想被编辑，最好使用readonly，因为使用disabled之后，值是取不到的。...
[
疯狂石头
] 点击:209 回复:0 最后更新: 2008-4-20 10:48:50
查看全文
如何更换textarea的背景色及背景图片
2008-4-20
如何更换textarea的背景色及背景图片 以下是HTML网页特效代码，点击运行按钮可查看效果： <!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=utf-8" /><title>textarea换背景最“偷懒”的方法。</title><style type="text/css">/*onfocus onblur*/.textareaOn{&n...
[
疯狂石头
] 点击:161 回复:0 最后更新: 2008-4-20 10:48:30
查看全文
小技巧：Dreamweaver的应用源格式
2008-4-13
今天在用 DW 试写一段 AS ，突然想，DW是不是有像FLASH一样的“自动套用格式”，这样的话，html文件的源码看起来就很工整了。其实这个想法很早就有了，只是一直没找到这个功能，今天在同事的帮助下终于找到了，试用一下，很好，很实用。并且自动把Tab转换成了空格，很方便网站后台的录入工作。 但是CSS文件使用此功能就感觉不适应了（个人感受），页面拉得很长。 操作：“命令”菜单 -> 应用源...
[
疯狂石头
] 点击:248 回复:0 最后更新: 2008-4-13 11:25:08
查看全文
巧用DW判断字符串中是否有换行
2008-4-13
经常从DW中复制出一段HTML代码(比如table)想将它作为一个字符串来使用，习惯性的将其粘贴到记事本中将一个双引号替换为两个双引号、去掉换行符进行连接再复制粘贴回DW中，但由于在记事本中不能直观的看出这个字符串中是否还有换行符，结果程序一运行老提示错误："未结束的字符串常量"，经常要调试好几次才能将换行符删除干净:(，今天偶然发现在DW代码视图下就可以很直观的看出字符串中是否还有换行符，以后就不用再三的进行调试了。 ...
[
疯狂石头
] 点击:190 回复:0 最后更新: 2008-4-13 11:24:07
查看全文
热门帖子
第10页 共220页 本页30条 主题数 6596
<<
>>
普通贴
精华贴
固顶贴子
总固顶贴子
商品贴子
投票贴子
结贴
锁帖
首页 | 购买指南 | 商业版本 | 虚拟主机 | 特色介绍 | 下载中心 | 支付方式
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
所在位置：论坛首页 -> ┈┋电脑网络技术区┋┈ -> 网页制作技术 -> 帖子列表
普通贴 
精华贴 
固顶贴子 
总固顶贴子 
商品贴子 
投票贴子 
结贴 
锁帖