一、概述

 
    CSS(cascading style sheet) 层叠样式表
 
    提供比HTML更强大的页面排版、美化工具
 
    CSS将网页内容和显示样式进行分离,提高了显示功能
 
二、CSS与HTML的结合方式
 
    1、style属性方式(行内样式):灵活但麻烦,只适合局部修改
 
    2、style标签方式(内嵌样式):将css样式内嵌到html页面的head里面

优点:统一管理,统一修改,比较方便。

                                  
    3、导入方式:
                <style  type="text/css">

@import url(abc.css); 
                </style>

    4、连接方式:
              <link rel="stylesheet" type="text/css" href="abc.css" />
 
    优先级: 就近原则
 
    代码规范: 选择器名{属性名:属性值;……},多属性值用空格分开
 
三、CSS选择器
    
    1、HTML标签名选择器: 使用的就是html的标签名
                        font {background-color:#FFFF00; color:#FF0000; }
 
    2、class选择器: 使用标签的class属性
                    .p2 {font-size:1cm}
 
    3、id选择器: 使用的是标签的id属性
                 #id1{ font-size:4cm}
  
四、扩展选择器
   
    4、关联选择器:(上下文选择器),用于在一个标签内嵌套另一个标签的样式
                  p font{ font-size:1cm   }
 
    5、组合选择器: 多个不同标签样式相同
                  p,font{background-color:#FF0000; color:#FFFF00;}
 
    6、伪元素选择器: html预先定义好的选择器
                   a:link{ color:red}

a:visited{color:blue}
                   a:hover{color:black}
                   a:active{color:yellow}

 
五、常见操作(属性、值   参考帮助手册)
  
    1、字体设置: font、color、font-size、font-family ……
 
    2、文本设置: text-intent、text-align ……
 
    3、背景设置: background、background-color、background-position ……
 
    4、列表设置: list-style ……
 
    5、盒子模型: border、 margin、padding
                
 
    6、定位设置: position、float、clear、z-index
 
                相对定位:相对于自己本来的位置
                绝对定位:相对应父控件的位置
 
    7、鼠标样式设置:cursor
    
    8、……
    

02---CSS整理的更多相关文章

  1. Python web前端 02 CSS

    Python web前端 02 CSS 一.选择器 1.CSS的几种样式(CSS用来修饰.美化网页的) #建立模板 复制内容--->SETTING---> Editor -----> ...

  2. 02 CSS块级元素和行内元素

    02 CSS块级元素和行内元素 划分依据:根据标签内部可以存放的元素内容不同进行划分,它与CSS样式无关. 要先了解这个 得先了解 什么是容器级别的标签和文本级? 容器级标签 什么是容器级标签? 内部 ...

  3. css整理-02 颜色和字体

    颜色 命名颜色 RGB指定颜色 数值: 0-255 百分比 三元组:红绿蓝 16进制RGB web安全颜色 在256色计算机系统上总能避免抖动的颜色 表示为rgb值20%和51的倍数 web安全色的简 ...

  4. css整理之-----------选择器

    背景 在20年初时总感觉自己的css 不够用,想把css 相关的东西整理下,去年一整年都比较忙,忙着就到2021了,今天趁着有点时间,先从选择器开始吧. 听说图片可以提升颜值.... 选择器 CSS选 ...

  5. css整理之-----------技巧、黑魔法

    css 看起来比较简单,但是要想做的好也不是那么容易,我们在平时开发中,主要用css 来美化我们的html结构,所有我觉得css 还是挺重要的,这里记录整理一些关于css 的技巧以及容易忘记的知识点. ...

  6. css整理-06 表和列表

    表格式化 表布局 table, display:table caption, display: table-caption thead, display: table-header-group tbo ...

  7. css整理-01选择器和继承

    元素 元素形式: 替换,非替换 元素类型: 块级,行内 列表是特殊的块级元素,它会生成一个标记符 样式表 候选样式表: rel='alternative' @import导入样式表,必须在style的 ...

  8. 02 CSS/javaScript

    CSS(Cascading Style Sheets)是层叠样式表用来设置网页的显示效果.可以解决html代码对样式定义的重复,提高了后期样式代码的可维护性,并增强了网页的显示效果功能.简单一句话:C ...

  9. 前端必会css整理

    1.设置css样式的三种方式?         外部样式表,引入一个外部css文件         内部样式表,将css代码放在<head>标签内部         内联样式,将css样式 ...

  10. 高效 css 整理

    避免通用规则 请确保规则不以通用类型作为结束! 不要用标签名或 classes 来限制 ID 规则 如果规则的关键选择器为 ID 选择器,则没有必要为规则增加标签名.因为 ID 是唯一的,增加标签只会 ...

随机推荐

  1. 变量赋值(引用) php内核的实现(二)

    <?php $a=1; $b=&$a; $c=2; $a=&$c; echo $a."\n"; echo $b; 2 1 结论: 首先保存 左值的内存地址, ...

  2. Unity3D如何获取对象和子对象

    在Unity3d中获取游戏对象有三种方法: 一:获取对象 1.通过对象名称获取:objCube=GameObject.Find("Cube"); private var objCu ...

  3. 8款JS框架比较

    Dojo     Dojo 是目前最为强大的JS框架,它在自己的 Wiki 上给自己下了一个定义,Dojo 是一个用 JavaScript 编写的开源的DHTML工具箱.Dojo 很想做一个“大一统” ...

  4. 解决iframe缓存

    网上能搜到很多此类的资料,但都是互相转载,不太起作用.这几天写个用到,用了不少的iframe效果.结果发现iframe有缓存的问题.网上提供了思路,即对iframe的href后添加随即get值,来逃避 ...

  5. PHP Apache Access Log 分析工具 拆分字段成CSV文件并插入Mysql数据库分析

    现在需要分析访问日志,怎么办? 比如分析D:\Servers\Apache2.2\logs\access2014-05-22.log http://my.oschina.net/cart/针对这个问题 ...

  6. GRIB格式转换心得(转自博客:http://windforestwing.blog.163.com/blog/static/19545412007103084743804/)

    1.wgrib的使用 在cmd命令行下键入wgrib后即可察看wgrib相关命令参数,简要介绍如下: l        Inventory/diagnostic–output selections 详 ...

  7. 【开源专访】Sea.js创始人玉伯的前端开发之路

    摘要:玉伯,淘宝前端类库 KISSY.前端模块化开发框架SeaJS.前端基础类库Arale的创始人.本期[开源专访]我们邀请玉伯来为我们分享一些关于前端框架.前端开发的那些事,以及前端大牛是如何炼成的 ...

  8. ViewPager onPageChangeListener总结

    今天在做项目的时候,由于要处理viewPager页面滑动的事件,所以对其进行了一个小小的研究: 首先ViewPager在处理滑动事件的时候要用到OnPageChangeListener OnPageC ...

  9. HDU 5319 Painter

    题意:红色从左上向右下涂,蓝色从右上向左下涂,既涂红色又涂蓝色就变成绿色,问最少涂几下能变成给的图. 解法:模拟一下就好了,注意细节. 代码: #include<stdio.h> #inc ...

  10. BinaryReader和BinaryWriter的leaveOpen参数 z

    在.NET 4.5后,微软为BinaryWriter和BinaryReader类型的构造函数中加入了leaveOpen参数,当该参数为true后,BinaryReader或者BinaryWriter关 ...