dreamweaver网页设计课程css样式表单运用.doc

关于css样式表单 HTML虽为网页撰写的主要标记语言，但早期的HTML功能薄弱，无法满足大 众对文字控制及版面编辑的需求。W3C (world wide web consortium)遂公布「共 享样式表单(cascading style sheets, CSS)J ,以扩充HTML的功能。 CSS样式表单的优点如下： 可以设定所有对象(object)的变化，包括文字、图片、按钮、窗口等。 可以建立样式指令，在不同的对象套用相同的样式设定。 可以制作个人化的的样式档案，以统一更新网站内的各网页变化。 CSS样式表单的使用方式有三种： 网页内嵌式(embedded): 在HTML文件的head /head之间，以style /style来定义共同样式，使整 个网页使用同一样式。 标记加注式(in-line)：如果只有一个HTML标记需要设定样式，则可在该标记 内，加上屈性style二””，以个别修订样式。 外部设定式(external)：由于一个网站有许多网页，最好是统一样式，以免眼花 缭乱，失去浏览的重点。但如果每一网页均个别做样式设定，万一将来要修改 时，又怕会挂一漏万，因此可使每个网页均连结到一个.css的纯文本档，以设 定整个网站的样式。 如果同一 HTML文件内有两个样式定义，以最后的定义为准。 在浏览器方面，IE 5.0版与NetScape Communicator均支持CSS,但部份浏览器 不支持CSS样式指令。为免这些浏览器在无法辨识吋，将CSS语法当成本 文，则在style /style之间可用!—— 将CSS语法隐藏起来。 在网页编辑软件方面，IE的FrontPage 2(X)0可撰写CSS,但NetScape Composer 无法使用CSSo CSS样式表单的基本语法 CSS样式表单的基本语法是标记加注式(m-line)的表示法，亦即在 HTML标记后面，加上style二???”，内含属性名称(properties)与属性值 (value),以定义样式。两个属性间，以分号区隔；而属性与属性值间，以 冒号分开。 例如：原来标题文字之HTML标记为 ±2〉标题文字/h2〉 若想要标题文字变成绿色且改变字型为标楷体，使用CSS的标记加注式语 法如下： h2 stylc=font-family:标楷体;color:#FF0000;size=48n 其中font-famlily color、size分别是CSS的一项屈性，而标楷体、 #FF0000、48等，则是对应之属性值。 fit零迥 网⑥ 裁的恳量? im（i）朝明? 河址|自 科懒丹TcsfiDuteiO绅CSSVSSSmg仙漏血歎迎光峰him二J 至 連知” 歡迎光臨、 CSS語法執行的結果 將CSS語法放在HTML標記語言之內 样式指令Class的用法 使用class样式指令可以使同时套用一个样式指令在不同地方，而不需 要一再定义。 Class的语法包含定义样式指令及执行样式指令两部份： 定义样式指令是在style /style之间设定一个样式指令，其语 法是以句号开头，后接样式名称，再加上一个大括号{ },内含属 性名称与属性值，即可定义样式指令。两个属性间，以分号区隔； 而属性与属性值间，以冒号分开。 执行样式指令时，则在HTML标记内，加上class二样式名称即可 执行样式指令。 例如：原來标题文字ZHTML标记为 h2〉标题文字/h2〉 若想要标题文字变成绿色且改变字型为标楷体，使用class的语法如下： head style .heading {font-family:标楷体u;color:#OOOOFF） /style /hcad h2 class 二 heading〉标题文字 v/h2〉 其中heading为样式名称，font-famlily与color分别是CSS的一项属性，而 标楷体与#00FFFF则是对应之属性值。 歡迎光臨css 歡迎光臨 css語法執行的結果 金血 CSS樣式的定義 style .heading { font - fani ly:標楷？fl ?;Color:#0000f f; font -sice：48*} /$iy]e b?4y/bod7CLASS語法的使用 b?4y /bod7 h2 c]ass?hea4injitti?ty?/h2 一个style /style只能用一个样式设定；如果同时有二个或二个以上 的样式要设定，则需分别使用不同的style /style 這是物理治療學系之網頁 CSS語法執行的結果 CSS話法 分開的CSS樣式的定義 分開的CSS樣式的定義 body 42 cla$s?he4ding*tiS7^SK/h2 /body 样式指令ID的用法 和class指令一样，使用id样式指令可