HTML+CSS总结的.docVIP

HTML+CSS基础部分 CSS样式重置 body,h1,h2,h3,h4,h5,h6,p,dl,dd,ol,ul,form, pre,th,td,input,textarea,select{margin:0;padding:0;} textarea{overflow:auto;resize:none;} table{border-collapse:collapse;} li{list-style:none;} a{text-decoration:none;} img{border:none;vertical-align:top;} em{font-style:normal;} .clear:after{content:;display:block;clear:both;} .clear{zoom:1;} Lesson0 PS基础 常用快捷键： Ctrl+alt+shift+e 盖印可见图层 三中图片格式应用 JPG：网页中的大图，高清图（体积大）； GIF：网页中的小图标（动画图片）； PNG8：网页中的小图标； PNG24：图像中存在半透明效果的图片； PSD测量注意事项 一般电脑会有宋体、微软雅黑两种字体 宋体在XP下一般都是11乘以11，win7下是11乘以12 文字不能小于12px，在谷歌下不支持 Lesson1 1 代码初识 2浅析HTML meta charset=utf-8/ 代码编码格式 文件的编码格式需要和代码的编码格式保持一致 utf-8 国际标准 gb2312 中文简体标准 3样式位置 4 background详解 background 背景 background-attachment: fixed; 背景是否滚动 background-color: gray; 背景颜色 background-image: url(bg.jpg); 背景图 background-repeat: no-repeat; 背景图是否重复 background-position: center 0px; 背景图位置（数值可以为负数，可以为百分数） 5 border padding详解 边框样式： solid 实线 dashed 虚线 dotted 点线（IE6不兼容1px点线）（各个浏览器显示大于1px点线也不尽相同） 6 margin外边距详解 margin 外边距 外边距的问题： 1、上下外边距会叠压； 2、父子级包含的时候子级的margin-top会传递给父级； 7 盒模型和结构样式 8 页面常见文本设置 font-size 文字大小（一般均为偶数） text-indent 首行缩进（em缩进字符）（可以为负值） letter-spacing 字符间距 （也适用于汉字，可以为负数） word-spacing 单词间距（以空格为解析单位） 9 页面常见样式总结 font：font-style | font-weight | font-size/line-height | font-family； font和line-height同时使用，font里面已经包括行高可能覆盖掉line-height Lesson2 1 img和a标签 img src=图片地址 alt=图片名/ 图片（单标签）alt属性是图片占位符，是给百度搜索引擎抓取使用； a标签三个作用：链接/下载/锚点 target 链接打开方式 blank 新窗口 self 当前窗口 base target=_blank/ 定义页面链接默认打开方式 2 常见标签和SEO浅析 常见标签 Strong 强调（粗体） Em强调（斜体） dl 定义列表 dt 定义列表标题 dd 定义列表项 SEO ：搜索引擎优化； 部分方法： a、页面标签语义化； b、使用对SEO有利的标签：h1/h2/h3/strong/em…… c、提高页面关键词密度； 3 基础选择符 id选择符（#） 群组选择符（，） class选择符（.） 类型选择符(div……) 包含选择符（div p） 通配符（*） 4 选择符优先级 基础选择符的优先级 * 类型（1） class（10） id（100） style行间（1000） js 同级样式默认后者覆盖前者 a伪类详解 伪类：伪类用于向被选中元素添加特殊的效果。（元素在特定情况下才具备的。） a四个伪类的顺序： link visited hover active IE6不支