零基础学代码笔记【第一周】

这是我学代码的笔记，如果有什么不对的请指出谢谢ww

---

                                                                                                                            师傅：西南白

---

网页基本骨架

---

引入css

(放在head里)【也可放在body里】

---

使用汉字

(放在head里)【还有gbk、gb2312等】

---

图片

加入图片：

或background: url("图片地址");

页面宽充满一张：background-size:cover;【以中心为主铺满 div 但是不一定把图片内容全显示出来】

原尺寸：max-width:100%;

固定取图片中间一部分：background-position:50% 50%;（数字为参照）

---

浮动和清除浮动

例：

float:left

clear:left/clear:both

---

clearfix清除浮动

.clearfix:before, .clearfix:after {

content:" ";

display:table;

}

.clearfix:after {

clear:both;

}

.clearfix {

zoom:1;

}

---

任意摆放元素

position:absolute;（以整个页面为参照）

position:relative;(以其它元素为参照，加在被参照元素里)

一般配合top、left等

---

如果加padding导致超过宽被挤到下一行

* {

box-sizing:border-box；

}

---

块变圆

border-radius:50%;（数字为参考）

---

加阴影

box-shadow:0 5px 5px rgba(0,0,0,0.1);(数字为参考)

---

取消下划线

text-decoration:none;

---

不随网页下滑/固定

position:fixed;

---

居中

margin:0 auto;

或position:fixed;（一般配合top、left、margin-left等）

---

字体

常见宋体，数字为大小参照:

font: 14px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;（参考其他网站）

居中：

text-align:center;

常见字粗：

font-weight:normal;

---