首页 > 教程 > 关键词  > 网页最新资讯  > 正文

网页设计中Html使用的一些问题

2008-04-25 11:16 · 稿源:新云

1.网页背景色的设置

犯错机率:很大
普遍性:较广
犯错可能性:懒/不知道
约2年前我曾发现21cn上出现过一次没有设置背景色的情况,当时我用Email通知了他们,自此之后这个问题我从没犯过。绝大部分人的窗口背景颜色都是白色,但

如果象我这样个性的人,就会把windows窗口的背景颜色改成灰色或其他色,这样一来,如果你没有设置网页的背景颜色的话,你以为正常的网页在我的电脑上看起

来会是一团糟。

2.Align center(自动居中)的滥用

犯错机率:非常大
普遍性:非常广
犯错可能性:以为方便/以为好用
工作中,修改、维护别人的网页是家常便饭,发现不少人有一个陋习:
在表格中的文字或图片,你是这样来令它居中、靠左或靠右过?
<div align="center">大家好啊!!</div>
<div align="center"><img src="https://edu.chinaz.com/Get/Website/Html_Css/xx.gif"></div>
当有些表格很多、文字很多、内容分得很细的时候,爱用这种方法(它在DW里的快捷键是Ctrl+Alt+C,FP不知道是什么)的人往往会狂用,惨了,我一碰到这样的

网页就头痛,为什么要用那么多<div>来居中呢?tell me why?难道表格没有居中属性吗?为什么要加入这些垃圾代码?特别修改的时候也不能把文字或图片删除

了就能自动清除<div align="center">这个代码,还要手工去清除,在复杂点的网页中就会无故地浪费维护者一笔时间。建议使用<td align="center">来居中,当

需要多重定位的时候,才考虑<div align="center">,因为这个代码并不好处理,所以能用表格代替就用表格替代。

3.重复使用实现相同功能的代码、或杂七杂八的乱套代码

犯错机率:非常普遍
普遍性:非常普遍
犯错可能性:复杂多样
大家先来看一看下面的代码:
<center>
<p><font class="css_id"><font class="font11"><font color="#CCCCCC"><font color="#FFA76C" style="font-size:14px;font-family:隶书">标题

</font></font></font><br></center>
你觉得这样的代码看起来感觉怎么样呢?</font></p>
我不知道读者有什么感觉,压根我一看到这样的代码就会先自我麻木十来秒,这十来秒目的是为了找一个能表达我的思想感情的词(我?你想反问我吗?sorry~~,

我一般不犯,因为我做网页至少有一半以上的时间在浏览代码,代码中多了不该多的东西我一眼就能看出来。)。
看看上面的代码,使用了2个class,4个font来定义2个文本,其实这样的问题很多时候是在大家不断的修改中产生的,对代码不熟、或懒查看代码、又或不喜欢查

看代码的人犯这些问题特别严重,当然,事实上别人浏览这个网页的时候,是没有任何问题的,但维护的人就…………。
这些多余的垃圾代码完全是可以省略掉的,其实上面的例子不够严重,更恐怖的我都见过。
另外还有一个问题也要提提的,就是<p>...</p>和<center>...</center>,为什么要用它们呢?tell me why~~,有甚者是这样的:
<td><div align="center" class="css_id">
<center>
<p align="center"></p>
<p align="center"><font class="css_id"><font class="font11"><font color="#CCCCCC"><font color="#FFA76C" style="font-size:14px;font-family:隶

书">标 题</font></font></font><br></center></td>你觉得这样的代码看起来感觉怎么样呢?</font></p></center></div></td>
看到这样的代码我是会很无奈的(更无奈的是我经常看到,而且必须看),我来简化一下:
<td align="center" class="css_id">
<br><font color="#FFA76C" style="font-size:14px;font-family:隶书">标题</font><br>你觉得这样的代码看起来感觉怎么样呢?</td>
是不是看起来觉得这个世界安静了很多?"标题"后面的文字完成可以定义在<td>的class里,就算不用css,再用多一个<.font>也没问题,一样很清爽。

4.表格不正确嵌套

