仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 929|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 给大家带来CSS划定规矩的布局和Grouping、class和id

[复制链接]
愤怒的大鸟 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:09:06 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
业界越来越关注DIV+CSS的标准化设计,大到各大门户网站,小到不计其数的个人网站,在Div+CSS标准化的影响下,网页设计人员已经把这一要求作为行业标准。
2.1划定规矩的布局<rules>::=<selector><左括号><declarations><右括号><declarations>::=<declaration>{<SEMICOLON><declaration>}[SEMICOLON]<SEMICOLON>::=分号<declaration>::=<property><COLON><value><COLON>::=冒号<value>::=<keywordlist><keywordlist>::=<keyword>{<SPACE><keyword>}<SPACE>::=空格一般会用空格做为value之间的分开符,有个破例:Asweveseen,CSSkeywordsareseparatedbyspaces—exceptinoneinstance.IntheCSSpropertyfont,thereisexactlyoneplacewhereaforward-slash(/)canbeusedtoseparatetwospecifickeywords.Heresanexample:h2{font:large/150%sans-serif;}Theslashseparatesthekeywordsthatsettheelementsfontsizeandlineheight.Thisistheonlyplacetheslashisallowedtoappearinthefontdeclaration.Alloftheotherkeywordsallowedforfontareseparatedbyspaces.2.1.1selectorselector:defineswhichpieceofthedocumentwillbeaffected.Selector一般是html元素,也多是xml中同意任何元素。2.1.2DeclarationsandKeywords2.2Grouping2.2.1groupingselectors将多个元素共用一个style,例子:
  1. /*group1*/
复制代码
h1{color:silver;background:white;}h2{color:silver;background:gray;}h3{color:white;background:gray;}h4{color:silver;background:white;}b{color:gray;background:white;}/*group2*/h1,h2,h4{color:silver;}h2,h3{background:gray;}h1,h4,b{background:white;}h3{color:white;}b{color:gray;}/*group3*/h1,h4{color:silver;background:white;}h2{color:silver;}h3{color:white;}h2,h3{background:gray;}b{color:gray;background:white;}2.2.1.1Theuniversalselector*{color:red;}2.2.2groupingdeclarations例子:h1{font:18pxHelvetica;}h1{color:purple;}h1{background:aqua;}h1{font:18pxHelvetica;color:purple;background:aqua;}Ifthesecondsemicolonisomitted,however,theuseragentwillinterpretthestylesheetasfollows:h1{font:18pxHelvetica;color:purplebackground:aqua;}Sincebackground:isnotavalidvalueforcolor,andalsosincecolorcanbegivenonlyonekeyword,auseragentwillignorethecolordeclaration(includingthebackground:aquapart)entirely.Itmightrenderh1saspurpletextwithoutanaquabackground,butmorelikely,youwontevengetpurpleh1s.Instead,theyllbethedefaultcolor(usuallyblack)withnobackgroundatall.(Thedeclarationfont:18pxHelveticawillstilltakeeffectsinceitwascorrectlyterminatedwithasemicolon.)2.2.3GroupingEverything就是同时groupselector和declarationh1,h2,h3,h4,h5,h6{color:gray;background:white;padding:0.5em;border:1pxsolidblack;}Youvegroupedtheselectors,sothestylesontherightsideoftherulewillbeappliedtoalltheheadingslisted,andgroupingthedeclarationsmeansthatallofthelistedstyleswillbeappliedtotheselectorsontheleftsideoftherule.2.3classandidselectors最复杂的selector是只针对文档元素的elementselecoter,另有两种selecotrs:classselectors和idselectors。这两种selector能够自力于文档元素的,即不是于详细某个的文档元素间接联系关系的。这两种selecoter能够独自利用,也能够和elementselector一同利用。可是这两种selector的利用必要共同文档编写的标准性。好比写一个会商plutonium处置体例的文档,文档由良多段构成,包括良多告诫信息,但愿将告诫的字体置为bold,以凸起显现。可是这些告诫信息的格局良多,一段笔墨,列表式,一大节文本等。以是不克不及经由过程p{font-weight:bold;}的情势来界说。如许没法从满是文本的全部文档中找到告诫信息,并加粗。因而,办理体例:利用classselectors给告诫信息的部分加上标志。
样式的调整更加方便。内容和样式的分离,使页面和样式的调整变得更加方便。
admin 该用户已被删除
沙发
发表于 2015-1-18 05:25:22 | 只看该作者
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
飘飘悠悠 该用户已被删除
板凳
发表于 2015-1-24 13:44:37 | 只看该作者
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
第二个灵魂 该用户已被删除
地板
发表于 2015-2-1 16:46:26 | 只看该作者
学Dreamweaver技术的过程其实是一个增加信心的过程。
小魔女 该用户已被删除
5#
发表于 2015-2-7 12:04:14 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
若相依 该用户已被删除
6#
发表于 2015-2-22 03:33:01 | 只看该作者
以上大概就是文字图片的一些链接方法,通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识,他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起,其功能强大,使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。
冷月葬花魂 该用户已被删除
7#
发表于 2015-3-7 00:04:17 | 只看该作者
只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。
深爱那片海 该用户已被删除
8#
发表于 2015-3-14 00:05:28 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
分手快乐 该用户已被删除
9#
发表于 2015-3-21 00:22:34 | 只看该作者
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 03:46

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表