虽然说是一天搞定CSS,实际上也没有那么简单。只能说让你快速了解常见的CSS知识,解决基本的页面样式布局和设置。

每个独立的CSS知识点都比较简单,但是它们的应用非常灵活,特别是在综合应用中。

粗略说,大概也就十几个知识点:


1.CSS基本概念,以及分类

http://blog.csdn.net/baidu_37107022/article/details/71249345


2.表框border—粗细,样式,颜色

http://blog.csdn.net/baidu_37107022/article/details/71250059


3.背景background—背景颜色、背景图片以及定位、滚动、重复

http://blog.csdn.net/baidu_37107022/article/details/71250182


4.字体font—颜色、大小、字体类别、行高、粗细

http://blog.csdn.net/baidu_37107022/article/details/71271837


5.盒模型box—content、padding、border、margin

http://blog.csdn.net/baidu_37107022/article/details/71272900


6.文本text–颜色、缩进、单词间距

http://blog.csdn.net/baidu_37107022/article/details/71272560


7.CSS选择器—class、id、标签、群组、包含、通配符

http://blog.csdn.net/baidu_37107022/article/details/71440686


8.CSS选择器优先级–行间>id>class>标签>通配符

http://blog.csdn.net/baidu_37107022/article/details/71440766


9.样式初始化—淘宝样式初始化

http://blog.csdn.net/baidu_37107022/article/details/71440877


10.浮动float–left、right、none

http://blog.csdn.net/baidu_37107022/article/details/71515984


11.清除浮动float—浮动的缺点、浮动与inline-block区别

清除浮动:http://blog.csdn.net/baidu_37107022/article/details/71557806

浮动(float)的副作用:http://blog.csdn.net/baidu_37107022/article/details/71554283

浮动(float)与inline-block的区别:http://blog.csdn.net/baidu_37107022/article/details/71516634


12.overflow—子级溢出父级的问题处理,auto、hidden、visible、scroll

http://blog.csdn.net/baidu_37107022/article/details/71617407


13.两种布局—BFC和Layout

BFC布局与普通文档流布局比较:

http://blog.csdn.net/baidu_37107022/article/details/71634396

支持IE的Layout布局:http://blog.csdn.net/baidu_37107022/article/details/71640304


14.定位position—fixed,relative,absolute,static

http://blog.csdn.net/baidu_37107022/article/details/71642147


15.层级z-index

http://blog.csdn.net/baidu_37107022/article/details/71642885


16.表格table—table、thead、tbody、tfoot、tr、th、td

http://blog.csdn.net/baidu_37107022/article/details/71713281


17.表单form—input、label、textarea

http://blog.csdn.net/baidu_37107022/article/details/71713723

一天搞定CSS---终篇CSS总结的更多相关文章

  1. 手把手教你学Numpy,搞定数据处理——收官篇

    本文始发于个人公众号:TechFlow,原创不易,求个关注 今天是Numpy专题第6篇文章,我们一起来看看Numpy库当中剩余的部分. 数组的持久化 在我们做机器学习模型的研究或者是学习的时候,在完成 ...

  2. 3D 穿梭效果?使用 CSS 轻松搞定

    背景 周末在家习惯性登陆 Apex,准备玩几盘.在登陆加速器的过程中,发现加速器到期了. 我一直用的腾讯网游加速器,然而点击充值按钮,提示最近客户端升级改造,暂不支持充值(这个操作把我震惊了~).只能 ...

  3. sass笔记-1|Sass是如何帮你又快又好地搞定CSS的

    Sass学习笔记持续整理中,开篇不讲怎么安装,sass是什么,这些搜索引擎会告诉你,我们从sass的作用开始讲起,知道sass用来干什么,有什么作用,我们才能相信用sass的好处,并且时时刻刻想着sa ...

  4. DIV CSS 网页兼容全搞定 (IE6 IE7 IE8 IE9 火狐 谷歌)

    CSS兼容常用技巧 请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middl ...

  5. 一天搞定CSS(扩展):CSS Hack

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  6. 一天搞定CSS:初识css--01

    1)CSS:层叠样式表(英文全称:Cascading Style Sheets) 是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. C ...

  7. 全面系统讲解CSS工作应用+面试一步搞定

    [TOC] 一.课程介绍 二.HTML基础强化 html常见元素和理解 html常见元素分类 head区元素:(不会在页面上留下元素) * meta * title * style * link * ...

  8. CSS基础篇之了解CSS和它的基本属性

    CSS是什么? CSS英文全名是Cascading Style Sheets翻译过来就是层叠样式表,它主是把网页表现与内容分离的一种样式设计语言.这种语言能优化我们编程,把东西简化和优化写法,而且不同 ...

  9. 如何搞定前端资源服务跨域问题之nginx篇

    问题描述 1.首先让我们先看一张图 2.从图中,我们可以很清楚的看到当http请求的站点访问https的资源的时候会报出“Cross-Origin”跨域的问题.为什么会出现这样的错误,这是因为涉及到“ ...

随机推荐

  1. vue router-link 上添加点击事件

    在vue学习中遇到给router-link 标签添加事件@click .@mouseover等无效的情况 我想要做的是鼠标移上去出现删除标签,移除标签消失的效果 原代码: <router-lin ...

  2. webapp 1px显示两倍的问题

    公司最近换新首页,按照设计师的要求<大家都在逛>的分割线要1个像素. .span-3{ width:33.3333%; &:not(:first-child){ &:bef ...

  3. Ubuntu搭建mysql,Navicat Premium连接

    保存编辑结果与退出vim编辑器 https://jingyan.baidu.com/article/495ba8410ff14d38b30ede01.html 首先,我们需要使用apt安装mysql, ...

  4. VMware安装CentOS 6.7系统

    VMware安装CentOS 6.7系统 1. 安装前的准备 a) VMware虚拟机软件 b) CentOS 6.7镜像 c) Windows电脑一台 2. 开始安装 a) 打开VMware软件 b ...

  5. 我的开发环境搭建(ubuntu菜鸟)

    前段时间把系统换成了ubuntu,经过一段时间到发展,终于可以比较正常到完成开发工作了,但是就在今天,我的系统崩了,进不了桌面,而且终端里边到中文也显示乱码,尝试了网上说到各种方法无效,最终我决定重装 ...

  6. JAVA 基础之Integer

    jdk1.5后增加了自动拆箱和自动装箱特性.java的八种 byte,short,int,long,float,double,char,boolean基本类型和各自对应的包装类型的相互转化. 装箱指的 ...

  7. TCP协议简介

    1.TCP协议的特点 TCP是面向连接的运输层协议 每一条TCP连接只能有两个端点.TCP只能进行点对点通信 TCP提供可靠交付的服务.通过TCP连接传输的数据,无差错.不丢失.不重复.并且按序到达 ...

  8. 每天一道Java题[3]

    问题 为什么在重写equals()方法的同时,必须重写hashCode()方法? 解答 在<每天一道Java题[2]>中,已经对hashCode()能否判断两个对象是否相等做出了解释.eq ...

  9. swift 可选类型(optional)

    可选类型定义 Swift 标准库中定义后缀  ?为可选类型 Optional<Wrapped> 的语法糖,这里语法糖可以简单理解为一种便捷的书写语法.也就是说,下面两个声明是等价的: va ...

  10. 学生成绩管理C++版

    [标题]学生成绩管理的设计与实现 [开发语言]C++ [主要技术]STL [概要设计]类名:student 类成员:No.Name.Math.Eng.Chn.Cpro.Sum 成员函数:getname ...