position
属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。position
属性有以下几种模型:
- static 自然模型
- relative 相对定位模型
- absolute 绝对定位模型
- fixed 固定定位模型
- sticky 磁贴定位模型
在学习布局模型之前,我们先来了解几个属性。
Quick notes
position
属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。position
属性有以下几种模型:
在学习布局模型之前,我们先来了解几个属性。
float
属性可以让元素显示在任意的问题,下面是 float
的几个常用值:
值 | 描述 |
---|---|
left | 左浮动 |
right | 右浮动 |
none | 无浮动 |
inherit | 继承浮动 |
float
属性最初被设计出来,是为了解决图片的排版问题,也就是让文字环绕着图片。
在网页中,元素可以视作可以产生矩形的框,这些框会影响元素之间的距离,元素内容的距离等。盒子模型的概念是将网页视作一个个盒子,每个盒子用来放网页中的各种元素。比如图片,文字等元素,都可以视为盒子,这些盒子可以用更大的盒子 <div>
进行嵌套。将这些盒子进行嵌套,叠加,排列,最后就成为了网页。
list-style-type
用于设定列表项的标记样式,有以下几个常用的值:
ul 值 | 说明 |
---|---|
none | 无标记 |
disc | 默认值,实心圆点 |
circle | 空心的圆点 |
square | 实心的方块 |
ol 值 | 说明 |
---|---|
none | 无标记 |
decimal | 默认,阿拉伯数字 |
lower-roman | 小写罗马数字 |
upper-roman | 大写罗马数字 |
lower-alpha | 小写英文字母 |
upper-alpha | 大写英文字母 |
属性 | 描述 |
---|---|
background-color | 元素的背景颜色 |
background-image | 元素的背景图片 |
background-position | 背景图片的起始位置 |
background-attachment | 背景图片是否固定 |
background-repeat | 背景图片是否重复及如何重复 |
使用 ZipArchive 时,Xcode 报错 Apple Mach-O Linker (ld) Error Group
,错误原因是类库依赖的框架没有添加,添加缺失的框架即可,在这个例子中我添加了 libe.tbd
后解决。
Teaching a man (or women) how to fish:
Usually Mach-O Linker Error means you have not included a header file for a function you are using in your code.
Easiest way is to copy that function or method call and paste into Xcode quick search using shift+command+O. This will search all frameworks (and header files), find that function or method call and show you its location (the header in this case):
In this case, this call belongs to the Accelerate framework so on top of your file, enter
#import <Accelerate/Accelerate.h>
.When doing quick search, you might have to get rid of leading underscore. In other words, search for vImageBoxConvolve_ARGB8888
Hope this helps
网页是由文字、图片、音视频组成,因此网页的文字很大程度影响网页的美观度,CSS 的常用文字样式属性如下:
属性 | 标记 |
---|---|
字体 | font-family |
字号 | font-size |
颜色 | font-color |
字重 | font-weight |
样式 | font-style |
|
|
字体可以通过 <font>
标签设置,但是建议通过 style
标签和属性来设置字体,因为在很多版本中,<font>
标签已被弃用。
HTML 中,标签的层级关系就是树,<html>
是根节点。CSS 继承是指从父元素那继承部分 CSS 属性。
应该类似父类和子类的关系吧,只不过这个类只用来描述 View 的 UI 元素。
比如下面的代码:
|
|
我们没有描述 <span>
的样式,继承
两个字也变成红色,用面向对象来理解,应该是这样的:
|
|
CSS 样式可以通过 <link>
的方式,提供给多个 HTML 文件使用,这其中有很多的 id
、class
的命名,命名的重要性不必多说,那么 CSS 中,怎样的命名才算是规范的呢?有以下几个规则:
-
和 _
命名;-
、_
开头;_
、-
进行连接,或使用小驼峰命名;命名一般使用元素位置所为标记,常用的命名标记有以下几个:
结构 | 标记 |
---|---|
页头 | header |
页尾 | footer |
导航 | nav |
页面主体 | main |
侧栏 | sidebar |
栏目 | column |
内容 | content / container |
容器 | container |
左中右 | left right center |
页面外围控制 | wrapper |