div+css-学习笔记.doc

一.建站流程平面设计 ---- 制作 ----- 程序 1.平面设计：ps 2.制作：div+css 3.程序：asp；asp.net; php; jsp。 jQuery：制作和程序中常用 二．简介 html：超文本标记语言 （目前常用版本xhtml，最新版本html 5.0） xml：可扩展标记语言 xhtml：相当于html 4.0版本 html标签 html/html head/head div/div p/p br /…… 常用标签：div/div ulli/li/ul dldt/dtdd/dddl CSS:（Cascading Style sheet）层叠样式表 命名：一般以英文命名 （首字母不能为数字） 三．css 调用方法 外联：在head/head之间调用 link href=css/css.css rel=stylesheet type=text/css / 内联：写在head/head之间style rel=stylesheet type=text/css /style 内嵌：嵌在标签里style= 四．属性 1. class （.） id （#） 2.属性写在花括符里，每条用逗号隔开 （内嵌 style= ） 3.常用 weight：宽 height：高 border: 边线 margin：边距 （margin：0 auto；居中） padding：填充 color：字体颜色 font-size: 字体 font-family：字体 float：浮动（使两个div在同一行上） background:背景 4.边线 border：1px solid #ccc； border-top：1px solid #ccc； border-left： border-right： border-bottom： solid:实线 dashed:虚线 dotted: 点线 double:双线 5.边距 margin-top:10px; margin-left:10px; margin-right:10px; margin-bottom:10px; 简写 margin：10px； margin：10px 20px 30px 40px; (由上面开始 顺时针方向) margin：10px 20px; （上下10px 左右20px） 边距还可以是负数 6.填充 padding-top:10px; padding-left:10px; padding-right:10px; padding-bottom:10px; 简写 padding：10px； padding：10px 20px 30px 40px; (由上面开始 顺时针方向) padding：10px 20px; （上下10px 左右20px） 7.文字 font-family:黑体, Arial; font-size：12px; 文字大小 color:#555;文字颜色 font-weight: bold; line-height：22px; 行高 text-indent:2em; 首行缩进（单位em首行缩进） text-align:center; 水平对齐 word-spacing;英文单词 letter-spacing:1px;汉字或字母间距 font-style（字体样式）: normal（正常）、italic（斜体）或oblique（倾斜） 简写 font:italic bold 12px/22px arial, 宋体; 文字两端对齐最后一行左对齐 text-align:justify; text-justify:inter-ideograph; 文字超出显示省略号 text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap; overflow:hidden; 8.背景 background-color：#fff；背景颜色 background-image：url(../images/index2_01.png); 背景图片 background-repeat：no-repeat; 背景不重复 值：repeat-x x轴重复 repeat-y：y轴重复 background-position：10px 20px；（离左边10像素 上边20像素） 它的值可以是left right center top bottom background-attachment:fixed; 背景浮动 scroll(默认值)背景滚动 简写： background: