CSS样式详解：内链式、嵌入式与引用式应用-优快云博客

本文链接：https://blog.youkuaiyun.com/wj18740503137/article/details/108856244

关于css样式的基本定义：

第一种：内链式定义；

将要设定的基本属性放在<bady></bady>或其他对应的标签里面进行设置；

基本语法为：style="属性:属性值;"

eg:具体代码表示为：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>css基本样式</title>
	</head>
	<body style="background-color:green" >
		<p style="color:red;">麦子学院</p>
	</body>
</html>

运行结果为：

第二种：嵌入式样表；

在<head></head>里面写嵌入式语法；语法为：<style type="text/css">然后在写一个body{ 属性:属性值; }。

eg:具体代码表示为：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>css样式</title>
  <style type="text/css">
				body{
			background-color:blue;
			color:white;size:7;
		}	
  </style>
	</head>
	<body>
		<h1>麦子学院</h1>
		<p>css基本样式</p>
	</body>
</html>

运行结果如下：

第三种：引用式样式表：

在<head></head>里面写<link rel="stylesheet" type="text/css" href="css/index.css">语法，然后在<body></body>体里面写上内容，最后新建一个.css文件，里面写想要实现的属性body{
属性:属性值;
}

eg:具体代码表示为：

HTML代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>css样式</title>
  <link rel="stylesheet" type="text/css" href="css/index.css">
  </style>
	</head>
	<body>
		<h1>麦子学院</h1>
	</body>
</html>

.css代码如下：

body{
	background-color:blanchedalmond; size: a4;color: blue;
}