60度 Eadren 网络 >> 设计教程 >> 网页制作 >> 网站重构
网站重构教程列表
-
DOCTYPE声明好以后，接下来的代码是：<html xmlns=http://www.w3.org/1999/xhtml lang=gb2312>通常我们HTML4.0的代码只是 <html>，这里的xmlns是什么呢？ 这个xmlns是XHTML namespace的缩写，叫做名字空间声明。名字空间是什么作用呢？阿捷自己的理解是： 由于xml允许你自己定义自己的标识，你定义的标识和其他人定义的标识有可能相同，但表示不同的意...
阅读全文>>
-
第三步是定义你的语言编码，类似这样：<meta http-equiv=Content-Type content=text/html; charset=gb2312 /> 为了被浏览器正确解释和通过W3C代码校验，所有的XHTML文档都必须声明它们所使用的编码语言，我们一般使用gb2312(简体中文)，制作多国语言页面也有可能用Unicode、ISO-8859-1等，根据你的需要定义。 通常这样定义就可以了。但是要补充... 阅读全文>>
-
用web标准设计网站，过渡的方法主要是采用XHTML+CSS，css样式表是必不可少的。这就要求所有网页设计师必须熟练掌握CSS，如果你以前不常用，那么现在就开始学习吧。要制作符合web标准的网站，不懂CSS是设计不出漂亮的页面的。 事实上，所有表现的地方都需要用CSS来实现。我们以前都习惯用table来定位和布局，现在要改用DIV来定位和布局。这是思维方式的变化，一开始有些不习惯。呵呵，任何变革都会有阻力的，为了享受... 阅读全文>>
-
这些技巧主要讲meta标签设置的，其实与符合web标准关系不大，只要注意在最后加/关闭标签就可以，但是既然是入门教程，就写得详细一点吧。 收藏夹小图标 如果你将本站加入收藏夹，可以看到在收藏夹网址之前的IE图标变成了本站特别的图标。要实现这样效果很简单，首先制作一个16x16的icon图标，命名为favicon.ico，放在根目录下。然后将下面的代码嵌入head区：<link rel=icon href=/f... 阅读全文>>
-
在开始正式内容制作之前，我们必须先了解一下web标准有关代码的规范。了解这些规范可以帮助你少走弯路,尽快通过代码校验。 1.所有的标记都必须要有一个相应的结束标记 以前在HTML中，你可以打开许多标签，例如<p>和<li>而不一定写对应的</p>和</li>来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个/来关闭它。例如: <... 阅读全文>>
-
在了解XHTML代码规范后，我们就要进行CSS布局。首先先介绍一些CSS的入门知识。如果你已经很熟悉了，可以跳过这一节，直接进入下一节CSS是Cascading Style Sheets(层叠样式表)的缩写。是一种对web文档添加样式的简单机制，属于表现层的布局语言。1.基本语法规范 分析一个典型CSS的语句：p {COLOR:#FF0000;BACKGROUND:#FFFFFF}其中p我们称为选择器(select... 阅读全文>>
-
CSS布局与传统表格(table)布局最大的区别在于：原来的定位都是采用表格，通过表格的间距或者用无色透明的GIF图片来控制文布局版块的间距；而现在则采用层(div)来定位，通过层的margin,padding,border等属性来控制版块的间距。 1.定义DIV 分析一个典型的定义div例子： #sample{ MARGIN: 10px 10px 10px 10px;PADDING:20px 10px 10px 20px; BORDER-RIGHT: #... 阅读全文>>
-
接下来开始要真正设计布局了。和传统的方法一样，你首先要在脑海里有大致的轮廓构想，然后用photoshop把它画出来。你可能看到有关web标准的站点大都很朴素，因为web标准更关注结构和内容，实际上它与网页的美观没有根本冲突，你想怎么设计就怎么设计，用传统表格方法实现的布局，用DIV也可以实现。技术有一个成熟的过程，把DIV看成和TABLE一样的工具，如何运用就看你的想象力了。注：在实际应用过程中，DIV在有些地方的确不如表格方便，比如背景色的定义。但任何事... 阅读全文>>
-
花了两天的时间才把这个简单的东西给做出来。本来早就想做这个东西的，但是由于......(跟老板后面做事，当然空闲的时间就少了，唉，实在不好意思，因为自己不才，所以找了个借口)。刚好现在公司又让我做个房产管理系统，要用这样的一个方法了，所以才狠下心来非把这个做出来不可。我认为这个例子非常实用(个人看法)，而且好多大型网站上都有这种应用。今天写下来和各位朋友一起分享。以下就是我的所有代码，有不妥之处还请各位高人指教，在此先谢了。 把这里的所有代码都放在&l... 阅读全文>>
-
作者前言 今天下午，我的一个朋友问我：对于一个想了解web标准的老网页设计师有什么建议。 我想将我的email回复贴在这里让更多人看见将是一个很好的范例。我的回复是：这有一个全面的，非正式的，有些罗嗦的指南，送给所有听说过web标准，希望使用web标准却又不知道从哪里开始设计师。 正文 首先不要急着开始！在做任何事情之前做好2个心理准备，这对你的学习过程是最重要的事情： 1).学习需要时间，要循序渐进； 2).前进的过程中会遇到挫折。 但... 阅读全文>>
-
一般的导航效果大家都很熟悉了，例如用CSS给导航文本设置上、下划线、背景颜色或位移等。前面的帖子中有网友提到http://www.tonta.com.cn/这个网站，偶发现其首页中的导航效果不错，虽然flash做的没有很眩的效果，但是比较细腻，看上去很舒服。 闲来无事，尝试在dw中实现同样的导航效果。 首先分析效果的组成，鼠标经过时背景发生变化，小图象转动。Ok！考虑使用dw中的swap image（翻转图）+背景图象变化（CSS定义）应该可以实现效果... 阅读全文>>
-
1、给主页添加视频动画只要把下面这段代码添加到你的网页中，就可以在主页中添加Windows视频动画或其他RralMedia格式的视频动画。 <img dynsrc=/test.avi start=fileopen width=360 height=190 alt=test.avi (40M字节) controls hspace=-1 vspace=0> 在这段代码中，dynsrc的值为你的动画文件的名字，它应是以avi、ra、ram为后缀名的文... 阅读全文>>
-
准备工作:1.选择 !DOCTYPE 过渡的(Transitional): 要求非常宽松的DTD，它允许你继续使用HTML4.01的标识(但是要符合xhtml的写法)。虽然W3C不赞成使用<font>等标签,但是还是有很多网页爱好者在很喜欢用,所以W3C不得不把font补进到HTML 4.0的标准中.因此使用过渡式你还可以使用这些标签. ... 阅读全文>>
-
head区是指首页HTML代码的<head>和</head>之间的内容。 必须加入的标签 ：1.公司版权注释 <!--- The site is designed by Maketown,Inc 06/2000 ---> 2.网页显示字符集 简体中文：<META HTTP-EQUIV=Content-Type CONTENT=text/html; charset=gb2312> 繁体中文：<META H... 阅读全文>>
-
只要有IE 4.0以后版本的浏览器就可以用这种让人目瞪口呆的特效，使别人进入和退出你的网页时能看到这种戏剧化的效果。 第一步 把以下的HTML程式码复制以后贴到你网页上的<HEAD>标签里： <META http-equiv=Page-Enter content=revealTrans(Transition=23,Duration=1.000)> 太简单了吧！不过还是有难度较高，而且需要你伤脑筋，却能发挥你艺术天分的地方：... 阅读全文>>
-
meta是什么？习惯了用Frontpage2000等工具来制作网页的设计者们，说不准还真的回答不出来呢！熟悉html语法的用户就知道了，meta其实是html语言head区的一个辅助性标签。在几乎所有的网页里，我们都可以看到类似下面这段html代码：有人要说，这段代码好象可有可无，没有多大实际作用嘛！其实不是没用，而是你没有用好meta标签。为什么这样说呢？这是因为meta标签有许多参数，使用不同的参数就可以使主页实现不同的功能，例如用于鉴别作者，设定页面... 阅读全文>>
-
超级链接<a>标记代表一个链接点，是英文anchor（锚点）的简写。它的作用是把当前位置的文本或图片连接到其他的页面、文本或图像，这已是众所周知了，但关于它的语法结构可能有点鲜为人知，而要用活它则必须了解其语法结构。<a>标记的基本语法结构是： <a class=type id＝value href＝reference name＝value rel=same|next|parent|previous rev＝value tar... 阅读全文>>
-
简介：在论坛中常常有网友问到，可以在一个html的文件当中读取另一个html文件的内容吗？答案是确定的，而且方法不只一种，在以前我只会使用iframe来引用，后来发现了另外的几种方法，那今天就总结这几种方法让大家参考一下，本人觉得第三种方式较好！1.IFrame引入，看看下面的代码<IFRAME NAME=content_frame width=100% height=30 marginwidth=0 ... 阅读全文>>
-
原文：http://www.sovavsiti.cz/css/abbr.html 翻译：JunChen版权:译者JunChen所有，转载请联系译者。 简介<abbr>是用来为web页面上的简称（译者注：这里把简称和缩写分开而论，简称范围比缩写大，取首字母的缩写用<acronym>标签）添加适当标注的XHTML标签，Windows的IE浏览器暂不支持<abbr>标签。 在IE里，你可以应用CSS给<acro... 阅读全文>>
-
按功能排列NN: 表明哪个早期Netscape版本支持这个标签 IE: 表明哪个早期Internet Explorer版本支持这个标签 DTD: 表明符合XHTML 1.0 DTD 何级别的定义 . S=Strict（严格）, T=Transitional（过渡）, and F=Frameset（框架） 开始标签 用途（Purpose） NN IE DTD 基本标签 &nbs... 阅读全文>>
-
本文是2002年为硅谷动力网站翻译的稿件。当时xhtml1.0刚刚开始被设计师所接触，所以有下面这个基础问答。HTML语言是我们建立网页的工具，从它出现发展到现在，规范不断完善，功能越来越强。但是依然有缺陷和不足，人们仍在不断的改进它，使它更加便于控制和有弹性，以适应网络上日新月异的应用需求。2000年底，国际W3C(World Wide Web Consortium)组织公布发行了XHTML 1.0版本，XHTML和HTML,XML有什么不同，它增加了什... 阅读全文>>
-
HTML语言是我们建立网页的工具，从它出现发展到现在，规范不断完善，功能越来越强。但是依然有缺陷和不足，人们仍在不断的改进它，使它更加便于控制和有弹性，以适应网络上日新月异的应用需求。2000年底，国际W3C(World Wide Web Consortium)组织公布发行了XHTML 1.0版本，XHTML和HTML,XML有什么不同，它增加了什么新功能，今天就让我们来初步认识一下XHTML。 XHTML 1.0是一种在HTML 4.0基础上优化和改... 阅读全文>>
-
原文作者：Sergio Villarreal 作者简介：墨西哥网页设计师，1993年接触网络，个人主页为Overcaffeinated.net 原文出处：sitepoint.com 原文发表时间：2004年5月27日 前言 我第一次在internet上冲浪用的还是哑终端。不久以后，明尼苏达州的一种单色的显示器居然可以通过服务器播放电影巨蟒和圣杯。当时没有鼠标，没有良好的操作界面，更不用说24位彩色了。Gopher是唯一可用的工具。搜索则只能用Archi... 阅读全文>>
-
非常高兴地看到很多设计师开始关注和尝试使用web标准制作网页。但从网友们的问题和制作中发现几个问题，在这里特别提醒一下：1.不是为了通过校验才标准化。 web标准的本意是实现内容(结构)和表现分离，就是将样式剥离出来放在单独的css文件中。这样做的好处是可以分别处理内容和表现，也方便搜索和内容的再利用。 W3C校验仅仅是帮助你检查XHTML代码的书写是否规范，CSS的属性是否都在CCS2的规范... 阅读全文>>
-
现在在浏览网页的时候，你会发现很多网站都会有“将我加入收藏夹”的选项，也许你的网站中同样有这样的选项，因为这确实是让浏览者记住网站的一个好方法。但是，当收藏夹中的网站越来越多，所有的网站都是一个丑丑的蓝色 IE 小图标加上一个网站名，让人感到无所适从。怎样才能在这众多的网站中脱颖而出呢？正当你麻木地盯着那堆看起来一模一样又毫无生气的书签的时候，忽然发现其中一个书签看起来很不一样，有个让人眼睛一亮的logo！没错，如果能把那个IE小图标换成一个个性化的Log... 阅读全文>>
-
如果你的网页中有<a href=“#”> .......</a> 这样的连接，而且已经出现的滚动条，并且下拉了一些，那么当点击这个连接的时候就会返回页面顶部，很是讨厌。以下几中方法可以防止这个问题:1.将<a href=“#”>.......</a>改为<a href=“javascript:;”> .......</a> 2.将<a href=“#”> .......&l... 阅读全文>>
-
怎么我的鼠标变了？在网上经常有很多网站，在进去后，你的鼠标指针会变成一个小图片指针，你可能觉得很奇怪吧。 要实现这个效果很容易，只需在你的网页文件的之间加上： <style type=text/css><!--body {CURSOR: url(mouse.ani)}--></style> 当然你需要找到一个你想用的鼠标指针文件,可以打开你的系统盘的windows/cursors文件夹找一个(当然更可爱的鼠标指针，... 阅读全文>>
-
即时提示是Windows应用软件的一种富有人情味的特色设计。当用户不知道一个文字或图片按钮的功能时，只要把鼠标移动到这个按钮，就会出现一个即时提示短语。在制作网页时,同样可以借助HTML语言给网络文档加上即时提示功能。我们在开发英语网络教材时，就利用了即时提示功能给每个生词加上中文注释。在本例中，对初三英语课文中的“Christmas is an important festival in Britain and many other parts of t... 阅读全文>>
-
注意：以下效果必需IE5.5以上版本才支持 在transparentBody.htm文件的<body>标签中，我已经加入了style=background-color=transparent 通过以下四种IFRAME的写法我想大概你对iframe背景透明效果的实现方法应该会有个清晰的了解：<IFRAME ID=Frame1 SRC=transparentBody.htm allowTransparency=true></I... 阅读全文>>
-
UI Components Based on Web Standards - Menu (1) 菜单（Menu）是最基本最常见的网页UI元素之一，它的主要功能包括：引导用户发现网站的内容； 协助用户执行某一特定的操作。 一个完整的菜单是一组菜单项（Menu Item）的集合，所有的菜单项在逻辑上应该是并列、平级的关系，它们指向相互之间没有隶属关系的内容或功能。 菜单项可以是链接，也可以是另一组菜单项的集合，即二级菜单（Sub-Menu）。菜单项的... 阅读全文>>
使用Web标准建站第8天… | 使用Web标准建站第9天… | 网页设计:一种细腻的导… | 表格对决CSS--一场生死… |
