css的三种声明方式
    1、行内样式
        通过每个标签都有的style属性
        <div style="color:red;">黄卫星说没有内容</div>
    2、内联样式
        通过在head里写style标签,style标签里写样式
        <style>
            div {
                color:gold;
            }
            
        </style>
    3、外联样式
        通过link标签来引入css代码
        <link rel="stylesheet" type="text/css" href="1.css" />
    优先级:
        网页加载顺序决定优先级
        就近原则

伪类选择器(要按下面的顺序避免出错)
            a:link {
                color:red;
            }
            a:visited {
                color:pink;
            }
            a:hover {
                color:black;
            }
            a:active {
                color:blue;
            }

属性选择器
            input [ type=text ]

单位
    px            像素
    %            百分比
    em            根据父级元素的尺寸
    rem            根据html的尺寸,例:2rem;就是两个字体的大小;
    vw            窗口宽度的百分比
    vh            窗口高度的百分比

【注】css的优先级对比,权重比精确定位更优先;

文本修饰:
              text-indent        文本缩进;例子: text-indent:2rem;

text-shadow        文本阴影
                                        text-shadow:10px 10px 10px red;
                                              1、水平偏移量    可以为负
                                              2、垂直偏移量    可以为负
                                              3、阴影模糊值    不可以为负
                                              4、阴影部分颜色

text-overflow    文本超出的显示方式
        clip        超出部分截断
        ellipsis    超出时显示...
        【注】    要想让他生效的话需要设置
                overflow:hidden;
                white-space:nowrap;
                还要给元素设置宽度

   line-height        行高   【注意】当行高与元素高度一样时会使文本垂直居中

   vertical-align    对齐方式    经常用于设置图片
        top            顶端对齐
        middle        中间对齐
        bottom        底端对齐

背景
    background-color        背景颜色
    background-image        背景图片  background-image:url(./image/xxxx);
    background-attachment    背景图片是否跟着滚动条滚动
        fixed    相对于窗口固定 (这个功能好像经常看到)
        scroll    随滚动而滚动
    background-repeat        背景图片是否平铺
    background-position        背景图片定位
        left right top bottom 百分比

【注】css的功能真的很强大好用(完)

css层叠样式表的更多相关文章

  1. CSS层叠样式表(Cascading Style sheets)

    CSS层叠样式表(Cascading Style sheets) --------- ---------------- ----------- --------------- ----------- ...

  2. 《精通CSS层叠样式表》

    书名 <精通CSS层叠样式表> 图片 时间 2017-7月 学习 感觉和ps一样对我都不友好 3天撸完

  3. CSS:CSS层叠样式表的概述

    CSS层叠样式表:Cascading Style Sheets 介绍: 现代网页的设计原则是内容和样式分离,降低它们之间的直接相互依存关系,解耦性,同时,同样的内容,可以通过不同的CSS样式表现出来. ...

  4. css:层叠样式表-网页布局基础

    css:层叠样式表:一.写法分类: 1.内联(行内,写在标签里面,以属性的形式表现,属性名是style) 例:<table style="background-color: aqua& ...

  5. 【HTML/XML 7】CSS层叠样式表

    导读:上篇博客说到用XSL去实现XML文档的表现形式的美化,那么另外一种方式就是CSS的使用.本篇博客系统的介绍CSS,下篇博客,将系统的介绍XSL. 一.CSS的发展历史 1996年,层叠样式表(C ...

  6. 实验时css层叠样式表不更新的情况

    自定义了CSS的样式,希望在页面中起作用.因为MVC中Views/Shared/_Layout.cshtml是所有视图的公共文件,如下: <!DOCTYPE html> <html& ...

  7. 前端内容之CSS层叠样式表

    CSS(Cascading Style Sheet层叠样式表) 把HTML认为是网页的骨架 那么CSS就是用于对HTML骨架进行修饰,比如加背景色.显示方式.位置等等属性 CSS语法形式: 一个完整的 ...

  8. CSS层叠样式表的层叠是什么意思(转自知乎)

    转自知乎上的回答:http://www.zhihu.com/question/20077745 解答一: 层叠指的是样式的优先级,当产生冲突时以优先级高的为准.1. 开发者样式>读者样式> ...

  9. css 层叠样式表

    css选择器 派生选择器 根据其元素在其上下文关系来定义样式 <style type="text/css">body{ font-size:12px; color:re ...

随机推荐

  1. JVM高级特性-一、java内存结构区域介绍

    区域划分: java虚拟机在执行程序的过程中,将内存分为功能不同的几个区域,如下图: 此图列出了内存划分的各个区域,其中 线程私有的:程序计数器.虚拟机栈.本地方法栈 线程共享的:堆.方法区 下面,逐 ...

  2. DDD理论学习系列(7)-- 值对象

    DDD理论学习系列--案例及目录 1.引言 提到值对象,我们可能立马就想到值类型和引用类型.而在C#中,值类型的代表是strut和enum,引用类型的代表是class.interface.delega ...

  3. [0] 解决版本冲突-使用SVN主干与分支功能

    解决版本冲突-使用SVN主干与分支功能 1  前言 大多数产品开发存在这样一个生命周期:编码.测试.发布,然后不断重复.通常是这样的开发步骤: 1)    开发人员开发完毕某一版本(如版本A)功能后, ...

  4. Google帝国研究——Google的产业构成

                                                                                        Google帝国研究--Goog ...

  5. CSharpGL(42)借助帧缓存实现渲染到纹理(RenderToTexture)

    CSharpGL(42)借助帧缓存实现渲染到纹理(RenderToTexture) 渲染到纹理(Render To Texture)是实现很多OpenGL高级效果的一个基础.本文记录了如何用CShar ...

  6. zend framework 1 安装教程

    网上的安装教程总是一笔带过,本人结合已经爬过的坑,为大家展示最简单的安装方式: 博主环境如下: 操作系统:win7 64bit 开发环境:lnmp(phpstudy) 注意: zftest:官方下载的 ...

  7. 6.vue如何上传到svn

    node_module是不需要上传的,先删掉,然后用tortoiseSvn的TortoiseSVN Repository Browser,ADD folder,选择工程文件,就行,checkout下来 ...

  8. 第二章(jQuery选择器)

    2.1jQuery选择器是什么 1.CSS选择器 选择器 示例 选择器 示例 标签选择器 a{ } p{ } ul{ } ID选择器 #ID{ } 类选择器 .class{ } 群组选择器 td,p, ...

  9. 处理浏览器兼容 各个浏览器的标识 hack

    Firefox 浏览器 @-moz-document url-prefix() { .selector { property: value; } } 支持所有Gecko内核的浏览器 (包括Firefo ...

  10. 在vs2010中显示代码的行数

    1.打开VS2010,然后"工具" → "选项" 2.在选项页面,点击"文本编辑器"→"所有语言",在显示里将[行号]选 ...