嘗試用DIV制作德國國旗
德意志聯邦共和國,簡稱德國,國旗由3種顔色長方形所構成。
我們需要制作出3個長方形來組合成德國國旗,需要用到
标簽。
什麼是div?
可以定義文檔中的分區或節; 标簽可以把文檔分割為獨立的、不同的部分。
我們暫且把 div 看作是一個盒子。
現在我們要做的就是讓浏覽器顯示盒子,并把盒子變成長方形,然後染上黑,紅,金這3種顔色。
試一試在
加上
你會發現無論怎麼重新整理浏覽器,還是一片空白。
這是因為
這個盒子沒有正常完全的顯示,是以需要 兩樣東西:
第一:缺少寬度和高度;我們要在紙上畫出長方形,就必須有長和寬,
也是同理。
第二:缺少邊框或背景顔色;要想讓
這個盒子能被我們看見,通常是給它加個邊框或者背景顔色。
二者缺一不可,為了這兩樣東西,我們需要把 style 添加到
中:
然後重新整理浏覽器,會出現一個黑色長方形:
我們來看一下加入
的html代碼:
style:它定義了
的樣式,也就是說,要讓div變成什麼樣子,就需要style來改變div。style等于号後面的width、height、background都屬于style的屬性。
width:定義div的寬度。
height:定義div的高度。
background:定義div的背景顔色。【 黑色:rgb(0,0,0) 紅色:rgb(255,0,0) 金色:rgb(255,200,0) 】
隻是一行簡單的代碼,我們就已經完成了國旗1/3的制作,那麼依葫蘆畫瓢,你自己寫出剩下兩行代碼吧~
答案:
總結: