分别如下:
1--行间样式表(内联样式)
<div style="……"></div>
2--内部样式表
<style>
选择器{属性:属性值}
</style>
3--外部样式表
<link href="style.css" rel="stylesheet“ type=“text/css”/>
1、当我们没有引入外部css样式表的时候,一般情况下我们会在html里写样式,而又两种方式使我们常见的,第一种:
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>time元素</title>
</head>
<body>
<div style="height:300pxwidth:500pxbackground:#999"></div>
</body>
2、第二种写法:
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>time元素</title>
<style>
.all{
height:300px
width:500px
background:#999}
</style>
</head>
<body>
3、建立一个css样式表文件
4、存储在css文件夹中
5、在html文件中写入链接代码,代码如下:
<link rel="stylesheet" type="text/css" href="css/index.css" />
6、之后可以看到HTML文件的源代码傍边看到我们所连接的css文件,此时就连接成功。
html引用css方法如下1、直接在HTML标签中内嵌css样式
2、html中使用style自带式
3、使用@import引用外部CSS文件
4、使用link引用外部CSS文件 推荐此方法
方法说明:
1、直接在html标签元素内嵌入css样式
我是div css测试内容
效果如下图
1.jpg
2、在html头部head部分内style声明插入
代码如下:
<!--
.ceshi {font-size:14pxcolor:#FF0000}/*这里是设置CSS的样式内容*/
-->
我是div css测试内容
效果同上。
3、使用@import引用外部CSS文件方法
HTML代码:
css引用方法实例
<!--
@import url(wcss.css)/*这里是通过@import引用CSS的样式内容*/
-->
我是div css测试内容
Wcss.css文件内代码.ceshi {font-size:14pxcolor:#FF0000}
4、使用link来调用外部的css文件
在head放置
来调用外部的wcss.css文件来实现html引用css文件
此方法就不需要style标签,而是直接通过link一个样式来引用外部样式,一般推荐使用link来引用外部的css样式方法。