zoukankan      html  css  js  c++  java
  • css基础知识整理

    * CSS简介

      CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体等。

    * CSS代码语法

      1.CSS样式由选择符(选择器)和声明组成,而声明又由属性和值组成,如:选择器{声明;声明2} 当有多条声明时,中间用英文分号”;”分隔。

      2.CSS的样式

        ①写在标签的style属性中:<p style=“font-size: 30px”>字体大小用px表示</p>

        ②写在style标签中(style标签一般写在head标签与title标签之间):

          <style type="text/css">

            p{

              color: blue;

            }

          </style>

        ③引入外部CSS文件:

          <link rel="stylesheet" type="text/css" href="style.css">

      3.选择器的分类

        ①标签选择器:如上p

        ②类选择器:.class属性值{..}

        ③ID选择器:#id属性值{..}

        

      4.CSS中也有注释语句:用/*注释语句*/标明。

    * css样式语法:

      CSS样式基本语法:

      CSS样式语法遵循如下格式:

        Selector {

          Property1:value1;

          Property2:value2;

          ……

        }

      其中selector为CSS选择器,决定该样式对哪些元素起作用

      大括号中的内容为属性定义,决定该样式起什么样的作用(字体、颜色、布局等)

    <!-- css:cascading style sheets(层叠样式表)

      * 语法:选择器{声明;声明2}

      * 选择器

        标签选择器:p|h2

        类选择器:

          定义:.类名{}

          调用:class="类名"

        ID选择器:

          定义:#ID名{}

          调用:id="ID名"

      * 颜色值

        * red|green|blue

        * #ff0000 = #f00 = red 取值范围:0-ff

        * rgb(255,0,0) 取值范围:0-255

      * css嵌入方式

        * 行内

          style属性

          eg:style="color:blue"

        * 内部

          style标签

          eg:

            <style type="text/css">

              p{color:red}

            </style>

        * 外部

          定义:xxx.css文件

          使用:<link href="demo.css" rel="stylesheet">

        * 优先级:就近原则

          行内>内部>外部

    -->

    * CSS的四种使用方式:

      CSS(Cascading style sheets)层叠样式表定义如何显示HTML元素。实现方式:

        行内样式:

          在元素内部使用style属性

          例如: <div style="color: red; margin-left: 20px"></div>

        内部样式:

          HTML<head>元素中使用<style>元素定义

          例如:<style type="text/css"> body {background-color: red}</style>

        链接外部样式文件:

          HTML<head>元素中使用<link>元素链接外部CSS样式

          例如: <link rel="stylesheet" type="text/css" href="style.css">

        导入外部样式文件

          与链接外部样式文件效果一致,语法有差异,尽量避免使用这种方式

          例如<style type =“text/css” >@import “style.css”</style>

    * CSS中的颜色

      CSS中的颜色用RGB颜色:红色(red)、绿色(green)、蓝色(blue)——光学三原色表示。

      RGB中每种颜色都用两位十六进制数表示,0表示没有光,F表示最强的光,并按红、绿、蓝的顺序排列,前面再加上#号。

      例如:#000000黑色;#FFFFFF 白色;#FF0000红色;

      #00FF00绿色;#0000FF蓝色等等。

     

  • 相关阅读:
    Fluent 18.0新功能之:其他
    【小白的CFD之旅】小结及预告
    【小白的CFD之旅】19 来自计算网格的困惑
    【小白的CFD之旅】18 控制方程基础
    【小白的CFD之旅】23 串行与并行
    【小白的CFD之旅】22 好网格与坏网格
    JS ES6的变量的结构赋值
    JS中some()和every()和join()和concat()和pop(),push(),shift(),unshfit()和map()和filter()
    JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性)
    javascript中this的指向问题
  • 原文地址:https://www.cnblogs.com/leeho/p/14210452.html
Copyright © 2011-2022 走看看