CSS的书写位置

让我为大家介绍一下css的书写位置

1.内部

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>内部</title>
    <!-- 内部位置 -->
    <!-- 这就是内部形式 -->
    <style>
        div {
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body>
    <div>1</div>
    <div>2</div>
    <div>3</div>
</body>
</html>

2.外部

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>外部</title>
    <!-- 这是外部形式,也是开发中最常用的 -->
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <div>1</div>
    <div>2</div>
    <div>3</div>
</body>
</html>

3.行内

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行内</title>
</head>
<body>
    <!-- 行内加style -->
    <div style="width: 200px;height: 200px;">1</div>
</body>
</html>

感谢大家的阅读,如有不对的地方,可以向我提出,感谢大家!

相关推荐
小妖6663 小时前
React input 输入卡顿问题
前端·javascript·react.js
এ慕ོ冬℘゜3 小时前
JavaScript 数据类型检测与转换、运算符超全实战详解
前端·html
kyriewen3 小时前
我用 AI 写代码快了 3 倍——然后同事的 Code Review 全变成了我的
前端·程序员·ai编程
李明卫杭州4 小时前
Vue2 portal-target 组件与 Vue3 的针对性优化
前端·javascript·vue.js
Tyler_15 小时前
iOS PlayWright mcp server
前端·ios·ai编程
嘟嘟07176 小时前
从零理解 MCP:手写一个本地 MCP Server 并接入 LangChain Agent
前端·后端
cocoafei6 小时前
GPT-5.6 后,别再混淆 ChatGPT 和 Codex 额度了
前端·人工智能·chatgpt
你怎么知道我是队长6 小时前
JavaScript的函数介绍
开发语言·前端·javascript
weedsfly6 小时前
观察者模式 vs 发布-订阅模式:从概念到实战,一次讲清楚
前端·javascript·面试
暗不需求6 小时前
手写 AJAX:从 XMLHttpRequest 到封装一个简易 axios
前端·面试