css基本语法:
css的定义方法是:
选择器{ 属性:值; 属性:值; 属性:值; }
选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性,每个属性有一个或多个值。
如:
div{
width:100px;
height:100px;
color:red
}
css页面引入方法:
(1)外联式:通过link标签,链接到外部样式表到页面
<link rel=”stylesheet” type=”text/css” href=”css/main.css”>
(2)嵌入式:通过style标签,在网页上创建嵌入的样式表
<style type=”text/css”>
div{ width:100px; height:100px; color:red }
......
</style>
(3)内联式:通过标签的style属性,在标签上直接写样式。
<div style=”width:100px; height:100px; color:red ”>......</div>
代码:
main.css:
div{
font-size:20px;
/* 文字默认大小是16px */
color:red;
}
css.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css</title>
<!-- 第一种插入样式的方式:外联式 -->
<link rel="stylesheet" type="text/css" href="css/main.css">
<!-- 第二种插入样式的方式:嵌入式 -->
<style type="text/css">
h1{
font-size: 20px;
color: gold;
}
</style>
</head>
<body>
<h1>页面标题</h1>
<div>这是一个div标签</div>
<!-- 第三种插入样式的方式:内联式或行内式 -->
<a href="https://www.baidu.com" style="font-size: 20px;color:pink">百度</a>
</body>
</html>