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;可以实现垂直居中

元素的层次结构:

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

这盒子还装不下你吗?


注释的写法:

相关文章

  • 2018-09-19 css核心属性

    DAY4:CSS核心属性 学习目标 1、css浮动属性详解 2、css文本属性 3、css列表属性 4、css背景...

  • css DAY 2

    屏幕分辨率的像素 设计师给1920,开发人员要知道兼容所有设备。1366,1440,1920,2k CSS基础 链...

  • 4.0 前端 - 子目录

    0.0 总目录 4.1HTML-day01 4.2HTML-day02 4.3CSS-day03 4.4CSS-d...

  • 4/06day27_css _js

    day27_css _js 回顾 今日内容 CSS样式 JS CSS概述 概述:CSS(Cascading Sty...

  • 2018-03-27 CSS选择器

    Day005,50min 1,实际开发中一般都用“外部样式表”引入CSS; 2,CSS选择器:元素,id,clas...

  • 小白学编程之HTML/CSS Day003

    小白学编程之HTML/CSS Day 003 往期回顾 小白学编程之HTML/CSS Day001小白学编程之HT...

  • day03

    A我学习到了什么? 1温习day02的知识点 2css基本样式的讲解 3css样式的继承:子元素对父元素的继承 B...

  • day09

    A我今天学习到了什么 1温习day08的知识点 1.公共样式的提取 2.css 2d转换(transform) 3...

  • DAY2-初识CSS

    一、什么是CSS 1.css是web标准中的表现标准,用来设置网页上的标签的样式(尺寸、大小、颜色、位置等等)2....

  • CSS选择器的ie浏览器兼容性

    1.CSS1 2.CSS2 3.CSS3

网友评论

    本文标题:css DAY 2

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