犯错机率:一般
普遍性:普遍
犯错可能性:对这个不了解
其实这是一个街知巷闻的问题了,但还是不断有人犯,不正确的嵌套表格,可能会令到你被老总叫到办公室里臭骂一顿,会令到你以为正常的网页用ADSL开2、3分

钟都开不了。先讲第一个问题,就是在一个大表格里不断地嵌套表格,这样会令到打开网页的速度变慢(虽然说现在的IE改善了这一问题,但还是不建议这样做)

,另一方面维护、修改也极不方便,一般来说简单的套用是没有问题的,甚至3、4层,但是不要把所有内容都放到一个表格里去。第二个问题就是在一个大表格里

放入所有内容,而其中包括一个免费的计数器代码,嘻嘻,你猜有可能出现什么情况呢?其实也没什么大不了的,最严重的就是你的IE象死机了一样,什么都没显

示。解决方法就是把计数器单独放在一个表格里,别和其他内容一起放在同一表格。

5.写代码缩进的时候,不是使用Tab而是使用空格

犯错机率:一般
普遍性:较少
犯错可能性:不知道Tab更好用
这一个问题针对js、vbs、asp、php之类,html不能使用Tab会写一点程序的都知道什么叫缩进,怎么样缩进?有人使用空格,有人使用Tab,如果你是使用空格的,

那么从现在起,改用Tab吧。
使用空格有二大坏处:1、缩进速度慢、修改速度慢。2、增大网页体积,会影响速度。

6.不知道何时该用jpg、何时使用gif

犯错机率:一般
普遍性:非常普遍
犯错可能性:对这个不了解
呵呵,这个问题看起来好象很普通,但不懂的人大把的在,你知道什么情况下更应该使用jpg,什么情况下更应该使用gif吗?
你是不是想说当然是做透明图的时候用gif,其他的就用jpg啦!
呵呵。。。,这太显浅了你必须对jpg和gif的特性和性质有一定的了解才能掌握,并且还得居于实践,没实践过,再多理论也是没有用的。并且还得结合实际,结

合实际的意思是:有时候你知道用jpg更清晰(理论上),但实际上使用gif却会更适合(这里是指适合,而不是更好)。
也有些人会说在需要更清晰的质量的时候选择jpg,其实也不然,这与要输出的图片的尺寸及颜色数所决定。

