最近刚看完CSS入门经典, 结合之前对CSS的了解, 突然有点感想, 特地写下来.
说起CSS,就不得不提起HTML. 众所周知, HTML是一门标记性语言. 何谓标记性语言?简单的来说就是:每一种标记(标签,例如 <p><div><span>)经过浏览器的渲染,呈现出不同的形状. 渐渐地, 内置的形状不能满足人们日益增长的需求, 因此, CSS诞生了, 本质上来说, CSS就是为了让网页更加美观而存在.
CSS是为了美化HTML的. 那么美化前, 我们需要找到要美化的HTML的标签, 怎么找?
CSS提供了一个叫作选择器的东西,它的作用就是选择你要美化的标签. 选择器有4种基本类型: 标签选择器(tag),通用选择器(*), 类选择器(.class)和ID选择器(#id).4种选择器可混合使用. 当然,除了基本类型, 也存在着不基本类型(高级?感觉不算吧,就先这么叫着), 其中包括了: 后台选择器,直接子选择器, 兄弟选择器, 属性选择器, etc.
现在我们知道了怎么找到要美化的标签了.
接下来假如我们用了合适的方法找到了相对应的标签, 那么我们就可以开始进行美化了. 可是美化美化, 到底我们美化的是什么?
答案就是属性,更准确来说,美化就是更改属性对应的值. 我们可以把HTML元素标签看作一个object(或者盒子), 每个object(或者盒子)都有内置属性(OO思想), 而CSS更改的就是这些属性的值从而达到美化的效果. 为什么说盒子呢?如果你了解过CSS,肯定知道盒子模型啦.
而属性又可以细分, 其中包括了 字体属性, 文本属性, 边距属性(就是盒子模型啦), 浮动属性, 列表属性, 背景属性, 定位属性, 表哥属性, etc.
现在我们找到了标签(元素), 也修改了它的属性值, 那么我们如何将它应用到HTML文件呢?
CSS提供了3种方式, 分别是: style属性, style标签 和 link标签导入(级别依次降低.)
CSS无非就这样子工作的, 找到元素 --> 修改其属性值 --> 应用到页面.
这样一说,好像CSS蛮简单的.其实它确实不难. 可能比较难的地方是第二步, 你可以看到上面有那么多属性,而每个属性基本上都有4,5个值, 所以给人的感觉好像很多,挺容易混乱的.但是其实很多属性是一看就懂的. 个人觉得需要花点心思研究的有: 浮动, 定位, 盒子模型的边距折叠.
(PS:纯粹个人感想, 本人前端菜鸟, 如果有什么不对的地方劳烦指明出来,谢谢~)
未完待续...