美文网首页
前端开发--从0开始学习CSS之显示属性

前端开发--从0开始学习CSS之显示属性

作者: 银魂飞雪 | 来源:发表于2019-11-20 10:51 被阅读0次

前言

很多做过APP,桌面客户端的同学,虽然对显示的那套东西规则已经很熟悉了,但仍然觉得学习CSS感觉很乱,不知道从哪里入手。今天,我们试着一起自顶向下整理学习CSS思路。

整理思路

先抛开CSS的细节,想想CSS的目的是什么?

和各种APP、桌面客户端的界面API一样,CSS的目的也是为了在 “显示器上显示像素”,考虑到现在的电脑设备,可以加上一个约束“

\color{red}{二维}显示器上显示内容

那么问题就来了?
1、在哪块区域显示?
2、显示什么?

我们以上述两个问题,以初中数学几何为基础进行问题延伸,得到下图。

image.png

相信每个人还能延伸出更多细节问题。

目前为止,我们还没用到任何和CSS有关的知识,接下来,我们就要开始根据上述问题,依次到CSS中去查,于是答案就出来了。

top
left
..
绝对定位
相对定位
...
flex布局
grid布局
...
color
background
...
box-shadow
...
transform
...

一言以蔽之,我们在开始时,尽量采用自顶向下的方法,把学习的主动权掌握在我们手中,让CSS为我们的思路服务,当积累一定的CSS的知识后,再去深入学习。这样可以更快更有效的掌握一门新知识。

相关文章

  • 前端开发--从0开始学习CSS之显示属性

    前言 很多做过APP,桌面客户端的同学,虽然对显示的那套东西规则已经很熟悉了,但仍然觉得学习CSS感觉很乱,不知道...

  • 2018-01-04

    Web学习笔记--从最基础的开始 一、web前端开发语言: HTML、 CSS 、JavaScript HTML:...

  • 前端学习资料

    前端 Html+CSS+JS Web前端开发之HTML+CSS精英课堂【渡一教育】 Web前端开发之JavaScr...

  • css常用属性初解密

    这里学习记录前端css常用属性

  • web前端开发如何入门提高?

    想要成为web前端工程师应该如何开始学习呢?学完HTML以及css之后应该从哪些方面学习呢?入门web前端开发之后...

  • CSS基本布局整理

    前言 css布局是前端开发必须掌握的基本内容,前端学习之css基本布局整理。 基本布局 左右布局 div结构: f...

  • 如何能提高CSS编写技巧 提高Web前端开发效率

    如何能提高CSS编写技巧?怎么学好Web前端开发?很多人在学习Web前端时,刚开始都会学习HTML和CSS,HTM...

  • CSS基本属性的用法

    web前端开发 - 2 CSS基本属性的用法 1、CSS简介 英文全名:cascading style sheet...

  • CSS基本属性的用法

    web前端开发 - 2 CSS基本属性的用法 1、CSS简介 英文全名:cascading style sheet...

  • CSS 的变量

    CSS 变量,又称为 CSS 自定义属性,是前端开发中比较新颖的知识点;但是由于很多前端开发人员专注于使用 UI ...

网友评论

      本文标题:前端开发--从0开始学习CSS之显示属性

      本文链接:https://www.haomeiwen.com/subject/cdwnictx.html