举报

  • 相关推荐
  • AI日报:阿里通义推Qwen-TTS模型;Cursor已支持网页和手机端;字节发布图像合成技术XVerse

    【AI日报】今日AI领域7大突破:1)阿里通义Qwen-TTS实现方言语音合成重大突破;2)Cursor发布Web版AI编程工具;3)字节XVerse技术实现多对象精准图像生成;4)NoteGen跨平台AI笔记工具革新知识管理;5)ManimML动画库可视化Transformer架构;6)TEN+Agent开源语音交互技术降低延迟;7)Chai-2抗体设计模型将药物研发周期缩短至两周。淘宝同时上线RecGPT推荐模型提升购物体验。

  • 视觉中国:解码文创!总台“万马奔腾” 文创设计征集活动火热进行中

    中央广播电视总台联合中视实业集团等机构举办"万马奔腾"暨马年"大春晚季"文创设计征集活动,旨在通过创意设计传承中华优秀文化。活动聚焦生肖马元素与春节文化,鼓励设计师挖掘非遗技艺与现代设计的融合,打造兼具文化价值与商业潜力的文创产品。征集涵盖文创产品设计、平面插画、智能机械三大领域,面向专业设计师和文创爱好者。优秀作品将获得丰厚奖励及展示推广机会,助力传统文化创造性转化和创新性发展。活动已进入中期阶段,距离截稿还有34天。

  • 用AI解锁技术公益,第五届Light创造营圆满收官

    第五届Light创造营圆满收官,19支团队从847个申报项目中脱颖而出。经过激烈角逐,11个优秀项目入围并获得资助,覆盖无障碍服务、非遗传承、儿童教育、乡村振兴、环保等多元领域。本届创造营特别关注AI技术应用,多个项目聚焦解决残障群体生活难题,如AR字幕手语眼镜帮助听障人士实现双向沟通,面部控制系统让手部障碍者操作数字设备。此外,AI还被应用于青少年心理健康干预、景区无障碍评分等场景。腾讯基金会持续支持AI技术在公益领域的创新应用,五年来已孵化上百个具有社会价值的项目,影响范围不断扩大。

  • A 股科技叙事行情演绎 建信基金旗下科创价值ETF联接正在发行中

    建信上证智选科创板创新价值ETF联接基金正在发行,该基金紧密跟踪智选创新价值指数(950333),聚焦战略新兴产业。该指数从科创板各行业上市公司中精选100只科技创新能力强、估值较低且盈利质量较好的证券作为样本,综合反映科创板创新主题上市公司证券的整体表现。自2020年以来,该指数已上涨67.75%,超额表现亮眼。该基金作为场外联接基金,投资门槛低,为投资者提供了便捷布局科创板、把握科技发展机遇的渠道。

  • 销售易多页签能力上新:N个任务1屏聚合,丝滑体验0切换

    文章探讨了数字化办公时代CRM系统面临的两大痛点:1)多页面切换导致效率低下,如电销人员需同时处理多个客户咨询时,浏览器标签堆积造成混乱;2)业务流程跳转碎片化,如大客户经理需在不同模块间反复切换导致数据丢失。销售易CRM推出的多页签浏览模式通过分屏协作、多任务并行,显著提升了工作效率:电销人员单客户处理时间缩短33%,信息遗漏减少90%;大客户经理复�

  • “全球链接 生态共生”钻石珠宝产业创新生态发布!中钻网同步启幕

    6月28日,"全球链接+生态共生"钻石珠宝产业生态创新发布会暨中钻网开幕仪式在上海普陀举行。活动汇聚珠宝行业领导、政府代表及企业高管,共同探讨产业数字化转型。普陀区将打造集交易、消费、展示于一体的钻石珠宝全产业链生态圈,建设中钻网数字化平台,推动产业创新升级。现场签署多项战略合作协议,发布《普陀区钻石珠宝产业生态规划》,旨在将普陀建设成为国际钻石文化消费地标和产业创新策源地。活动标志着中国珠宝产业向数字化、国际化迈出重要一步。

  • 在版权诉讼中,Anthropic 赢下了关键AI训练裁决

    就像任何渴望成为作家的读者一样,Anthropic的语言模型并非为了抄袭或取代原作,而是为了创造出完全不同的内容……

  • AI 购物,为什么难以戳中你的痛点?

    AI进入电商不是什么新鲜事。 对平台而言,AI正在成为电商的新质生产力。AI导购、数字人直播、AI换装等新场景,被电商大厂放进自己的App。降本增效的同时,或许能收获新的用户体验可能性。 但是,美好的可能性还过于遥远。对C端消费者而言,体感并不一定如平台所畅想的那么丝滑。 普通人对电商应用AI 最深刻的印象,恐怕就是机器人客服油盐不进的自动回复,彼此对�

  • 挖掘非凡设计创想,第三届ASKO非凡设计大奖大师思享会西安站

    第三届ASKO非凡设计大奖西安站活动在张裕瑞那城堡酒庄举办,以"感质时序 细铸经典"为主题,汇聚设计精英探讨永恒设计理念。活动特邀设计师孟也分享空间设计逻辑,强调自然与生活的对话。ASKO作为百年北欧品牌,秉持"少即是多"的极简设计理念,其洗衣房解决方案和无胶圈金属门封设计展现了环保与实用并重的匠心。活动通过古今交融的思维碰撞,探讨了可持续设计的发展方向,为未来人居提供创新思路。

  • 用心良苦不提降价!苹果发布81页幻灯片帮孩子说服父母买 Mac

    今日,有媒体报道称,苹果公司最新推出了一份长达81页的《家长推介》演示文稿,以帮助孩子说服父母将Mac作为学习设备收入囊中。 这份演示文稿目标受众明确指向学生群体,且十分贴心,提供了PowerPoint、Google Slides和Keynote等多种格式,方便不同使用习惯的学生使用。