css初接触
一、简介:CSS 即 级联样式表 。
它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
css是能够真正做到网页表现与内容分离的一种样式设计语言。
相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。CSS能够根据不同使用者的理解能力,简化或者优化写法,针对各类人群,有较强的易读性。
这种分离方式有点像前面的配置文件。都能够提高设计效率。
二、css选择器
1、什么是选择器呢?
每一条css样式定义由两部分组成,形式如下: [code] 选择器{样式} [/code] 在{}之前的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素
2、包含类型及优先级:
ID选择器>类选择器>HTML标签选择器
三、css排版
1、标准流与浮动:
标准流就是标签的排列方式。
页面里显示的顺序和代码里的顺序一致就是符合标准流的
若是给上面的标签加上浮动或定为属性,就可能脱离标准流,此时便可能出现同一行排版多个标签的情况。
2、盒子模型
css盒子模型就像普通的盒子一样具有内容(content)、填充(padding)、边框(border)、边界(margin)四个属性,每个属性又都有上、右、下、左四个部分
3、绝对定位与相对定位
(1)相对定位:没有脱离原来的标准流,相对于原来的位置移动
(2)绝对定位:脱离原来的标准流,绝对于包含此盒子的更外一层盒子移动
4、行列元素与块级元素
行列元素
<span style="font-size:14px;"><span class="menu"> 栏目一</span> </span>
块级元素
<span style="font-size:14px;"><div class="menu"> 栏目一</div> </span>
顾名思义,他们两个的区别就是“行布局”与“块布局”的区别,也因此行列元素对盒子模型的很多属性都是不能使用的的。 而块级元素只能是矩形形状的,所以盒子模型适合于我们的块级元素。
css初接触的更多相关文章
- ExtJS初接触 —— 了解 Ext Core
ExtJS初接触 —— 了解 Ext Core Ext Core是一款和jQuery媲美的轻型JS库,基于MIT许可.对于Dom的操作,我个人还是比较喜欢用jQuery.当然如果项目中用的是ExtJS ...
- ExtJS初接触 - 在项目中使用ExtJS
ExtJS初接触 - 在项目中使用ExtJS 今天ExtJS官网发布了ExtJS最新正式版4.2.1.Ext JS 4.2.1 正式版 下载 ExtJS为开发者在开发富客户的B/S应用中提供丰富的UI ...
- 初接触BurpLoader工具
初接触burp工具 菜鸟一枚,现在在接触一段时间测试,我在测试功能性的时候,想着网站被黑案例那么多,我是不是也应该弄弄安全性测试了,所以就有了下边的第一次接触BurpLoader工具来测试手机的app ...
- 软工实践练习-Git初接触
第一次听到Git,有点不知所云,听了实践课老师的讲解,才明白了Git作为最先进的分布式版本控制系统的重要性. 至于Git的安装和使用仍旧是自己摸索着去完成了,当然在这过程中也是遇到了很多的问题. 接下 ...
- vi初接触
vi初接触 它有三种模式: 一 一般模式 二 编辑模式 三 命令行模式 介绍几种比较常用的吧 -- 退出:q 写入:w 强制:! (以上可叠加) 显示行号:set nu 取消:set nonu 跳转到 ...
- Java之路——Java初接触
本文大纲 1.Java是什么 2.Java历史 3.Java技术范围 3.1 Java SE平台技术范围 3.2 Java EE技术范围 3.3 Java 体系技术范围 4.总结 1.Java是什么 ...
- CSS 初知
CSS 初知 举例 人 { 身高:175cm; 体重:70kg; 肤色:黄色 } 描述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通 ...
- python 之 数据类型初接触
python 之 数据类型初接触 标准数据类型 Python3 中有六个标准的数据类型: Number(数字) String(字符串) List(列表) Tuple(元组) Set(集合) Dicti ...
- Dapr微服务应用开发系列2:Hello World与SDK初接触
题记:上篇介绍了Dapr的环境配置,这次我们来动手尝试一下Dapr应用的开发 Hello World Dapr应用的Hello World其实和其他的Hello World一样简单: 首先用你喜欢的语 ...
随机推荐
- Android 当媒体变更后,通知其他应用重新扫描
在媒体文件改变后 发出 Intent.ACTION_MEDIA_SCANNER_SCAN_FILE广播,告知其他应用,媒体文件发生改变. 具体代码片段: File oldFile = new File ...
- How Tomcat Works(六)
本文继续分析HttpProcessor类,该类实现了org.apache.catalina.Lifecycle接口和java.lang.Runnable接口 我们先分析它的构造函数 /** * The ...
- hdoj 5399 Tpp simple
WA了一下午.... 1WA:T了,因为阶乘没打表所以时间超了.. 2WA,3WA:runtime error,检查的value数组开小了,应该是MAXN.. 4WA.5WA.6WA:改了改对cnt的 ...
- 开源文件比较工具:WinMerge、KDiff3、diffuse
为了寻找免费的BeyondCompare的替代品,最后经过实用,找到如下一些: 1.diffuse 感受:如果仅仅是比较两个文本类的文件,这个软件也就够用了. 安装好后,对着文件点击右键,会出现“Op ...
- Android导入自定义的jar包时出现 E/AndroidRuntime(486): java.lang.NoClassDefFoundError错误
把自定义的jar包放在Android的工程的libs目录下,运行程序,会出现一下错误: 10-10 08:34:06.479: E/dalvikvm(486): Could not find clas ...
- MVC中Model用法
Model:对于MVC来说,Model可不简单只是实体,它应该叫视图模型,这是我自己的理解,即视图中的数据由Model来提供,当视图的数据需要改变时,我们不用打开aspx或ascx文件,只需要修改相应 ...
- vtk点云数据的显示[转]
#include "vtkActor.h" #include "vtkRenderer.h" #include "vtkRenderWindow.h& ...
- 复选框输入Android Studio 如果修改LogCat的颜色,默认全是黑色看着挺不舒服的
今天一直在查找复选框输入之类的问题,上午正好有机会和大家分享一下. 怎么找到并表现LogCat这里就不需要再讲了吧,主要说一下本篇的主题,如何修改他的颜色 .我们在使用Eclipse的时候应该都用过L ...
- BZOJ 1061: [Noi2008]志愿者招募 费用流
1061: [Noi2008]志愿者招募 题目连接: http://www.lydsy.com/JudgeOnline/problem.php?id=1061 Description 申奥成功后,布布 ...
- HDU 4757 Tree 可持久化字典树
Tree Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=4757 Des ...