add: CSS 基础回顾
This commit is contained in:
@@ -15,9 +15,9 @@
|
||||
html中的单位只有一种,那就是像素px,所以单位是可以省略的,但是在CSS中不一样。
|
||||
<font color="#0000FF">**CSS中的单位是必须要写的**,因为它没有默认单位。</font>
|
||||
|
||||
- **绝对单位:**
|
||||
### 绝对单位
|
||||
|
||||
1 `in`=2.54`cm`=25.4`mm`=72`pt`=6`pc`。
|
||||
1 `in`=2.54`cm`=25.4`mm`=72`pt`=6`pc`。
|
||||
|
||||
各种单位的含义:
|
||||
|
||||
@@ -27,7 +27,8 @@ html中的单位只有一种,那就是像素px,所以单位是可以省略
|
||||
- `pt`:点Points,或者叫英镑 (1点 = 1/72英寸)
|
||||
- `pc`:皮卡Picas (1 皮卡 = 12 点)
|
||||
|
||||
- **相对单位:**
|
||||
### 相对单位
|
||||
|
||||
`px`:像素
|
||||
`em`:印刷单位相当于12个点
|
||||
`%`:百分比,相对周围的文字的大小
|
||||
@@ -40,6 +41,10 @@ html中的单位只有一种,那就是像素px,所以单位是可以省略
|
||||
|
||||
## 字体属性
|
||||
|
||||
CSS中,有很多**非布局样式**(与布局无关),包括:字体、行高、颜色、大小、背景、边框、滚动、换行、装饰性属性(粗体、斜体、下划线)等。
|
||||
|
||||
这一段,我们先来讲一下字体属性。
|
||||
|
||||
### 行高
|
||||
|
||||
CSS中,所有的行,都有行高。盒子模型的padding,绝对不是直接作用在文字上的,而是作用在“行”上的。
|
||||
@@ -56,7 +61,6 @@ CSS中,所有的行,都有行高。盒子模型的padding,绝对不是直
|
||||
|
||||
为了严格保证字在行里面居中,我们的工程师有一个约定: **行高、字号,一般都是偶数**。这样可以保证,它们的差一定偶数,就能够被2整除。
|
||||
|
||||
|
||||
### 如何让单行文本垂直居中
|
||||
|
||||
小技巧:如果一段文本只有一行,如果此时设置**行高 = 盒子高**,就可以保证单行文本垂直居中。这个很好理解。
|
||||
@@ -206,7 +210,6 @@ CSS样式中,常见的文本属性有以下几种:
|
||||
|
||||

|
||||
|
||||
|
||||
## 列表属性
|
||||
|
||||
```html
|
||||
@@ -230,8 +233,6 @@ ul li{
|
||||
|
||||

|
||||
|
||||
|
||||
|
||||
## overflow属性:超出范围的内容要怎么处理
|
||||
|
||||
`overflow`属性的属性值可以是:
|
||||
@@ -295,12 +296,7 @@ ul li{
|
||||
|
||||

|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 鼠标的属性cursor
|
||||
## 鼠标的属性 cursor
|
||||
|
||||
鼠标的属性`cursor`有以下几个属性值:
|
||||
|
||||
@@ -372,7 +368,6 @@ p:hover{
|
||||
|
||||
爆料一下,表示博主有两年多的平面设计经验,我做设计的时间其实比写代码的时间要长,嘿嘿···
|
||||
|
||||
|
||||
## 导航栏的制作(本段内容请忽略)
|
||||
|
||||
现在,我们利用float浮动属性来把无序列表做成一个简单的导航栏吧,效果如下:
|
||||
@@ -435,8 +430,6 @@ p:hover{
|
||||
|
||||
国庆这四天,连续写了四天的博客,白天和黑夜,从未停歇,只交替没交换,为的就是这每日一发。以后会不断更新的。
|
||||
|
||||
|
||||
|
||||
## 我的公众号
|
||||
|
||||
想学习<font color=#0000ff>**代码之外的技能**</font>?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。
|
||||
@@ -446,4 +439,3 @@ p:hover{
|
||||

|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user