设计css样式表,css样式表的概念

北大青鸟设计培训：创建CSS样式表的三种方式？

主要探讨HTML5中CSS（层叠样式表），它是用来对HTML文档外观的表现形式进行排版和格式化。

创新互联公司一直秉承“诚信做人，踏实做事”的原则，不欺瞒客户，是我们最起码的底线！ 以服务为基础，以质量求生存，以技术求发展，成交一个客户多一个朋友！为您提供成都做网站、成都网站设计、成都网页设计、微信平台小程序开发、成都网站开发、成都网站制作、成都软件开发、手机APP定制开发是成都本地专业的网站建设和网站设计公司，等你一起来见证！

使用CSSCSS样式由一条或多条以分号隔开的样式声明组成。

每条声明的样式包含着一个CSS属性和属性值。

pstyle="color:red;font-size:50px;"这是一段文本/p解释：style是行内样式属性。

color是颜色属性，red是颜色属性值；font-size是字体大小属性，50px是字体大小属性值。

三种方式创建CSS样式表有三种方式：1.元素内嵌样式；2.文档内嵌样式；3.外部引入样式。

1.元素内嵌样式pstyle="color:red;font-size:50px;"这是一段文本/p解释：即在当前元素使用style属性的声明方式。

2.文档内嵌样式styletype="text/css"p{color:blue;font-size:40px;}/stylep这是一段文本/p解释：在head元素之间创建style元素，通过选择器的方式调用指定的元素并设置相关CSS。

3.外部引用样式linkrel="stylesheet"type="text/css"href="style.css"//style.css@charset"utf-8";p{color:green;font-size:30px;}解释：很多时候，大量的HTML页面使用了同一个组CSS。

那么就可以将这些CSS样式保存在一个单独的.css文件中，然后通过link元素去引入它即可。

@charset"utf-8"表明设置CSS的字符编码，如果不写默认就是utf-8。

烟台电脑培训认为如果有多个.css文件，可以使用@import导入方式引入.css文件。

只不过，性能不如多个link链接。

怎样创建css样式表？

CSS（层叠样式表）级联样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML

（标准通用标记语言的一个子集）等文件样式的计算机语言。

有三种方法可以在站点网页上使用样式表：

外联式Linking（也叫外部样式）：将网页链接到外部样式表。

嵌入式Embedding（也叫内页样式）：在网页上创建嵌入的样式表。

内联式Inline（也叫行内样式）：应用内嵌样式到各个网页元素。

在Dreamweaver 8中，可以在开始弹出框中点击新建CSS文件。也可以在最上面的菜单栏里占击

文件，新建。在弹出框中选择CSS文件就可以了。

CSS样式表怎么做

在网页中使用CSS：

一、内部规则 - 直接写在网页文件内部的样式

1.将以下代码插入在与之间可设定此页的默认的样式

2.在HTML行中加入样式规则

如：

Amaze your friends!

二、外部规则 - 独立的样式表文件

1.链接样式表文件

方法：在内使用标签：

如：

并建立一个文本文件，起名mystyles.css (和上面对应)。文件内容如：

H1 { color: green; font-family: impact }

P { background: yellow; font-family: courier }

2.输入样式表文件(返回)

方法：在内插入列代码：

并建立一个文本文件，起名company.css (和上面对应)。文件内容如：

H1 { color: green; font-family: impact }

P { background: yellow; font-family: courier }

可见该种方法的好处是可与网页的内部样式共存。

三、CSS举例

指定全文的文本格式：

body{background: yellow;color=red; font-size=9pt}

指定局部的默认的文本格式：

P{...}

H1{...}

TH{...}

TD{...}

...

指定超链接的样式：

A:link {text-decoration: none; color:#0000FF; font-family: 宋体}

A:visited {text-decoration: none; color: #800000; font-family: 宋体}

A:active {text-decoration: none; color: #FF0000; font-family: 宋体}

A:hover {text-decoration: underline; color:#FF0000}

推荐你可以上菜鸟教程官网学习