2013年4月27日

第9章 CSS入门

摘要: 1. CSS概述:一种对Web文档添加样式的简单机制 a. CSS是Web标准化布局语言,它可以控制颜色、版式设计、以及元素、图像的尺寸和布局; b. 虽然CSS精确并且功能强大,但是对于手工书写来说还是比较简单的; c. CSS的适用性:仅仅一个CSS文件就能控制包含上千个页面和几百兆字节的整个站点的外观; d. 其创建者(W3C)的意图是以CSS取代HTML表格式布局、框架和其他外观程式。对于混合过渡方式布局,CSS也是相当高效的; e. 纯CSS布局和结构式XHTML相结合能帮助设计师从结构中分离出来,使站点的访问及维护更加容易。2. “最合适方案”设计方法 a. 先在可靠的... 阅读全文

posted @ 2013-04-27 00:59 BigPalm 阅读(114) 评论(0) 推荐(0) 编辑

2013年4月26日

第8章 XHTML的示例:混合布局(第一部分)

摘要: 1. 目标:制作一个混合的、过渡的布局,结合使用具有结构化的文本标记和增强型可访问性的传统表格布局技术。 a. 用CSS来控制颜色、尺寸和元素的相关位置; b. 用XHTML文本和CSS来实现菜单图片的交替效果,用CSS来代替Javascript能节省带宽,增加可访问性;2. 基本方法 a. 分割表格:将版面分成两个表格能允许我们更好的运用id属性——简化CSS、增强可访问性和对每个表格做出结构性标记(id); b. 表格摘要属性summary:对于普通桌面浏览器不可见,但对于屏幕浏览器可以大声读出它的数值,增强可访问性; c. 跳过导航:跳过导航可以让使用屏幕阅读器的用户带来益处;... 阅读全文

posted @ 2013-04-26 23:43 BigPalm 阅读(112) 评论(0) 推荐(0) 编辑

2013年4月25日

第7章 紧凑而坚固的页面保证:以严格和混合的标记组成的结构

摘要: 1. div和span div和span元素,再加上id和class属性,提供了一个把结构添加到文档的通用机制; div是一个“一个增加结构的通用机制”; id和class的定义应该是有意义或元结构的名字,如果你养成习惯给一些页面核心组件命名,你就会抛弃从页面表现层进行思考和开发的习惯了; 一个id值必须以一个字母或者下划线开头,它不能以一个数字开头。W3C的校验服务可能不会捕获这个错误,而一些XML处理器可以。由于一些老CSS2.0实现中的限制,在class和id中使用下划线也不是好主意; div配合有意义的id和class可以提供语义信息。2. 混合布局和简洁的标记 使用表格并... 阅读全文

posted @ 2013-04-25 17:32 BigPalm 阅读(172) 评论(0) 推荐(0) 编辑

CSS 常见继承属性

摘要: 继承性:“后代元素”继承“祖先元素”属性设置的性能1.字体属性:font-family;font-size;font-weight;font-variant;font-style;2.文本属性:text-align;text-indent;line-height;letter-spacing;word-spacing;text-transform;direction;3.列表属性:list-style-type;list-style-image;list-style-position;4.其他visibility;color;cursor; 阅读全文

posted @ 2013-04-25 16:45 BigPalm 阅读(213) 评论(0) 推荐(0) 编辑

Unitless line-heights

摘要: line-height<ul> <li>I'm a list item with <small>small text</small>.</li></ul>ul {font-size: 15px; line-height: 1em;}li {font-size: 10px;}small {font-size: 80%;} li将继承ul的line-height:15px,为15px(15px*1),small的line-height也为15pxul {font-size: 15px; line-height: 1;} 阅读全文

posted @ 2013-04-25 16:23 BigPalm 阅读(206) 评论(0) 推荐(0) 编辑

2013年4月24日

CSS 在IE6, IE7 和IE8中的差别

