【CSS——必备的基础】
2016-08-20 17:24
405 查看
前言:
核心:
一、宏观把握
二、CSS简介
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)
或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
用七个简洁的几句话总结一下:将网页的内容和样式分离
CSS 指层叠样式表 (Cascading Style Sheets)
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一
三、较为重要的点
1.Css选择器优先级:
ID选择器 > 类选择器>HTML标签选择器2.标准流 VS 非标准流
首先理解一下流,提到流,我们想到的是流水,在网页设计中流指的是元素(标签)的排列方式。标准流:元素在网页中就像流水,排在前面的元素(标签)内容前面出现,排在后面的元素(标签)内容后面出现
非标准流:当某个元素(标签)脱离了标准流(比如因为相对定位)排列,我们统称为非标准排列
3. 盒子模型
盒子模型,还没接触之前,真的不知道是什么东西,在牛腩老师把他来比作相框的时候,真的很形象,我可以利用这样相似来记住我们的盒子模型。从里向外:分别是内容、内边距、边框、外边距
元素框的最内部分是实际的内容,直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素
CSS样式:
<span style="font-size:18px;">#category{ /*新闻分类框架*/ width:180px; height :368px; margin-right:5px; margin-bottom:10px;</span>
4. 定位
CSS 有三种基本的定位机制:普通流、浮动和绝对定位
CSS 相对定位
相对定位是一个非常容易掌握的概念。如果对一个元素进行相对定位,它将出现在它所在的位置上。然后,可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动。
CSS 绝对定位
绝对定位使元素的位置与文档流无关,因此不占据空间。这一点与相对定位不同,相对定位实际上被看作普通流定位模型的一部分,因为元素的位置相对于它在普通流中的位置。
CSS 浮动
举例:将框1向右浮动总结:
CSS才刚开始,B/S带我走进了不一样的旅程,后面的学习会继续补充!相关文章推荐
- CSS+DIV——前端er必备基础
- 2016年CSS基础语法汇总-小白必备 很简单哦~
- 学习网站开发必备推荐!30天学会HTML和CSS基础入门视频教程 (免费精品课程)
- 介绍css基础必备的两个使用样式
- 前端制作必备:CSS全局样式基础代码
- http协议基础,学习搜索引擎必备知识
- css的一些基础的东西
- css+div布局总结——基础篇
- css滤镜基础教程
- CSS创建三栏网页布局---CSS基础教程
- CSS基础学习
- css的一些基础的东西
- CSS基础
- CSS基础
- CSS的基础和技巧(2)
- [CSS基础知识]CSS中Class与ID的区别
- shell入门基础必备
- CSS的基础和技巧(1)
- shell入门基础必备
- 网络组建基础必备-网线的制作