css样式的注意事项.ppt.pptVIP

清除浮动(clear) 根据浮动的特点,会产生环绕的效果,但是当不需要环绕时可以通过清除属性还原块的基本属性. 父容器不能自适应高度的解决方法: 1.设定高度 2.设定overflow 和zoom属性 网页布局之定位 定位（position）属性的使用 格式：position：absolute|relative|fixed 作用：将一个网页元素定位在某个具体的位置 注意：设置这个属性的同时，需要设定具体的位置，也就是left或者right以及top或者bottom 相对定位:相对于元素在文档流中位置进行偏移，元素仍然占据原来的空间； 绝对定位不占据空间即完全脱离文档流，相对于最近 已定位的父标签进行偏移，如果不存在，则相对于body； 固定定位：即完全脱离文档流, 相对于浏览器进行偏移。 IE中如果相对于右(right)和底部(bottom)设置绝对定位 ，需要确定相对定位的框设置了尺寸。 定位(相对定位) 定位(绝对定位) 布局方式 两列定位布局 container 设置 position : relative属性。 一列设置宽度或边距，让开空间。 另外一列绝对定位。 三列定位布局 container 设置 position : relative属性。 一列设置宽度和边距，让开空间。 另外两列绝对定位。 布局 练习 一列固定宽度 一列宽度自适应 二列固定宽度 二列宽度自适应（分左右） 两列右列宽度自适应 三列浮动中间列宽度自适应 高度自适应 a onclick=this.style.behavior=url(#default#homepage);this.setHomePage(); href=#加为首页/a a href=javascript:window.external.AddFavorite(,建桥)设为收藏/a 在鼠标移动到这个tab时显示tab下面的内容：把SpryTabbedPanels.js中的Spry.Widget.TabbedPtotype.onTabMouseOver = function(e, tab)下面的return false;改成this.showPanel(tab);原来默认的是 this.addClassName(tab, this.tabHoverClass); * CSS（Cascading Style Sheets）,层叠样式表单，简称样式表，是用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。 样式就是格式，在网页中，文字的大小、色彩及图片位置等，都是设置显示内容的样式。 层叠是指在HTML文档中引用多个定义样式的样式文件（CSS文件）时，若多个样式文件间所定义的样式发生冲突，将依据层次顺序处理。 CSS选择符 * ID选择符 作用：为HTML标记设定单独的样式 格式： #id名 {属性:属性值; 属性:属性值 …} 标记1#id名 {属性:属性值; 属性:属性值 …} 使用方法： 标记 id=“id名 * 组合选择符 包含关系 如， p b { font-weight:bold;} p .first{font-weight:bold;} .orderlist li{font-weight:bold;} 全局选择符 所有的html标记使用相同的样式 如， * {margin:0;padding:0;} * 特殊选择符 作用：又称为伪选择符，对链接在不同状态下定义不同的样式效果 格式： a:hover {color: #00FF00} 实例 属 性 说 明 a:link 超链接的普通样式，即正常浏览状态的样式 a:visited 被点击过的超链接的样式 a:hover 鼠标指针经过超链接时的样式 a:active(较少用) 在超链接上点击时，即“当前激活”时超链接的样式 设定基本顺序 严格按照上述的顺序进行，否则可能效果显示不正确 * 选择器声明之集体声明 如， h1,h2,h3,h4,h5,h6 {color: green} * Dreamweaver中使用CSS样式： “窗口”|“CSS样式”命令。 CSS的创建 CSS的调用 CSS的附加 CSS的编辑 CSS的网页使用方法 * 方法 格式 位置 范围 内部样式 style type=t