html基礎與入門

2022-09-01 16:51:20 字數 2021 閱讀 1496

html就是指乙個html檔案,它是由各種標籤組成的

html分為 < !doctype html > 和 head 和 body

head title+meta+link+style

body 標籤元素+script

標籤元素在js裡叫做節點dom-node,節點,標籤,元素都是他的叫法

最常用的標籤元素當然是 div

其次還有 a,p,span,img,table標籤,表單標籤,按鈕button

table標籤有table,thead,tbody,tr,th,td

表單標籤有form,input(輸入框,密碼框,單選,多選,下拉框,textarea,提交submit)

標籤有屬性和方法的觸發條件

標籤有特有的屬性attr,每個屬性有特定的功能,是html標籤特有的

比如a標籤和link的href,a標籤還有乙個target,script和img的src,表單標籤的value,disabled,單選多選的checked,select的selected 等等等

標籤還可以自定義屬性,就是在標籤裡寫什麼屬性都行,不影響標籤的使用,常用來記錄資料,比如this-id="",data-id="",aa="",bb=""....但是最能被理解的,不會被下乙個維護者罵娘的肯定是data-xx=""

怎麼取得自定義屬性,或者自帶屬性的值在js裡講

標籤還能賦予方法,比如給div的點選條件繫結方法

點選我執行js的say方法

還可以直接寫行內方法

點選我執行alert方法

這個觸發條件是標籤自帶的,給沒有這個觸發條件的標籤新增方法是不會執行的,比如單選,多選,下拉框,檔案選擇框有onchange觸發條件,form有submit觸發條件,輸入框有游標移入移出鍵盤按下觸發條件,但是div沒有,所以給乙個div新增onchange去執行say的時候,say是怎麼都不會執行的

標籤元素分為塊級元素,行內元素

塊級元素就是寬度自動就是佔滿父元素的,而高度是由子元素撐開的,可以通過css改變寬高,跟另乙個元素一起會把自己佔一行,把自己換行,把下乙個擠換行,天生的塊級元素有div,p,以及html5的語義化標籤

行內元素就是一行可以有多個元素的,他們的寬和高都是由子元素撐開的,設定寬高是不生效的,天生的行內元素有span,button,表單標籤,img

而任何乙個標籤元素都是可以用css的display改變,只要記住他們的特點就行

講講標籤的理解

講講a標籤,a標籤是用來跳轉連線的,如果不是就別用;

講講img標籤,img標籤在足夠大的區域裡,會顯示自身的原始大小,只把寬度設定為100%,會佔滿寬度的區域,高度由自身比例改變,也可以只設定高度,讓寬度按比例改變,也可以同時設定寬度和高度,但是會導致變形,所以一般只設定寬度為100%,通過改變img的父標籤的寬度控制img標籤的寬度;

講講一些廢棄的標籤,font,color,time,這些標籤別用,雖然很語義化但是別用,不解釋;

講講form,form是很老的提交資料去到伺服器的方式,現在除了提交檔案根本用不到了,提交from的方式有【在子元素只有乙個輸入框時按下回車鍵,按下form標籤裡的submit標籤或者button標籤】,而且form提交會導致頁面跳轉,當然阻止form跳轉的方式也是有的,阻止form提交會在js的上傳檔案的幾種方式裡講,我想說的是除了檔案上傳之外別用到form,別用form,別用form;

談談input[type=submit]和button,這兩個標籤平時能當按鈕使用,在form標籤裡觸發提交事件,而且這兩個標籤自帶樣式,很醜的樣式,還得手動去去除,所以能別用就別用,用span去代替他們的使用

html其實沒什麼好講的,因為入門只有div

hello word

html 基礎入門

html的基礎知識 1.html語言的遵循的規範 1 乙個html檔案開始標籤和結束標籤 2 html包含兩部分內容 顯示在頁面上的內容都寫在body裡面 3 html的標籤有開始標籤,也要有結束標籤 4 html的 不區分大小寫的 5 有些標籤是沒有結束標籤的 比如 換行 html的操作思想 網頁...

HTML基礎入門

可以使用專業的html編輯器來編輯html 這裡推薦幾款常用的編輯器 notepad 和 sublime text 還可以配合 emmet 外掛程式來提高編碼速度。emmet 官網 head標籤 作用 用於存放 title,meta,base,style,script,link 注意在head標籤中...

HTML 基礎入門

最近學習html5的知識,屬於入門級別。粗略接觸感覺並不是十分枯燥困難,不過據說html都是入門容易深入很難,但願以後不會被難倒吧。html是hypertext markup language 超文字標記語言 的簡寫,他不是一種程式語言,而是一種標記語言,用於告訴瀏覽器如何構造你的頁面。他可以由一系...