網頁是這樣「層」的

2021-06-06 19:00:31 字數 923 閱讀 2559

看過一期「職來職往」,當時達人們給面試者出了這樣一道問題:下面這張

是由幾層構成的。當時的大螢幕是有動畫效果的,立體感比較強。這個問題很簡單,答案是三層,選手可能由於比較緊張,所以答案有出入。學習了div+css這一階段的知識,不禁讓我聯想到了這一期節目,我們所謂的「div」這是跟這位達人的問題切合。

如果想熟悉div和css的布局方法,首先要對盒子模型有足夠的了解,每個html元素都可以看做乙個裝了東西的盒子,盒子裡面的內容到很自的邊框之間的距離也就是填充(padding),盒子本身有的邊框(border),而盒子邊框外和其他盒子之間,還有邊界(margin),這幾個概念應該是盒子模型裡面最基本最本質的概念了,大家看下面的可能會更清晰一些:

1號位置:margin;

2號位置:border;

3號位置:padding;

4號模型:實際填充的內容。

理解了盒子模型的概念之後下面就可以輕鬆的理解層的概念了,我們拿乙個網頁來說明一下:

可以看到這個網頁的結構非常簡單,沒有紛繁絢麗的介面,正好可以拿來說說我們的層的概念。

仍舊以圖來說明

上圖中部分的編號對應著自己是第幾層的。

我們來說說第三層:其實它下面還有一層和二層;當然這個網頁做出來不一定非要一層摞二層摞三層,也可以把網頁整體拆分。

網頁是這樣「層」的

看過一期 職來職往 當時達人們給面試者出了這樣一道問題 下面這張 是由幾層構成的。當時的大螢幕是有動畫效果的,立體感比較強。這個問題很簡單,答案是三層,選手可能由於比較緊張,所以答案有出入。學習了div css這一階段的知識,不禁讓我聯想到了這一期節目,我們所謂的 div 這是跟這位達人的問題切合。...

Google是這樣抓取網頁的?Google幽靈現象

眼下最熱 最重要的乙個話題就是google幽靈現象。一般情況下,把乙個 遞交到網際網路上,在每月固定更新之前,你會發現這個 出現在索引裡。有時,這個 能夠獲得很高的排名,但可怕的 是,幾天或一周以後,這個 會突然消失。這種幽靈現象困擾著網路新手們,同時也給經驗豐富的網路行家出了一道難題。其實,這種現...

北京是這樣的

北京是乙個三十歲沒結婚都不嫌晚的地方 北京是乙個你在馬路上大吼一聲卻無人理睬的地方 北京是乙個被人騙又去騙別人的地方 北京是乙個讓你時刻在受傷卻不得不強裝堅強的地方 北京是乙個靠打工仔打工妹建設起來,卻不讓他們享有社會福利的地方。北京是乙個初次見面第一句問你是 人,第二句問你來北京多久了的地方。北京...