nba2konline防守型中锋:《精通CSS+DIV》学习笔记

来源:百度文库 编辑:偶看新闻 时间:2024/04/30 20:16:24
CSS基础知识篇
  第1章、CSS初步体验
  
  1、行内样式表的优先级最高,其次是采用标记的链接式,再次是位于之间的内嵌式,最后才是@import的导入式样式表。link和style的优先级是一样的,取决于谁在前谁在后,还要考虑优先级加权的情况。笼统的说link和style的优先级谁高谁低是错误的。
  
  2、滤镜渐变filter只在IE浏览器下有效,并且在IE7中必须将安全级别设置成Medium.
  第2章、CSS的基本语法
  
  2、标记选择器、类别选择器、ID选择器。声明包含属性和值两部分。
  
  3、在没有定义选择器的时候,各个HTML标记采用浏览器自身默认的显示方式。
  
  4、类别选择器还有一种更直观的使用方法:直接在标记声明后接类别名称,以此来区别该标记。类别名称中包含标记和选择器。
  
  5、在HTML标记中,还可以同时给一个标记运用多个class类别选择器,从而将两个类别的样式风格同时运用到一个标记中。
  
  6、ID选择器的使用基本和类别选择器相似,不同之处在于ID选择器只能在HTML页面中使用一次,因此针对性更强。一个id最多只能赋予一个 HTML标记。
  
  7、集体声明、嵌套声明。类别选择器和ID选择器都可以进行嵌套。还可以多层嵌套。
  
  8、子标记会继承父标记的所有样式风格,并可以在父标记样式风格的基础上再产生新的样式。
  第3章、用CSS设置丰富的文字效果
  
  9、通常文章正文中使用的是易读性较强的serif字体,用户长时间阅读下不容易疲劳。而标题和表格则采用较醒目的sans-serif字体,他们需要显著和醒目,但不必长时间盯着这些文字来阅读。WEB设计及浏览器设置中也是推荐遵循此原则。
  
  10、绝对单位及其含义
  绝对单位 说明
  in Inch,英寸
  cm Centimeter,厘米
  mm Millimeter,毫米
  pt Point,印刷的点数,在一般的显示器中1pt相当于1/72inch
  pc Pica,1pc=12pt
  
  11、除了利用物理单位设定文字的绝对大小的方法,css还提供了一些绝对大小的关键字作为font-size的值,总共7个:xx- small,x-small,small,medium,large,x-large,xx-large.绝对大小在不同的显示器中显示效果有差异,因此不推荐使用。
  
  12、px显示大小与显示器的大小及其分辨率有关。采用“%”或者“em”都是相对父标记而言的,如果没有设定父标记的字体大小,则相对于浏览器的默认值。
  
  13、文字效果可以同时赋值,只需用空格隔开即可。
  第4章、用CSS设置图片效果
  
  当vertical-align的值为bottom或者sub时,IE与Firefox的显示效果是不一样的,所以建议尽量少使用浏览器显示效果不一样的属性值。
  第5章、用CSS设置网页中的背景
  
  竖排版语句“writing-mode:tb-rl”只有IE浏览器才支持,firefox浏览器并不支持该CSS属性。
  第6章、用CSS设置表格与表单的样式
  
  1、标记中的summary属性值用于概括整个表格的内容,在用浏览器浏览页面时,它的效果是不可见的,但对搜索引擎等则十分重要。
  
  2、在HTML页面中构建表格框架时应该尽量遵循表格的标准标记,养成良好的编写习惯,并适当的利用tab、空格和空行来提高代码的可读性,从而降低后期的维护成本。
  
  3、通过CSS中定义奇数行和偶数行的样式设置,增加易读性,主要配合服务器的动态生成。
  
  4、各个浏览器的显示差异主要是显示器的默认值不同导致的,通常的解决办法是制定该值。
  第7章、用CSS设置页面和浏览器的元素
  
  当前激活状态“a:active”一般显示的情况非常少,因此很少使用。
  第8章、用CSS制作实用的菜单
  
  1、IE对list-style-type的很多属性支持不是很理想
  
  2、“display:block”语句可以将超链接设置成块元素。
  第9章、CSS滤镜的应用
  CSS+DIV美化和布局篇
  第10章、理解CSS定位与DIV布局
  
  1、
标记在HTML3.0时代就已出现,但并不常用,标记在HTML4.0时才被引进。
的作用都是独立出各个区块。区别在于,
是一个块级(block- level)元素,它包围的元素会自动换行。而仅仅是一个行内元素(inline elements),在它的前后不会换行。没有结构上的意义,纯粹是应用样式,当其他行内元素都不合适的时候,就可以使用元素。此外,可以包含在
标记中,成为他的子元素,而翻过来则不行。
  
  2、一个盒子模型由content(内容)、border(边框)、padding(间隙)和margin(间隔)4个部分组成。
  
  3、在浏览器中,width和height的值都指的是width+padding或者height+padding的值。
  
  4、Border的groove、insert、outset和ridge这几个值,IE都支持得不够理想。IE不对border的背景上色,而 firefox的作用域为content+padding+border。
  
  5、Padding用于控制content与border之间的距离。Margin指的是元素与元素之间的距离、块与块之间的距离。
  
  6、在css中可以用过设置块元素的clear属性清除对float的影响。
  第11章、CSS+div布局方法剖析
  第12章、CSS+div美化与布局实战
  
  1、文档类型声明用来说明文件使用的xHTML或者HTML是什么版本,分过渡型、严格型、框架型。这句代码能够使得IE浏览器能更加正确地解析 CSS语法。
  
  2、 
  
  这段代码产生随机数,从而在刷新页面的时候调用不同的外部样式文件。
  CSS混合应用技术篇
  第13章、CSS与JavaScript的综合应用
  第14章、CSS与XML的综合应用
  
  1、XML文件中的
标记,在HTML中它表示换行,在XML中仅是一个空标记,没有任何意义。当将它的display属性设置为block块时,则可以起到换行的效果。
  
  2、XML的数据默认都不是块元素,而是行内元素。所以在XML中有时需要将各个行都设置为块,数据排列就会清晰很多。
  
  3、Firefox等一些浏览器并不支持XML文件中行内元素的width属性,也不支持CSS常用的属性覆盖方法,因此显示效果并不是很理想。
  第15章、CSS与Ajax的综合应用
  
  ajax不是单一的技术,而是4种技术的集合。Javascript、CSS、DOM、XMLHttpRequest对象。Javascript像胶水一样将各个部分粘合在一起,定义应用的工作流和业务逻辑。
  
  通过使用Javascript操作DOM来改变和刷新用户界面,不断地重绘和重新组织显示给用户的数据,并且处理用户基于鼠标和键盘的交互。
  
  CSS为应用提供了统一的外观,并且为以编程方式操作DOM提供了强大的途径。在Ajax中,CSS仍然是不可缺少的美术大师。
  
  XMLHttpRequest对象则用来与服务器进行异步通信,在用户工作时提交用户的请求并获取最新的数据。
  
  Ajax的核心是Javascript对象XMLHttpRequest。
  
  综合案例篇
  第16章、我的博客
  第17章、小型工作室网站
  第18章、企业网站
  第19章、网上购物网站
  第20章、旅游网站(转载)