鹿寨建设局网站,常见的域名注册网站,dm广告设计图片,深圳商城网站建设CSS的作用#xff1a; 页面美化和布局控制。
1.概念#xff1a; Cascading Style Sheets 层叠样式表。 层叠#xff1a;多个样式可以作用在同一个html的元素上#xff0c;同时生效。
2.好处#xff1a; (1).功能强大 (2).将内容展示和样式控制分离 * 降低耦合度#xf…CSS的作用 页面美化和布局控制。
1.概念 Cascading Style Sheets 层叠样式表。 层叠多个样式可以作用在同一个html的元素上同时生效。
2.好处 (1).功能强大 (2).将内容展示和样式控制分离 * 降低耦合度解耦。 * 让分工协作更容易。 * 提高开发效率。
3.CSS的使用CSS与html结合方式。 (1).内联样式 * 在标签内使用style属性指定css代码。 * 如div stylecolor:red;hello css/div (2).内部样式 * 在head标签内定义style标签style标签的标签体内容就是css代码。 * 如 style div{ color:blue; } /style (3).外部样式 1).定义css资源文件。 2).在head标签内定义link标签引入外部的资源文件 * 如 a.css文件 div{ color:green; } 在head标签内用link引入外部资源文件 link relstylesheet hrefcss/a.css 总结 * (1),(2),(3)种方式 css作用范围越来越大。 第(1)种方式作用于单个标签。 第(2)种方式作用于单个页面。 第(3)种方式作用于多个页面哪个页面引入样式就会有相应的效果。 * 第(1)种方式不常用后期常用方式(2)和(3). * 第(3)种格式还可以写为 style import css/a.css; /style 示例
第(1)种内联样式
!DOCTYPE html
html langen
headmeta charsetUTF-8title内联样式/title
/head
body
!--
内联样式* 在标签内使用style属性指定css代码
--div stylecolor:red;hello css/div/body
/html
第(2)种内部样式
!DOCTYPE html
html langen
headmeta charsetUTF-8title内部样式/titlestylediv{color:blue;}/style
/head
body
!--
内部样式* 在head标签内定义style标签style标签的标签体内容就是css代码
--divhello css/divdivhello css/div
/body
/html
第(3)种外部样式
!DOCTYPE html
html langen
headmeta charsetUTF-8title外部样式/title!--第1种引入外部文件的方式--!-- link relstylesheet hrefcss/a.css--!--第2种引入外部文件的方式--styleimport css/a.css;/style
/head
body!--外部样式1. 定义css资源文件。2. 在head标签内定义link标签引入外部的资源文件
--divhello css/divdivhello css/div
/body
/html
