一、如何开始 CSS
在写对应 html 文档的 css 之前首先需要分析一下整个页面的布局，比如说整个页面可以分成几个
部分，头部、尾部，内容部分...各个部分之间的位置有什么关系，各个部分中都有什么样的内容，大概需
要什么样的标签元素来描述这些内容，这些元素在页面上有什么样的表现形式，每个元素与其周围上下
左右的位置关系如何，跟其所在的容器的在表现上有什么样的关系...还有就是整体浏览并分析整个项目中
的页面，这样对优化 css 会很有用，也可以加快整个项目的页面开发，也可以使整个项目在页面风格上的
统一性更好。
二、如何在 HTML 文档中引用 CSS
在 html 文档中引用 css 的方法有三种：
内联，内部，外部；
内联就是在 html 文档中直接在标签的 style 属性中写样式：
<div style=”margin:auto;”>contentcontent contentcontent </div>
内部就是在 html 文档的头部在 style 标签内写样式：
<style>
div{
margin:auto;
};
</style>
外部就是在有一个单独的 css 文件，扩展名就是 css，在 html 文档的头部用 link 标签引入对应的
css 文件，较好的做法就是单独建立一个专门放置 css 文件的文件夹，一般命名为 css 或者 style，
<link rel=stylesheet type="text/css" href="css/index.css" title="cool">
还有一种外部引入 css 文件的方式就是用@import，
<style type="text/css">
@import url(my.css);
</style>
如果用到用 js 来控制用到哪个 css 文件的话就要用到 link 这种方式了：
<link rel="stylesheet" href="/css/styles.css" type="text/css" media="screen" />
<link rel="stylesheet" href="/css/orange.css" type="text/css" media="screen"
title="orange" />
<link rel="alternate stylesheet" href="/css/blue.css" type="text/css" media="screen"
title="blue" />
<link rel="alternate stylesheet" href="/css/pink.css" type="text/css" media="screen"
title="pink" />
因为 link 是 html 元素，可用 javascript 去控制 dom 元素最后达到改变样式的效果。
*最好的做法就是用外部的 css，这样可以统一管理整个项目的 css，更便于日后的维护或者更新
升级等等工作。
三、如何运用正确的选择器
外部文件的 css 控制标签样式的方式有很多种:
*{} /*控制整个文档中的所有的元素*/
p{} /*控制整个文档中的所有 p 元素*/
*.c{} /*控制整个文档中 class 为 c 的元素*/
p.c{} /*控制整个文档中 class 为 c 的 p 元素*/
#main{} /*控制文档中 id 为 main 的那个元素*/
下载后可阅读完整内容，剩余5页未读，立即下载
Seek_you
- 粉丝: 0
- 资源: 7
我的内容管理
展开
最新资源
- WebLogic集群配置与管理实战指南
- AIX5.3上安装Weblogic 9.2详细步骤
- 面向对象编程模拟试题详解与解析
- Flex+FMS2.0中文教程：开发流媒体应用的实践指南
- PID调节深入解析：从入门到精通
- 数字水印技术：保护版权的新防线
- 8位数码管显示24小时制数字电子钟程序设计
- Mhdd免费版详细使用教程：硬盘检测与坏道屏蔽
- 操作系统期末复习指南：进程、线程与系统调用详解
- Cognos8性能优化指南：软件参数与报表设计调优
- Cognos8开发入门：从Transformer到ReportStudio
- Cisco 6509交换机配置全面指南
- C#入门：XML基础教程与实例解析
- Matlab振动分析详解：从单自由度到6自由度模型
- Eclipse JDT中的ASTParser详解与核心类介绍
- Java程序员必备资源网站大全
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
