day44-前端知识之HTML内容
什么是前端?什么是后端?
# 任何與用戶直接打交道的操作界面都可以稱之為前端,前端跟python沒有任何關系 比如:電腦界面,手機界面,平板界面# 暫時先理解成 幕后操作者(不直接與用戶打交道) 為什么要學前端? 因為全棧開發工程師就是同時懂前端和后端 1.信心滿滿 老子一定能學會 憑啥學不會 2.哎呦臥槽 好像有點難 可能學不會 3.我靠 怎么還不畢業 老子要出去掙大錢 4.臥槽 怎么畢業了 我啥都不會 來老男孩學習的心路歷程?
軟件開發架構(c/s, b/s)
Web服務的本質:
# 瀏覽器中敲入網址回車發送了幾件事? 1.瀏覽器朝服務端發送請求; 2.服務端接收請求 3.服務端返回相應的響應 4.瀏覽器接收響應 根據特定的規則渲染頁面展示給用戶看?HTTP協議(*****)
超文本傳輸協議
規定了瀏覽器與服務端之間消息傳輸的數據格式
四大特性:
請求與響應
# 請求數據格式 請求首行(標識HTTP協議版本,當前請求方式) 請求頭(一大堆k,v鍵值對) /r/n 請求體(攜帶的是一些敏感信息比如 密碼,身份證號...)# 響應數據格式 響應首行(標識HTTP協議版本,響應狀態碼) 響應頭(一大堆k,v鍵值對) /r/n 響應體(返回給瀏覽器頁面的數據 通常響應體都是html頁面)# 響應狀態碼 用一串簡單的數字來表示一些復雜的狀態或者提示信息 1XX:服務端已經成功接收了你的數據正在處理 你可以繼續提交額外的數據 2XX:服務端成功響應 你想要的數據(請求成功200) 3XX:重定向(當你在訪問一個需要登錄之后才能訪問的頁面 你會發現窗口會自動調到登錄頁面 301 302) 4XX:請求錯誤(請求資源不存在404,請求不合法不符合內部規定會權限不夠403) 5XX:服務器內部錯誤(500)請求方式
1.get請求
朝服務端要資源(比如瀏覽器窗口輸入www.baidu.com)
2.post請求
朝服務端提交數據(比如用戶登錄 提交用戶名和密碼)
URL:統一資源定位符(大白話 就是網址)
HTML
超文本標記語言
要想讓你的頁面能夠正常被瀏覽器顯示出來 你所寫的頁面 就必須遵循html標記語法
也就意味著所有能夠被瀏覽器顯示出來的頁面 內部都是html代碼
瀏覽器只認識html css js
web本質(瀏覽器 / 服務器)
文件(后綴名是.html結尾的文件,也就意味著 只要看到.html結尾文件 那么它就是一個前端頁面文件)
文件的后綴名僅僅是給人看的 計算機無所謂 因為都是二進制數據
HTML注釋
HTML文檔結構
<html> <head></head>:head內的標簽 不是用來展示給用戶看的 而是定義一些配置 主要是給瀏覽器看的 <body></body>:body內的標簽 就是瀏覽器展示給用戶看的內容 </html> 打開html頁面的兩種方式
1.找到文件路徑 選擇瀏覽器打開
2.pycharm快捷方式直接打開
標簽的分類1:
?
標簽的分類2
1.塊兒級標簽(獨占瀏覽器一行)
div p h
1.塊兒級標簽可以修改長寬
2.塊兒級標簽內部可以嵌套任意的塊級標簽
但是p標簽雖然是塊兒級標簽 但是他不能夠嵌套其他塊兒級標簽 包括自身
可以嵌套行內標簽
總結:
只要是塊兒級標簽 都可以嵌套行內標簽
p標簽只能嵌套行內 其他塊兒級可以嵌套任意的塊兒級標簽
2.行內標簽(自身文本多大就占多大)
span b s i u
div和span通常都是用來構建網頁布局的
body內常用標簽
基本標簽
h標簽:標題標簽
p標簽:段落標簽
符號
常用標簽
div
span
p
img
src存放的是圖片的路徑(該路徑可以是本地的也可以是網上的)
1.也可以放url(會自動請求該url獲取相應數據)
2.也可以直接放圖片的二進制數據 會自動轉換成圖片
alt當圖片加載不出來的時候 顯示的提示信息
title當鼠標懸浮在圖片上 提示的信息
height,width 當你只指定一個參數的時候 另外一個會等比例縮放
a
href后面存放url的時候 點擊跳轉到該url
如果該鏈接沒有被點過 那么默認是藍色,只要點過依次 之后都是紫色
target 默認是_self當前頁面跳轉
_blank新建頁面跳轉
錨點功能(回到頂部)
href還可以寫另一個a標簽的id值,點擊就會跳到id值所對應的a標簽
每一個標簽都應該有三個比較重要的屬性
1.id值 該值就類似于人的身份證號 在用一個html文檔id應該保證唯一不重復
2.class值 該值就類似于面向對象里面的繼承 可以寫多個
3.style(不是必備) 支持在標簽內直接寫css代碼 屬于行內樣式 優先級最高
補充 任何標簽都支持自定義屬性!!!
列表標簽
表格標簽(*****)
?
表單標簽(******)
# 能夠接收用戶輸入(輸入 選擇 上傳)并將其發送給后端 以注冊實例位例講解form表單# action控制數據提交的目的地 1.不寫的情況下 默認提交到當前頁面所在的路徑 2.寫全路徑(https://www.baidu.com) 3.路徑后綴(/index/)# input標簽就類似于是前端變形金剛 type text:普通文本 password:密文 不展示明文 date:日期 submit:觸發提交動作 button:普通按鈕 沒有實際意義 但是可以通過js綁定事件實現自定義動作 reset:重置表單內容 radio:單選 可以通過checked控制默認選擇(當屬性值和屬性名相同的情況下 可以簡寫 checked) checked="checked" checkbox:多選 同上 可以設置默認值 file:獲取用戶上傳的文件# select標簽 默認是單選 可以通過multiple變成多選 如果想默認選擇 用selected (selected="selected")# textarea標簽 獲取用戶輸入的大段文本# form表單默認是get請求 你需要通過method參數 換成post提交 form表單中 要想觸發提交動作 只有兩種情況可以 1.input標簽type指定成submit 2.直接寫button標簽獲取用戶輸入(輸入 選擇 上傳...)的標簽 都必須有一個name屬性 這個name屬性就類似于字典的key,而標簽獲取到的用戶寫入的值就類似于字典的value<input type="text" id="d1" name="username" value="默認值"> name就相當于是字典的key value就是字典的值 獲取都的用戶輸入都會被放入value屬性中form表單傳文件的時候 需要指定enctype參數emmet插件防呆措施?
?
轉載于:https://www.cnblogs.com/Ryan-Yuan/p/11455555.html
總結
以上是生活随笔為你收集整理的day44-前端知识之HTML内容的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 一种基于伪标签半监督学习的小样本调制识别
- 下一篇: Java面试题:IO流中read()方法