元素分类:

1.行级元素:内联元素  inline

特征:内容决定元素所占位置,不可以通过CSS改变宽高

span  strong   em  a  del

2.块级元素:block特征:独占一行,可以通过CSS改变宽高

div  p  ul  li  ol  form   address

3.行级块元素:inline-block

特征:内容决定大小,可以改变宽高

选择器类型(通用的,没写那些伪类):

父子选择器(派生选择器)

<div>

  <em></em>

    </div>

div em {margin:0px}  有父子关系的几个元素组成的选择器,div下的所有em子孙

直接子元素选择器

div>em { margin:0  }   表示的是div下的直接子元素

并列选择器

<div class='red'></div>

div.red{ color:green }   表示并列关系

权重值比较:<style='color=red'  ...>内联样式,1000

id :100 class:10 标签:1  *:0  ,!important是无穷大权重,但是如果!important+1则要更大

分组选择器

.demo{}    .red{}

!!解决图片间隔  margin-left:-6px

盒子组成部分:

盒子壁  border

内边距 padding

盒子内容 width+weigth

margin+border+padding+content

颜色:

1.纯英文单词    red,green

2.颜色代码       #00ff22

3.颜色函数  rgb(00,ff ,ff)

rgb()表示光的三原色,red, green ,blue

CSS回顾(基础知识,元素,选择器,盒子,颜色)的更多相关文章

  1. HTML&CSS基础-伪元素选择器

    HTML&CSS基础-伪元素选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> ...

  2. CSS样式基础知识

    CSS样式基础知识 CSS样式概述 CSS是Cascading Style Sheet 的缩写.译作“层叠样式表单”.是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 引用位 ...

  3. HTML+CSS+JS基础知识

    HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...

  4. weex中css不能使用子元素选择器

    weex中css不能使用子元素选择器 刚入手可能会有错误,有误导地方请谅解,不过都是亲身踩坑

  5. CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀

    CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 ...

  6. 前端三件套 HTML+CSS+JS基础知识内容笔记

    HTML基础 目录 HTML基础 HTML5标签 doctype 标签 html标签 head标签 meta标签 title标签 body标签 文本和超链接标签 标题标签 段落标签 换行标签 水平标签 ...

  7. css 3d 基础知识

    css3d 总结 3d transform (3D变形)(rotate skew scale translate) 基础知识 perspective (视距,景深) perspective-origi ...

  8. CSS中的伪元素选择器

    定义 伪元素选择器:就是有连续两个冒号的选择器,如::first-line::first- letter.::before 和::after E::first-letter文本的第一个单词或字(如中文 ...

  9. web前端学习(三)css学习笔记部分(1)-- css入门基础知识+基本样式

    1.介绍及语法 1.1CSS概述: CSS指层叠样式表 CSS样式表极大地提高了工作效率 如果值大于一个单词,需要加上引号(意思是值只有一个的时候可以不加引号) 1.2CSS高级语法 1.选择器分组 ...

  10. CSS中模拟父元素选择器

    很多情况下,我们需要找到父元素,但可惜的是css中并没有这样的一个选择器. 至于原因可以看张鑫旭的如何在CSS中实现父选择器效果这篇文章. 简单来说这个实现并不是真正的父元素选择器,只是利用其它思路来 ...

随机推荐

  1. kafka和storm集群的环境安装

    前言 storm和kafka集群安装是没有必然联系的,我将这两个写在一起,是因为他们都是由zookeeper进行管理的,也都依赖于JDK的环境,为了不重复再写一遍配置,所以我将这两个写在一起.若只需一 ...

  2. 知其然而所以然:Operating System 概述和学习图

    大神绕道,鄙人初入 OS . 一.想知OS,先知计算机系统概述 #图解 #基本指令和中断周期 #直接内存存取(Direct Memory Access,DMA) I/O模块对存储器发出读命令或者写命令 ...

  3. Java 类的加载机制

    1.什么是类的加载 类的加载指的是将类的.class文件中的二进制数据读入到内存中,将其放在运行时数据区的方法区内,然后在堆区创建一个java.lang.Class对象,用来封装类在方法区内的数据结构 ...

  4. 【mac】ansible安装及基础使用

    安装 环境释放 mac 10.12.5 #more /System/Library/CoreServices/SystemVersion.plist 安装命令 #ruby -e "$(cur ...

  5. Python循环结构用法

    本文介绍python中的while循环.for循环.在python中for可以用于循环,也可用于另一种近亲的列表解析,列表解析是python中非常重要的特性,详细内容见后面的文章. 一般来说,pyth ...

  6. Guid的生成和数据修整(去除空格和小写字符)

    SqlServer实现 SELECT LOWER(LTRIM(RTRIM(REPLACE(NEWID(),'-','')))) NEWID()函数产生随机数,例如:F874153F-D99B-40A9 ...

  7. 类似aaa?a=1&b=2&c=3&d=4,如何将问号以后的数据变为键值对

    string result = "aaa?a=1&b=2&c=3&d=4"; string[] array = result.Split('?'); //s ...

  8. [转]Nginx 静态资源缓存设置

    本文转自:https://www.w3cschool.cn/nginxsysc/nginxsysc-cache.html 在开发调试web的时候,经常会碰到因浏览器缓存(cache)而经常要去清空缓存 ...

  9. Maven私服 Nexus使用一例

    一.背景 本次搭建Nexus的私服是为了解决两件事 1.公司网络限制,部分项目组同事无法直接访问互联网,不能直接下载一些依赖的jar文件; 2.一些独立的jar无法通过Maven添加依赖的方式引入到项 ...

  10. nginx ssl证书

    server { listen ; server_name xxx.com; root "/home/www/website"; ssl on; ssl_certificate / ...