html零基础学习-三种样式表

最新推荐文章于 2025-06-04 22:36:18 发布

weixin_30633405

最新推荐文章于 2025-06-04 22:36:18 发布

阅读量115

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yyyangel/p/9797053.html

本文详细介绍了三种CSS样式的使用方法：行间样式表、内部样式表及外部样式表。通过实例展示了如何在HTML中直接应用样式，以及如何通过内部和外部链接引入样式，帮助读者掌握不同场景下的CSS应用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

行间样式表：

head中不需要写内容，在body中列出每一个样式，<div style=" "></div> 样式如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

内部样式表：

只针对当前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>

外部样式表：

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>

转载于:https://www.cnblogs.com/yyyangel/p/9797053.html