利用html和css制作簡單網(wǎng)頁（端午快樂）

時(shí)間：2023-07-24 13:36:01 | 來源：網(wǎng)站運(yùn)營

時(shí)間：2023-07-24 13:36:01 來源：網(wǎng)站運(yùn)營

前言

用到的知識(shí)

內(nèi)容區(qū)的大小是由height和width兩個(gè)輔助屬性設(shè)置的
width和height只是設(shè)置盒子內(nèi)容區(qū)的大小，而不是盒子的大小
盒子可見框大小的內(nèi)容區(qū)，由內(nèi)邊距和內(nèi)邊框共同決定
CSS中所有的元素設(shè)置為一個(gè)矩形的盒子
將元素設(shè)置為矩形盒子后，對頁面的布局就變成了將不同盒子擺放到不同位置
每個(gè)盒子都是由以下幾個(gè)部分組成
內(nèi)容區(qū)content
內(nèi)邊距padding
邊框border
外邊距margin

兄弟元素之間的外邊距都是正數(shù)或者都是負(fù)數(shù)就是取兩者絕對值大的值；
如果都是相同的數(shù)值的話，那就是取其中一個(gè)的絕對值。
如果是一正一負(fù)的話，那就是取兩者之和。
比如我們接下來用到的box1 和 box2兄弟選擇器：
.box1{
margin-bottom: 50px;
}
.box2{
margin-top: 50px;
}
兩者的外邊距是50像素，那么最終兩個(gè)盒子模型的間距就是50像素

img標(biāo)簽的src屬性的定義：標(biāo)簽的src屬性是必需的。它的值是圖像文件的URL，也就是引用該圖像的文件的的絕對路徑或相對路徑

form表單中type屬性的值：
text：單行文本框。
value ：定義文本框的默認(rèn)值，也就是文本框內(nèi)的文字。
size：定義文本框的長度，單位是一字符。
maxlength ：設(shè)置文本框最多可以輸入的字符數(shù)。
radio：單選按鈕，name 和 value 是單選按鈕中的必要的兩個(gè)屬性，必須要設(shè)置。并且同一組單選按鈕中各個(gè)選項(xiàng)中的 name 屬性值必須一樣。
checkbox： 多選框，單獨(dú)使用可以表示兩種狀態(tài)之間的切換，寫在標(biāo)簽中的內(nèi)容為checkbox按鈕的介紹。
button：普通按鈕。
value 屬性的取值就是顯示在按鈕上的文字。
submit： 提交按鈕，value 屬性的取值就是顯示在按鈕上的文字，實(shí)現(xiàn)將表單內(nèi)容提交給服務(wù)處理。
rest：重置按鈕，value 屬性的取值就是顯示在按鈕上的文字，單擊可清除用戶在頁面當(dāng)前表單中輸入的信息。
file:文件上傳，當(dāng)使用文件域file 時(shí)，必須在form標(biāo)簽中指明編碼方式。

代碼

運(yùn)行結(jié)果

祝大家端午快樂！