摘要: 原文地址:http://www.jb51.net/css/21991.html选择器与继承子选择器示例body > p { color: #fff;}描述子选择器选择一个特定父级元素的所有直接子级元素,在上面的例子中,body是父元素,p是子元素。支持情况IE6NoIE7YesIE8YesBugsIE7中,如果在父级标签和子级标签之间有一个HTML注释,子选择器将不会工作。链类示例.class1.class2.class3 { background: #fff;}描述链类用于送一个HTML元素有多个class声明的情况,就像这样:<div class="class1 cl 阅读全文

posted @ 2013-04-24 23:47 BigPalm 阅读(230) 评论(0) 推荐(0) 编辑

CSS hide and show

摘要: 1. IE<=6/Win 不识别CSS2高级选择器(IE5/MAC支持)1 .buggybox {height: 1%;} /* for all browser */2 #parentElement>.buggybox {height: auto;} /* fix for browser except IE<=6/Win */2. 只有IE<=6/Win,IE/MAC识别* html选择器 && MAC-hack1 /* Hides from IE5-mac \*/2 * html .buggybox {height: 1%;} /* just for 阅读全文

posted @ 2013-04-24 21:45 BigPalm 阅读(389) 评论(0) 推荐(0) 编辑

2013年4月18日

第6章 XHTML:Web重构

摘要: 1. 用正确的文档类型和命名空间 XHTML允许设计师或开发者创造个性化的、不同类型的文档,每种文档被不同的规则约束。这些规则都在一个叫文档类型定义(DTD)的XHTML规范的基础上定义的。DOCTYPE声明校验服务,现代浏览器根据你定义的DTD来描述你的标记。在转换过程中,这些信息告诉那些校验服务和浏览器如何操作页面。 DOCTYPE声明的是一个兼容标准的网页的关键组成部分,如果DOCTYPE声明不正确,标记和CSS都不会生效。 Note:浏览器并不进行严格的DTD检验,如果需严格用XHTML则应发送MIME:aplication/xhtml+xml。 过渡型或框架型HTML 4.0... 阅读全文

posted @ 2013-04-18 00:22 BigPalm 阅读(135) 评论(0) 推荐(0) 编辑

2013年4月17日

第5章 现代标记语言

摘要: 1. XHTML XHTML是一个用XML语法对HTML重新阐述的语言,是一种用XML定制的语言。XHTML是一个基于XML的标记语言,并且看起来和HTML有些相像,只有一些小的但很重要的区别。 XHTML的一致性能避免一些浏览器问题,更重要的是基于XML的语言开发页面能很好地和其他基于XML的语言、应用程序和协议进行交互。2. XHTML版本 XHTML 1.0,主要是规范了HTML,XHTML 1.0过渡型兼容HTML;XHTML 1.1 与1.0不兼容,并且使用了一个MIME类型会引起一些浏览器进行错误处理;XHTML 2.0准备向语义化靠的更近,故意设计成不向前兼容于HTML和X... 阅读全文

posted @ 2013-04-17 23:38 BigPalm 阅读(110) 评论(0) 推荐(0) 编辑

2013年4月16日

第4章 可寻性、聚合、博客、播客、长尾、Ajax

摘要: 1. XML 和 HTML a. XML和HTML来源于同样的技术SGML,XML是HTML的提升,目标是替代HTML; b. HTML是构架Web页面的一种基本语言,但Web的规则很松散(如标记是否关闭不影响),这使人们创建Web页面变得容易。而现在网站经常需要频繁通过发布工具重组页面,经常需要将内容从数据库发布到Web页面或者无线设备,HTML松散的规则阻碍了数据的转化; c. HTML仅仅是一种格式化语言,而不是一个能确切描述自己的语言,语义化不高,因此限制了我们重用这些内容的能力; d. 基于XML的标记,则由一些统一的规则组成并且具备超越Web领域的能力。当用XML创建一个文... 阅读全文

posted @ 2013-04-16 23:17 BigPalm 阅读(187) 评论(0) 推荐(0) 编辑

导航