本篇详细介绍如何利用CSS能方便地控制对象的“显示”和“隐藏”属性原理，制作一个树状目录，用CSS制作这样的树状目录，方法简单，代码也比较少，所以把它写出来，给网友们共亨，以便在需要的时候也可动手做一个。 索易电子杂志大多采用树状目录，当鼠标点击主目录时，展开子目录；当再次点击主目录时，则关闭子目录。显得简捷明快，朴实无华。 制作这种树状目录的方法较多，最近我先看下面的示例：当用鼠标在主目录上点一下，...
在开始正式内容制作之前，我们必须先了解一下web标准有关代码的规范。了解这些规范可以帮助你少走弯路,尽快通过代码校验。 1.所有的标记都必须要有一个相应的结束标记 以前在HTML中，你可以打开许多标签，例如和而不一定写对应的和来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个"/"来关闭它。例如: 2.所有标签的元素和属性的名字都必须使用小写 与HTM...
CSS布局与传统表格(table)布局最大的区别在于：原来的定位都是采用表格，通过表格的间距或者用无色透明的GIF图片来控制文布局版块的间距；而现在则采用层(div)来定位，通过层的margin,padding,border等属性来控制版块的间距。 1.定义DIV 分析一个典型的定义div例子： #sample{ MARGIN: 10px 10px 10px 10px;PADDING:20px 10px 10px 20px; BORDER-TOP: #CCC 2px solid;BORDER-RIGHT: #CCC 2px solid;BORDER-BOTTOM: #CCC 2px solid;...
这些技巧主要讲meta标签设置的，其实与符合web标准关系不大，只要注意在最后加"/"关闭标签就可以，但是既然是入门教程，就写得详细一点吧。 收藏夹小图标 如果你将本站加入收藏夹，可以看到在收藏夹网址之前的IE图标变成了本站特别的图标。要实现这样效果很简单，首先制作一个16x16的icon图标，命名为favicon.ico，放在根目录下。然后将下面的代码嵌入head区：为搜索引擎准备的内容 代码如下，替换成你自己站点的内容就可以：允许搜...
在了解XHTML代码规范后，我们就要进行CSS布局。首先先介绍一些CSS的入门知识。如果你已经很熟悉了，可以跳过这一节，直接进入下一节。 CSS是Cascading Style Sheets(层叠样式表)的缩写。是一种对web文档添加样式的简单机制，属于表现层的布局语言。 1.基本语法规范 分析一个典型CSS的语句：p {COLOR:#FF0000;BACKGROUND:#FFFFFF} 其中"p"我们称为"选择器"(selectors)，指明我们要给"p"定义样式； 样式声明写在一对大括号"{}"中； ...
前言 大家好！这个系列文章是按阿捷自己制作这个站点的过程编写的。之前阿捷也一直没有制作过一个真正符合web标准的网站。现在边参考国外资料边制作，同时把过程中的心得和经验记录下来，希望对大家有点帮助。好了，让我们开始吧 第一天 开始制作符合标准的站点，第一件事情就是声明符合自己需要的DOCTYPE。 查看本站首页原代码，可以看到第一行就是： 打开一些符合标准的站点，例如著名web设计软件开发商Macromedia，设计大师Zel...
如果我们想在3列布局的最后加一行页脚，放版权之类的信息。就遇到必须对齐3列底部的问题。在table布局中，我们用大表格嵌套小表格的方法，可以很方便对齐三列；而用div布局，三列独立分散，内容高低不同，就很难对齐。其实我们完全可以嵌套div，把三列放进一个DIV中，就做到了底部对齐。下面是实现例子(白色背景框模拟一个页面)： Body 这里是#header{ MARGIN: 0px; BORDER: 0px; BACKGROUND: #ccd2de; WIDTH: 580px; HEIGHT: 60p...
接下来开始要真正设计布局了。和传统的方法一样，你首先要在脑海里有大致的轮廓构想，然后用photoshop把它画出来。你可能看到有关web标准的站点大都很朴素，因为web标准更关注结构和内容，实际上它与网页的美观没有根本冲突，你想怎么设计就怎么设计，用传统表格方法实现的布局，用DIV也可以实现。技术有一个成熟的过程，把DIV看成和TABLE一样的工具，如何运用就看你的想象力了。 注：在实际应用过程中，DIV在有些地方的确不如表格...
辛苦了好多天，我们努力学习使用XHTML+CSS来重新设计我们的网站。那么我们如何知道自己制作的页面真的符合web标准？W3C和一些志愿者网站提供了在线校验程序，来帮助我们检查页面是否符合标准，并提供了修正错误的帮助信息。这些校验非常有用，是我调试页面第一步要做的事情。 1.XHTML校验校验网址：http://validator.w3.org/ 校验方式:网址校验、文件上传校验 校验成功，会显示"This Page Is Valid XHTML 1.0 Transitional!",如图...
该贴的内容，请务必字句阅读，因为这是免费赠送给所有WEBIT人的一个技术大蛋糕！ 注释:以下所有的URL演示地址，因人流问题会较慢，其加载时请耐心等待，并尝试使用不同地址分流。 《VML极道教程》简介： 以学图用为目标追求、以效求速为极道教程。目前一本相当完整的中文（VML教程+参考手册）合本。此书将使你彻底的精通VML标记、熟悉DVML编程、进而转战WEB实际开发。无论你是笨人、常人、聪明人、IT精英，只要你肯学，熟读本书你就...
用web标准设计网站，过渡的方法主要是采用XHTML+CSS，css样式表是必不可少的。这就要求所有网页设计师必须熟练掌握CSS，如果你以前不常用，那么现在就开始学习吧。要制作符合web标准的网站，不懂CSS是设计不出漂亮的页面的。 事实上，所有表现的地方都需要用CSS来实现。我们以前都习惯用table来定位和布局，现在要改用DIV来定位和布局。这是思维方式的变化，一开始有些不习惯。呵呵，任何变革都会有阻力的，为了享受标准带来的"益处...
单行单列单行单列1：采用float浮在左上角，固定宽度。 #content { float: left; padding: 10px; margin: 20px; background: #FFF; border: 5px solid #666; width: 400px; /* ie5win fudge begins */ voice-family: "\\"}\\""; voice-family:inherit; width: 370px; }html>body #content { width: 370px; /* ie5win fudge ends */ } 单行单列2：固定在左上角，固定宽度，采用的是绝对(absolute)定位。 #content { position: abso...
DOCTYPE声明好以后，接下来的代码是： 通常我们HTML4.0的代码只是，这里的"xmlns"是什么呢？ 这个"xmlns"是XHTML namespace的缩写，叫做"名字空间"声明。名字空间是什么作用呢？阿捷自己的理解是： 由于xml允许你自己定义自己的标识，你定义的标识和其他人定义的标识有可能相同，但表示不同的意义。当文件交换或者共享的时候就容易产生错误。为了避免这种错误发生，XML采用名字空间声明，允许你通过一个网址指向来识别你的标识。例...
请教大家一个问题吧 我想让下面的table 通过table class=一个类名来实现我下面的种情效果 就是我想在css 里定义一个类,把 table 中的 cellspacing=1 bgcolor=#D0DDE5 和 td 中的 bgcolor=#FFFFFF 都写到 css 的一个类里，到时我只要用table class 就可以实现了， 请大家教下我吧 我想把 table 中的 cellspacing=1 bgcolor=#D0DDE5 和 td 中的bgcolor=#FFFFFF 都写到 css 的一个类里,怎么写啊 [Ctrl+A 全选 注:如需引入外部Js需...
2007.1.30更新……转载自 http://www.dnxh.cn/blog/article.asp?id=155Pjblog的用户群越来越大，一个Blog就相当于一个Blogger网上的家。而现在追求个性的时代，给自己的Blog做过有个性的、符合自己特点的Skin是大家的一个愿望。但这个毕竟涉及到一些知识，我们需要通过自己的努力学习来完成我们的愿望。我将从零说起，大概是这样的一个过程：准备工作→Skin的构思→制图→切片→编写CSS→预览→调试兼容性→美化细节，预览和编写是...