行间样式表:
head中不需要写内容,在body中列出每一个样式,<div style=" "></div> 样式如下:
<!doctype html>
<html><head><meta charset="utf-8"><title>无标题文档</title></head><body>
<div style="width:100px;height:100px;background-color:red"></div> <div style="width:100px;height:100px;background-color:red"></div> <div style="width:100px;height:100px;background-color:red"></div> <div style="width:100px;height:100px;background-color:red"></div> <div style="width:100px;height:100px;background-color:red"></div> <div style="width:100px;height:100px;background-color:red"></div></body> </html>内部样式表:
只针对当前html文件有效 head中需要写样式,div{ } 在body中写<div></div> 样式如下:
<!doctype html>
<html><head><meta charset="utf-8"><title>无标题文档</title><style> div{ width:100px; height:100px; background-color:aqua } </style></head><body>
<div></div> <div></div> <div></div></body></html>外部样式表:
<link rel ="stylesheet" href="4.css"/> head中写连接,body中写<div>样式如下:
1.先新建css写好样式
@charset "utf-8";
/* CSS Document */div{
width:100px;height:100px;background-color:aqua }2.再写html,连接css
<!doctype html>
<html><head><meta charset="utf-8"><title>无标题文档</title><link rel="stylesheet" href="4.css"/></head><body>
<div></div> <div></div> <div></div></body></html>