码迷,mamicode.com
首页 > Web开发 > 详细

css基础概述

时间:2019-11-17 12:21:33      阅读:86      评论:0      收藏:0      [点我收藏+]

标签:height   层叠样   相同   模型   外边距   概述   size   定义   href   

css :cascading Style sheets 层叠样式表

  是用于控制页面布局和样式的

css好处:功能强大,将html页面和样式进行分离

  降低耦合度,开发效率更高

 

css和htnl使用

  1内联样式<div  style = "color="red"></div> //不推荐

  2内部样式 --较为常用

    <style>

        div{

    color:red;

          }

    </style>

    <div><div>

  外部样式

  在head标签定义link属性

    <link rel="stylesheet" href="css/a.css">

  css选择器 语法

       选择器 {

        属性名1:属性值1

        属性名2:属性值2  

      }

    什么是选择器:是筛选具有相同特征的元素

  选择器分类

      基础选择器

        1类选择器

          .类名 {}

        2id选择器

          #选择器名{}

        3元素选择器器

          元素名{}

        4并集选择器

        选择器1,选择器2....{}

    扩展选择器

      选择所有元素

        *{}

      后代选择器

        选择器1 选择器2{}

      子选择器

        选择器1>选择器2{

        }

      属性选择器

        元素名称[属性名=属性值]{}

      伪类选择器

        元素:元素状态 {}

        a:link{}

 

 

    属性:

      字体文本

        font-size

        color:文本

        algin:对齐方式

        line-height 行高

      背景

      background

      边框

        boder

      尺寸

        width 宽度

        height 高度

      盒子模型:

        mangin 外边距

        padding 内边距

         box-sizing: border-box;  设置盒子的属性,让width和height就是最终盒子的大小

        float 浮动

          left 左浮动

          right:右浮动

css基础概述

标签:height   层叠样   相同   模型   外边距   概述   size   定义   href   

原文地址:https://www.cnblogs.com/qmk-716/p/11875600.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!