【1.margin-left/margin-right負值】
當元素不存在width屬性或width:auto時,負值margin會增加元素的寬度。
注意:這僅是在元素不存在width屬性或則width屬性預設時。
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>document
title
>
<
style
>
body
.box
.in
style
>
head
>
<
body
>
<
div
class
="box"
>
最外層的寬度為300px
<
div
class
="in"
>
元素設定了margin-left:-50px
如果有寬度設定,margin-left和margin-right為負值時,會發生位移。
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>document
title
>
<
style
>
body
.box
.in
style
>
head
>
<
body
>
<
div
class
="box"
>
最外層的寬度為300px
<
div
class
="in"
>
元素設定了with:200px
【2.margin-top負值】
margin-top為負值時,不會增加寬度,但會讓元素上移。
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>document
title
>
<
style
>
body
.one
.two
style
>
head
>
<
body
>
<
div
class
="one"
>margin-top為-100px--高度為200px
div>
<
div
class
="two"
>高度為20px
【3.margin-bottom負值】
margin-bottom為負值時不會位移,但會減少自身供css讀取的高度。
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>document
title
>
<
style
>
body
.one
.two
style
>
head
>
<
body
>
<
div
class
="one"
>margin-top為-100px--高度為200px
div>
<
div
class
="two"
>高度為20px
下圖為margin-bottom從0到負值的變化圖
[注意]:.one的元素的高度依舊是200px,瀏覽器依舊將整個元素渲染出來
負值之美 負margin在頁面布局中的應用
負數給人總是一種消極 否定 拒絕之感,不過有時利用負margin可以達到奇妙的效果,今天就表一表負值在頁面布局中的應用。這裡說的負值主要指的是負margin。關於負margin的原理建議大家看看這篇文章 本文不講原理,主要展示幾個應用。此例適用於左右欄寬度固定,中間欄寬度自適應的布局。由於網頁的主體...
Unity3d開發之對Public的一些個人說法
在開發專案中,我們經常需要公開類內部的變數讓外部呼叫。c 標準寫法是讓我宣告私有字段然後生成對應的公共屬性供外部呼叫。保證 安全。而我們在開發unity專案時,因為為了省時或者可以在面板賦值,我們經常直接在類內部宣告公開的字段。如下 public int num 1 unity的獨特之處時,在我們編...
第一天之C 對C語言的加強
所謂namespace,是指識別符號的各種可見範圍。c 標準程式庫中的所有識別符號都被定義於乙個名為std的namespace中。在c 中,名稱 name 可以是符號常量 變數 巨集 函式 結構 列舉 類和物件等等。為了避免,在大規模程式的設計中,以及在程式設計師使用各種各樣的c 庫時,這些識別符號...