css DAY 2

作者: 杨三毛同志 | 来源:发表于2022-09-08 18:59 被阅读0次

    <table><tr><td bgcolor=skyblue> 屏幕分辨率的像素 设计师给1920,开发人员要知道兼容所有设备。1366,1440,1920,2k</td></tr></table>

    CSS基础

    链接CSS的三种方式

    1. 外部样式 link / @import
      <link rel= "stylesheet", href="index.css">层叠样式表
    2. 行内样式
      <h2 style = "color: red;">行内样式</h2>多用于js
    3. 内部CSS //页面头部样式表 style放头部

    HTML加载顺序

    1. 加载HTML-DOM结构
    2. CSS和JS
    3. 图片和多媒体
    4. 加载事件触发

    CSS规则

    <font color=green size=4>选择器{声明块}</font>

    h1{color: red; text align: center;}

    1. <font size=3> h1:选择器;选中页面上的元素;
    2. color: red; text-align: center;
      声明块,声明属性。对选中元素应用样式。</font>

    100个元素,选择器选择范围(最大值,最小值)(0,99)
    选择器{声明块; 声明1; 声明2; ...声明n; 属性名:属性值;}

    <font color=green>
    选择器:选中HTML页面上的元素

    1. 元素选择器

      1. 格式:元素名( 标签名、标记名){声明块}
      2. h1{ color: deeppink; background-color:skyblue; }
    2. 类选择器

      • 格式

        .类名{声明块}

        类名就是HTML中class属性的属性值
    3. 子(代)元素选择器

      • 格式:父元素名称>子元素名称{ 声明块 }
      • 前提:嵌套。可以嵌套很多层但是只能一层一层选
      • header>div>div>section>div>a{ }
        </font>

    <font color=deeppink>
    代码报错:

    1. 红色 一定出错一般是上一行
    2. 黄色 可能出错
    3. 绿色 正常运行

    </font>


    1. 元素对齐方式:
      text-align: center; //left;right;实现水平居中
    2. 行高:
      line height:100px;可以实现垂直居中

    元素的层次结构:

    • 前提:嵌套
      • 父子关系
      • 兄弟关系
      • 祖先后代关系

    这盒子还装不下你吗?


    注释的写法:

    相关文章

      网友评论

        本文标题:css DAY 2

        本文链接:https://www.haomeiwen.com/subject/kubgnrtx.html