【CSS】CSS 的使用

行内样式

  • 在标签元素里面编写 style 属性,属性值为 CSS 代码。

<div style="height: 100px; width: 100px; background-color: aqua">div>



内联样式

  • 在 head 标签中创建 style 标签,在 style 标签里面编写 CSS 代码。
  • CSS 代码的注释:/* 注释内容 */
DOCTYPE html>
<html lang="en">
    <head>
        <title>Documenttitle>
        
        <style>
            div {
                height: 100px;
                width: 100px;
                background-color: aqua;
            }
        style>
    head>
    <body>
        <div>div>
    body>
html>



外联样式

  • head 标签中使用 link 标签引入 CSS 文件。
  • rel:是 relationship 的缩写。rel="stylesheet" 表示当前 link 标签引入的是样式表文件。
  • href:指定引入的文件路径。
DOCTYPE html>
<html lang="en">
    <head>
        <title>Documenttitle>
        
        <link rel="stylesheet" href="./index.css" />
    head>
    <body>
        <div>div>
    body>
html>
/* index.css */
div {
    height: 100px;
    width: 100px;
    background-color: aqua;
}



三种写法的权重

行内样式 > 内联样式 > 外联样式 (可以简单地记为 “就近原则”)


你可能感兴趣的:(CSS,笔记,css)