HTML之基础篇--陈小沫
生活随笔
收集整理的這篇文章主要介紹了
HTML之基础篇--陈小沫
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
前端認知
一、公司開發(fā)流程
1、 產(chǎn)品需求(產(chǎn)品經(jīng)理給需求文檔)
2、項目設計(視覺設計師給PSD文件，交互設計師配合)
3、前端開發(fā)
4、后端開發(fā)
5、測試
6、上線運營
二、前端開發(fā)的核心語言
HTML 超文本標記語言 （負責頁面結構）
CSS 層疊樣式表 （負責頁面樣式）
JS 腳本語言 （負責頁面行為）
HTML的基本結構
<!DOCTYPE html> /*文檔頭聲明*/ <html lang="en"> /*HTML中的根元素*/ <head> /*head標簽內(nèi)部的內(nèi)容絕大部分是不可見的*/<meta charset="UTF-8"> /*定義html頁面的元數(shù)據(jù)，meta中的charset屬性，針對搜索引擎和解析格式的屬性*/<title>Document</title> /*定義文檔的標題，在頁面中可見 */ </head> <body>/*主要書寫頁面中的內(nèi)容*/ </body> </html>- HTML中的單標簽
<br> <hr> <meta> <img> <input..> <option.> <link> HTML中基本標簽
- <div></div>雙標簽
- <h1>—– <h6>雙標簽 一級標題至六級標題
- <p></p>雙標簽 段落標簽
- <strong>雙標簽 用于強調(diào)文本 表示重要的文本
- <span> 雙標簽 用來組合文檔中的行內(nèi)元素
- <pre> 雙標簽 文字的格式按源碼的排版來顯示，我們稱之為預處理格式
- <a>雙標簽 –> 它有一個必不可少的屬性 href
■ target屬性
■ _self (在原來頁面打開)
■ _blank (新窗口打開)
■ _top (打開是忽略所有的框架)
■ _parent (在父窗口中打開) 創(chuàng)建錨點和錨鏈接
■ 錨點也是一種超鏈接，是頁面內(nèi)進行跳轉的超鏈接第一步：創(chuàng)建錨點 <a name="錨點鏈接"></a>
第二步 : 使用創(chuàng)建好的錨點名稱 <a href="#錨點名稱">內(nèi)容</a>- marquee 標簽 可以創(chuàng)建一個滾動效果
img標簽的用法
- img圖片標簽與路徑
- 常用的圖片格式 jpg png gif
- gif (只支持全透明的)
- Jpeg / jpg
- png(半透明/全透明都支持)
- 圖片四要素
- src=" " 圖片路徑
- alt=" " 圖片含義
- width=" " 圖片寬度 盡量與圖片大小保持一致
- height=" " 圖片高度 盡量與圖片大小保持一致
- 圖片標簽的寫法
- <img src=" " alt=" " width=" " height=" " />
- 關于路徑的小知識
- 相對路徑：（Relative Path）相對于該文件的路徑;
- 絕對路徑：（Absolute Path）從磁盤出發(fā)的路徑;
- / 開頭表示根目錄
- ./ 表示當前目錄；
- ../ 上級目錄
- 直接用文件名不帶 / 也表示同一目錄
關于列表的用法
- Number1
- <ul> 無序列表
- 無序列表顧名思義就是一個沒有順序項目的列表，此列表項默認粗體圓點
- Number2
- <ol> 有序列表
- 有序列表也是一列項目，只是列表項目使用的是數(shù)字進行標記.
- 列表嵌套
- 無序列表–嵌套
- 無序列表–嵌套
- Number3
- dl 定義列表
- 定義列表不僅僅是一列項目，而是項目及其注釋的組合。定義列表 <dl> 標簽開始。每個定義列表項以 <dt>開始。每個自定義列表項的定義以 <dd>開始
- <dt> 與 <dd>都必須放在<dl>標簽內(nèi)部之間使用
- dd是對dt的解釋
- <dl>是用來創(chuàng)建一個普通列表
- <dt>是用來創(chuàng)建列表中的上層項目
- <dd>用來創(chuàng)建列表中最下層的項目
表單
- 表單標簽
- <form> 表單標簽
- <form> 表單是一個包含表單元素的區(qū)域，包含起來的都是表單的內(nèi)容
- <form> 表單標簽
關于<input>標簽
- <input type=" " name= " " value=" " />
- type="text" 單行文本輸入框
- type="password" 密碼 （maxlength=" " ）
- type="radio" 單項選擇（checked="checked"）
- type="checkbox"多項選擇
- type="button" 按鈕
- type="submit" 提交 type="image" 圖片提交
- type="file" 上傳文件
- type="reset" 重置
- type="hidden"隱藏
textarea 沒有默認值
- <label>標簽的使用
- <label></label> 標簽的 for屬性應當與相關元素的id屬性相同
- 舉個例子
- <textarea> 文本標簽
- <textarea></textarea> 標簽，可以在其中插入一段文字內(nèi)容，它有兩個經(jīng)常使用的屬性 rows 和 cols
- rows 表示這個文本域有多少行
- cols 表示這個文本域有多少列
- <select> 標簽的掌握
- 舉個例子
■ border-cellspacing 屬性 用來設置是否將表格的邊框折疊為單一邊框
■ colspan 左右合并
■ rowspan 上下合并
結束語
很多時候，我們不缺方法，缺的是一往無前的決心和魄力。不要在事情開始的時候畏首畏尾，
不要在事情進行的時候瞻前顧后，唯有如此，一切才皆有可能。
總結
以上是生活随笔為你收集整理的HTML之基础篇--陈小沫的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
