仓酷云

标题: DIV教程之思索Web站点计划对类和id的定名体例 [打印本页]

作者: 第二个灵魂 时间: 2015-1-16 00:09
标题: DIV教程之思索Web站点计划对类和id的定名体例
标准的选择器不能格式化一个元素内容的第一个字母或者第一行，而伪元素选择器能实现
Web开辟者（也就是您）能够经由过程创立CSS类及id称号并利用这些称号来对Div和其他的页面元素、标签举行标识。对开辟职员来讲，在定名从头界说XHTML标志（tags）的cssselectors时，必需包管其与预界说的标志正确婚配，但就类和id选择器称号而言，则仁者见仁，智者见智。但是为所欲为的为这些类和id定名则并非个好的习气。

　　在浏览了由AndyClarke（ofStuffandNonsenseandAllThatMalarkey）和EricMeyer所撰写的关于css类和id定名标准的系列文章以后，我入手下手思索在本人的Web站点计划过程当中对类和ids的定名体例。
　　直不雅定名
　　当在计划Web页面和必要对一个Div举行标识的时分，最天然的设法就是利用能够形貌元素地点页面地位的辞汇来对其定名。这类办法使得类和id的称号以下面所示：
top-panel
horizontal-nav
left-side
center-column
right-col
　　这些是CSS和XHTML类和id的无效定名体例。这些辞汇复杂而且可以令人望文生义，因而满意了标识页面元素和响应的CSS款式的必要。
　　但成绩是如许的称号同页面内容的特定表达体例相干联。这些定名参考了某种特定页面结构中的页面元素地位，因而在如许的结构以外利用就会显得分歧适乃至形成了解凌乱。同时，这些定名没有触及文档内容的布局。因而，上面给出了对CSS类和ID定名更好的办法。
　　布局化定名
　　布局化的标志意味着表达体例/地位信息同内容的完整分别——这个中包含呈现在标志（markup）中的类和id称号。
　　有标志的相干信息都是用来形貌文档的布局而不是表面。如许的特性使得我们能够经由过程复杂的改动CSS的体例来对分歧表面格局下的内容（content）和标志（markup）举行重用。当你了解这类体例时，很简单就能够发明接纳页面地位来为类和id定名的体例在处置如音频（audio）等表面格局上显得十分分歧适。因而，应该依据在文档中的利用目标而非呈现地位来对类和id举行布局化定名。
　　能够依照以下所示的布局化体例来对类和id称号定名：
branding
main-nav
subnav
main-content
sidebar
　　这些名字同直不雅定名体例一样十分易懂，但他们形貌了页面元素的感化而非地位。这使得代码加倍切合利用地道的布局化标志（structuralmarkup）的初志，即开辟职员能够在不改动标志的情形下对林林总总媒体下的显现格局举行处置。
　　即便你不盘算在其他的媒体上对Web页面举行格局修正，利用布局化定名体例还能够匡助你在往后的站点晋级或从头计划中更加轻松。比方，布局化定名制止了当一个div同idright-column挪动到页面右边后所带来的凌乱。对divsidebar的接纳如许的定名体例就显得加倍得当，由于不管它呈现在页面的哪一边，这个名字仍旧对开辟职员来讲直不雅易懂。
　　一些定名常规
　　AndyClarke剖析了40份由推许尺度化Web计划理念的开辟职员所计划的Web站点的源代码。只管类和id称号很不一致，可是仍是发明了一些频仍呈现的经常使用称号。这里给出了最经常使用类/id称号的示例列表：
header
content
nav
sidebar
footer
　　这些罕见的类和id称号是不是标记着一种尺度的出生或是广泛承受常规的构成呢？只管这是我所但愿的，但我其实不这么以为。我切实其实但愿可以瞥见一整套关于我们天天都能够看到的经常使用页面元素的定名尺度。同时，利用尺度化的定名体例可使得寻觅页面元素和对Web站点晋级带来便利，特别当必要在由分歧开辟职员在分歧工夫所开辟站点中换来换往事情的时分。

层叠样式表（CascadingStyleSheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。

作者: 乐观 时间: 2015-1-18 05:25
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。

作者: 只想知道 时间: 2015-1-18 05:25
在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

作者: 金色的骷髅 时间: 2015-1-24 15:42
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

作者: 冷月葬花魂 时间: 2015-2-2 07:24
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。

作者: 活着的死人 时间: 2015-2-7 18:14
技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

作者: 兰色精灵 时间: 2015-2-23 00:14
可以使用 CSS 检查工具进行设计。

作者: 再现理想 时间: 2015-3-7 06:07
时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

作者: 精灵巫婆 时间: 2015-3-14 15:21
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

作者: 小魔女 时间: 2015-3-21 12:41
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别，但它同时也存在着致命的弱点。

欢迎光临仓酷云 (http://ckuyun.com/)