美文网首页
01.22 CSS基础

01.22 CSS基础

作者: xxxQinli | 来源:发表于2019-01-22 17:16 被阅读0次

1. 什么是CSS(层叠样式表,简称样式表)

  • CSS是web标准中的表现标准,主要用来设置网页内容的布局和样式

2. 怎么写CSS(语法)

  • a. 语法
    选择器{属性名1:属性值1;属性名2:属性值2...}

  • b. 说明
    选择器 - 选中想要设置样式的标签

  • {} - 固定写法
    属性 - 属性名和属性值用冒号连接,多个属性之间用分号分开(如果没有分号,会导致后面的样式无效)
    属性名必须是CSS给我们提供的属性(大概两百多个)

  • 属性值:表示大小的数值必须加单位,px - 像素,em - 空格数,也可以使用百分比(相对父标签),100%,200%

  • c. 常用属性
    color - 字体颜色
    background-color - 背景颜色
    font-size - 字体
    width - 宽度
    height - 高度

3. CSS写在哪儿

  • a.内联样式表: 将样式表写在标签的style中; 注意,这种样式表不需要写“选择器{}”,直接给属性赋值
  • b.内部样式表: 将样式表写在style标签中(这个标签可以放在head中,也可以放在body中)
  • c.外部样式表: 将样式表写在一个CSS文件中,然后在head中通过link导入
    • link标签 - 导入外部文件
    • rel属性 - 导入的文件的作用,stylesheet - 样式表,icon - 网页图标
    • type属性 - 导入的文件的类型说明,类型/文件后缀,text/css - 导入一个文本文件,文件后缀是css
    • href属性 - 文件路径
      优先级:内联样式表最高,内部和外部谁后写谁的优先级高

4. CSS中的值

  • 颜色:颜色的英文单词,#16进制颜色值,rgba(红, 绿, 蓝, 透明度:0-1)
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>CSS基础</title>
    <link rel="stylesheet" type="text/css" href="css/CSS基础.css">
    <link rel="icon" type="img/ico"href="css/jd_logo.ico">
    <style type="text/css">
      div{
        background-color: green
      }
      p{
        color: blue
      }
    </style>
  </head>
  <body>
  <div style="color: rgba(0,0,255,1); font-size:20px">
    我是div1
  </div>
  <p>我是段落</p>
  <div id="">
    我是div2
  </div>
  </body>
</html>


相关文章

  • 01.22 CSS基础

    1. 什么是CSS(层叠样式表,简称样式表) CSS是web标准中的表现标准,主要用来设置网页内容的布局和样式 2...

  • CSS学习资源

    基础篇 CSS 最核心的几个概念 CSS 简写指南 CSS样式基础 CSS样式设置 CSS布局模型 CSS文字排版...

  • 【2016年特别福利】史上最全CSS学习资料大全

    基础篇 CSS 最核心的几个概念 CSS 简写指南 CSS样式基础 CSS样式设置 CSS布局模型 CSS文字排版...

  • 01.22

    我不是天生的王者,但我骨子里流动着不让我低头的血液。身在山顶的人并不是他本 身有多高,而是所征服山崖 他变高。征服...

  • react学习路线图

    基础 HTML学习 HTML 基础学习 HTML 基础CSS学习 CSS 基础在上一步练习的基础上为页面添加样式使...

  • CSS初识

    CSS基础

  • css大纲

    css 基础 CSS 简介 在 html 中使用 css link 和 @import CSS 选择器 CSS 优...

  • CSS第一小节第一天

    CSS基础入门 什么是CSS? CSS 指层叠样式表 (Cascading Style Sheets) CSS通常...

  • CSS第一天

    CSS 什么是CSS 为什么要学习CSS CSS基础语法 CSS使用方法 CSS选择器 CSS继承和层叠 CSS优...

  • 史上最全的HTML、CSS知识点总结,浅显易懂。适合入门新手,需

    一,html+css基础 1-1 Html和CSS的关系 学习web前端开发基础技术需要掌握:HTML、CSS、J...

网友评论

      本文标题:01.22 CSS基础

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