仓酷云

标题: 给大家带来CSS网页结构id和class类的定名先容 [打印本页]

作者: 乐观 时间: 2015-1-15 23:58
标题: 给大家带来CSS网页结构id和class类的定名先容
如果单独使用DIV而不加任何CSS,那么它在网页中的效果和使用是一样的。
破洛洛文章简介：关于CSS网页结构id与class定名也许成为人人对照头疼的成绩.
　关于CSS网页结构id与class定名也许成为人人对照头疼的成绩，在webjx.com中早已有相干的先容，但仍是不克不及满意人人对常识的渴求。

1、用class_name体例写类名。
　　之前喜好用class-name写，不外仿佛两样也没甚么不同。但我对照否决用className写类名，由于一直对扫瞄器巨细写敏感的成绩抱有嫌疑立场。可是id我会写成驼峰式，来由见下一条。

2、款式都用class而不必id。
　　有三个来由。
　　1，id不成以反复，以是用class的话，能够毫无所惧的用有数次。
　　2，id的优先级太高，如果写了一个#page_contenta{color:#f60}，那你垮台了，内里要改链接色彩，都必需加上#page_content才干超出这个优先级。
　　3，id专门留给JS用，如许才切合体现与举动分别的准绳。以是id我用驼峰式，也是为了表现这一点。

3、margin和padding，只管省略最初一个值。
　　好比margin:20px10px5px10px;，摆布值是一样的，就应当省略失落最初一个值，写成margin:20px10px5px;如许到时分要改摆布间距，改一个就好，以免改漏了。实在这个成绩固然很微小，可是能够看得出对margin四个值省略划定规矩的纯熟水平。

4、按尺度写css，再针对特定扫瞄器作hack。
　　好比，一般我们会碰到以下的写法：

.side_col_webjx{
float:left;
display:inline;
margin-left:20px;
}
　　而我的写法会是：

.side_col_webjx{
float:left;
margin-left:20px;
}
*.side_col_webjx{
_display:inline;/*hackedforIE6*/
}
　　看分明了么？不该该把hack混在一同，也不该该用一种幸运的心态，以为float:left与display:inline写在一同没事。嗯，它们俩的确没事儿，可是其他的hack就纷歧定了。并且这里写display:inline地道就是为懂得决IE6的bug，以是后面加高低划线，以明白的表达你的目标。
　　别的不要觉得但凡hack都是为IE筹办的。实在有些hack是针对其他扫瞄器的，好比FF。这就请求你对css尺度的纯熟把握，可以自傲的判别哪些衬着是恪守尺度，哪些违背尺度的。
　　别的，我喜好在hack后面加上星号，实在这地道是团体习气了。大概过段工夫我就不这么用了，呵呵。

5、记得加空格。
　　.class_name{property:value;}。我团体以为公道的空格是优异代码的一个目标。按英文的习气，标点前面都应当带空格（假如你写Thisisapen.That’sapencil.句点前面不加空格，word内里会有毛病提醒）。以是既然css是本国人创造的，应当按他们的格局来写。相似的，在JS里vara=b+c;内里的空格也应当都要加。

6、得当的层叠（Cascading)或缩进以界说css的“感化域”。
　　啥叫“css的感化域”？实在并非一切的款式都在一切的中央利用。有的款式只用在某一块内里，好比“导航栏”里的“搜刮框”，大概应当写成：

.nav.search{}
　　而偶然候用层叠会增添代码优先级，以是也能够用缩出去“意味性的”表现感化域。像如许：

.login_box{}
.forgot_pwd{}
　　缩进，是为了暗示它们对应的标签具有父子干系。但如许只能起一个提示的感化。
业界越来越关注DIV+CSS的标准化设计，大到各大门户网站，小到不计其数的个人网站。

作者: 若天明 时间: 2015-1-17 23:51
每天上网看着那样多的网页，于是我才下定决心选择了网页制作这一门课程，目的就是希望以后能够做出一个完美的网页来。

作者: 精灵巫婆 时间: 2015-1-26 22:09
滚动条)层属性--溢出(visible/hidden/scroll/auto)

作者: 金色的骷髅 时间: 2015-2-5 01:41
Dreamweaver在所见即所得添加链接时，可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。

作者: 冷月葬花魂 时间: 2015-2-11 02:44
学Dreamweaver技术的过程其实是一个增加信心的过程。

作者: 柔情似水 时间: 2015-3-1 20:10
以上大概就是文字图片的一些链接方法，通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识，他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

作者: 因胸联盟 时间: 2015-3-10 23:54
还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

作者: 乐观 时间: 2015-3-17 16:32
在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

作者: 蒙在股里 时间: 2015-3-24 15:48
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

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