互聯(lián)網(wǎng)基本原理和html入門第1天筆記最終版本_第1頁
互聯(lián)網(wǎng)基本原理和html入門第1天筆記最終版本_第2頁
互聯(lián)網(wǎng)基本原理和html入門第1天筆記最終版本_第3頁
互聯(lián)網(wǎng)基本原理和html入門第1天筆記最終版本_第4頁
互聯(lián)網(wǎng)基本原理和html入門第1天筆記最終版本_第5頁
免費(fèi)預(yù)覽已結(jié)束，剩余31頁可下載查看

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

一、從“上網(wǎng)”說開 互聯(lián)網(wǎng)的工作原 1.2................................................................................................................................................如何驗證互聯(lián)網(wǎng)的工作原 二、HTML簡 三、和空間的.............................................................................................................................................3.1的..........................................................................................................................................3.2服務(wù) 3.3的解 四、文件的上 五、HTML深入學(xué) HTML的骨 HTML..........................................................................................................................................手冊的使 六、編寫的工 Sublime的安裝和使 NotePad 七、常用（沒有廢棄 標(biāo)題..............................................................................................................................................img...............................................................................................................................................a....................................................................................................................................................八、作 一、從你思考過“上網(wǎng)”么現(xiàn)在先整體去看一下互聯(lián)網(wǎng)工作原理。里面有很多術(shù)語，一會兒講解當(dāng)用戶在瀏覽器中輸入一個按回車的時候，這時候用戶計算機(jī)（客戶機(jī)）就會解析用戶輸入的URL，然后通過Internet向DNS的服務(wù)器進(jìn)行查詢，這個DNS服務(wù)器將用戶輸入的對應(yīng)的IP地址發(fā)回給客戶機(jī)。然后客戶機(jī)會向這個IP地址發(fā)送一個HTTP請求，服務(wù)器得到這個HTTP請求后，會將所有的HTML、CSS、JS、文件等資源用HTTP協(xié)議傳遞給客戶機(jī)?？蛻魴C(jī)上的瀏覽器，1.2URL：uniformresourcelocator資源定界 在互聯(lián)網(wǎng)服務(wù)器上的所有文件（HTML、CSS、JS、、音樂、等）都有唯一的一個URL。只要知道資源的URL，就能夠?qū)Y源進(jìn)行。HTTP：hypertexttransferprotocol超文本傳HTTP是專門用來傳輸超文本文件的HTML：hypertextmarkuplanguage超文本任何一個網(wǎng)頁，不管有多花哨，不管效果有多絢麗。都是HTML。HTML是一個標(biāo)記語言，服務(wù)器：就是一臺 小時全天開機(jī)的，運(yùn)行有服務(wù)器的計算服務(wù)器就是一臺普通計算機(jī)，只不過安裝了一些服務(wù)器（比如Apache客戶機(jī)：就是自己的計算 服務(wù)器：解析系統(tǒng)服務(wù)讓用戶去ip地址太麻煩，所以用去替代IP地址。和IP地址有11對應(yīng)關(guān)系，存放DNS服務(wù)器中用谷歌瀏覽器（Chrome）的一個功能，能夠看見首發(fā)的任何HTTP信息當(dāng)輸入一個的時候，有280個文件被傳輸?shù)降挠嬎銠C(jī)中了。存到哪兒了呢也就是說，所有的你看見的元素，都是先傳輸?shù)奖镜赜嬎銠C(jī)，然后瀏覽器再渲染的上網(wǎng)，就是請求資源開新浪網(wǎng)，我發(fā)現(xiàn)，頁面刷的一下就顯示好了，不用等半天了。、HTTP狀態(tài)碼：200表示成功請求；304表示沒有更改；404表示頁面不存在二、HTML簡HTML(hypertextmarkuplanguage超文本標(biāo)記語言)超：HTML文件中有很多，這些也是文本，但是不顯示在最終的頁面上。所以“超能力HTML很聰明，知道哪些元素是，哪些元素是內(nèi)容；文本：HTML沒有格式，是純文本文件。標(biāo)記語言：它沒有邏輯，沒有與、或、非，不能計算加減乘除，不需要任何數(shù)學(xué)素可以通過下面的方法簡單的制作一個HTML頁面HTML元素構(gòu)成了HTML文件，這些元素是由HTML所定義的。在3天課程中，學(xué)習(xí)告訴瀏覽器文字是什么樣子的尺寸，哪兒需要顯示一張等等。瀏覽器會識別出.html文件“認(rèn)識”將文件的擴(kuò)展名，改成html即可。如果顯示不出來文件的拓展名的話，就在文件夾選項中去設(shè)置右鍵打開方式的html文件。 文件是純文本文件。純文本文件呢？可以從兩個角度去思考這個問如果一個文件中，除了文本，其他什么東西都沒有沒有附加資源比如，比如音樂沒有格式。雖然的記事本將字號更改大了，但是將txt文件傳輸給你之后，你發(fā)現(xiàn)txt文件是不攜帶格式的，所有的字號、加粗、斜體換一臺電腦看，全沒但是比如word生產(chǎn)出來的文件，doc文件是攜帶格式的！也就是說，我用電腦給文字加HTML文件是不攜帶格式的，是純文本文件是一些文字，就不能了，但是再次用記事本打開這個文件后，刪除增加的文字，又能夠觀HTML用純文本來表示格式。非常大的智慧是鼠標(biāo)點擊出來的了。和Photoshop有很大的區(qū)別。HTML是純文本文件，就有以下特點三、和空間的3.1的白菜價。國內(nèi)兩家最大的提供公司：以新網(wǎng)為打開新網(wǎng)首頁，成為會填表即接下來就可以選擇了，不要/r/的，因為需要備案點擊加入購物注意選擇年填寫的信息，瞎寫即可選擇各種途徑去即可。支付買完空間之后，一會兒回來進(jìn)行解析。3.2服務(wù)（一定要、的主機(jī)，否則會讓備案） 會php主將剛剛好的，寫進(jìn)然后進(jìn)行付款即3.3的解首先，先確認(rèn)你的郵箱中，恒創(chuàng)主機(jī)已經(jīng)給你發(fā)了郵件了進(jìn)入管理功能后，選擇功能此時的，已經(jīng)能夠現(xiàn)在，要將自己做好的網(wǎng)頁，傳到服務(wù)器上才能被其他人看見上傳文件的工具是FlashFXP，進(jìn)入之后，按F8快捷鍵?；蛘甙聪聢D所示的方法進(jìn)行點擊查看恒創(chuàng)主機(jī)給你發(fā)的郵件，對照郵件，填寫表買一個和空間非常的方便。有一個空間會極大的提高你自己學(xué)習(xí)做的。上午講解的內(nèi)容的遺漏●Filetransferprotocol文件傳輸協(xié)FTP協(xié)議要比HTTP速度快。那么為什么用戶的時候不使用FTP而是使用http呢？不是面向連接的，而是面向請求的。每請求一次，就產(chǎn)生一次連接，請求完畢，連接也關(guān)閉了●瀏覽器？收發(fā)HTTP請求。用戶輸入一個，能夠?qū)⑦@個變成HTTP請求，發(fā)送出去●index.html文件 的意所有頁面的文件名可以任意指定（最好是英文），有一個文件是比較特殊的文件。index.htmlindex.html文件是在用戶缺省請求的具體頁面的時候，默認(rèn)的 中叫做aa.html，所以就要用：也就是說，現(xiàn)在知道了URL中的斜線的意思，就是文件夾 .cn/c/2013-10-/r/是什么呢？是另外一臺主機(jī)的別 中的c文件夾中的2013-10-18文件夾中的實際問的是五、HTML深入學(xué)HTML其實非常簡單，需要注意的是語義，比如現(xiàn)在需要一個標(biāo)題，那么就要用<h1>。HTML自己擁有很多諸如控制文字樣式、樣式的屬性，但是這些屬性已經(jīng)被CSS技術(shù)給替了HTML的骨今后今后進(jìn)行網(wǎng)頁的制作，都要從這個骨架中進(jìn)，省去了每次都書寫同樣內(nèi)容的<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"">→文 即可，不要背 →寫一些配置的項目，用戶<title>標(biāo)題<body>頁面的正文，用戶可見文檔定義是一定要寫的，在制作的時候，就要用過度版本的HTML，就將這句話寫在每個HTML文件中的第一句。（不用過多的研究是什么意思）一個簡單的字符編碼流行兩種字符編碼：1）utf- utf-8字符全，全球所有國家的所有語言都在這個編碼庫中。文件尺寸太大，一個UTF8的漢字占個字節(jié)gb2312中文庫，在這個編碼庫中沒有日語、語等信息。文件尺寸小，一個gb2312的漢字2個字節(jié)就可以使用gb2312。<metahttp-equiv="content-type"content="text/html;charset=utf-比如新浪網(wǎng) 查看源代碼使用的就是gb2312字符編HTML要注意的事情所有的HTML都是成對出現(xiàn)的情況（少有的單標(biāo)記除外；起始比如<font>，結(jié)束比如</font>，它們都是英文狀態(tài)下的字符。英文狀態(tài)下，并且輸入法是在半角狀態(tài)所有的屬性都要寫在HTML的起始中，初學(xué)者特別喜歡“創(chuàng)造<size=“7>文字</size> <font>文字</font →不正確的寫法，屬性不能寫在結(jié)束中<fontsize=”7”>文字</fontsize=”7”>→不正確的寫法，結(jié)束中，不用寫任何屬性HTML中各個有各個的使命，于是就有各自的屬的不能亂用。一個，必須要有這HTML精妙就精妙在的嵌套。將不同功能的進(jìn)行嵌套，那么就可以完成一些好看的效果在寫頁面的時候，必須規(guī)范！“親自試一試”這個功能也可以快速尋找到一個，如下圖所示在font冊中，看見這句話XHTML是什么？extention拓展的，也就是更嚴(yán)格HTML版本。它限制了很HTML沒有限制的東西，比如必須使用小寫字母；屬性必須加引號（HTML中不加引號也是對的。教學(xué)的時候，就是采用XHTML對大家嚴(yán)格要求。XHTML是一個規(guī)范，拓展名仍然是.html沒有任何區(qū)別。這個規(guī)范是給人定的，而不是給機(jī)的CSS將取代font，在現(xiàn)在工作中，不會再遇見任何的font。而都用css來控制字符六、編寫的工HTML文件是純文本文件，任何純文本編輯器都能夠成為編寫的工具。工具有好有壞，好的工具能夠讓提高工作效率。但是，做絕對不等于用DreamWeaver!!，做，最本質(zhì)的就是寫HTML，記事本能寫，EditPlus能寫，DreamWeaver也能寫。它們都是純文本編輯器，沒有本質(zhì)上的Sublime在安裝好之后，進(jìn)入，會提示的更新版本現(xiàn)在要進(jìn)行設(shè)置，取消這個檢查原來的設(shè)置文件改成今后寫代碼，所有的代碼都和對齊線sublime擁有DreamWeaver沒有的兩個功能：sublime有輕微的智能感應(yīng)sublime中的字符編碼設(shè)置（一定要引起重視NotePad它沒有對齊線、沒有結(jié)束的尋找功能，沒有智能感應(yīng)。就有顏色EditPlus唯一可取的地方，是能夠直接新建html文件。而不用每次都從骨架文件中在項目實戰(zhàn)課上，還將繼續(xù)介紹DreamWeaver，WebStrom做不是用，就可束碼小問小問題：猜測哪種寫法是正確的，能夠讓字母從左往右跑<marquee><left>文字文字<marqueedirection=”left”>文字文字<marqueeleft=”derection”>文字文字只有B項是HTML的行文。現(xiàn)在仍然用的是跑馬燈，所以仍然是marquee，只不過增加了一些修飾，修飾是通過的屬性來完成的。的屬性是一個以k=”v”的形式在起始中進(jìn)行羅列的。所以選B。在今后工作中，marqueefont都不能使用。已經(jīng)被廢棄了，被CSS取代了七、常用（沒有標(biāo)Headings標(biāo)題<h1>一級標(biāo)題<h2>二級標(biāo)題（副標(biāo)題<h3>三級標(biāo)題（欄目標(biāo)題<h4>四級標(biāo)題<h5>五級標(biāo)題<h6>六級標(biāo)題h是有語義的，僅僅能夠給頁面中的真正的標(biāo)題來寫一個h一個頁面中最多只能出現(xiàn)一次h1，最多只能出現(xiàn)一次h2h1表示主標(biāo)題，h2表示副標(biāo)題，就相高舉偉大旗——黨的18大開幕需要注意的是<h1><fontcolor=”red”>標(biāo)題</font></h1><h1>播客<span>網(wǎng)頁平面學(xué)科</span></h1>不行h中，只能是純文字。要不然就別用它這是不對的<h1>所有老師介<h2>平面<h3>PS老師img在網(wǎng)頁中，只能用img。img是英文image()的縮寫。它是一個自封閉。沒有結(jié)束<imgsrc=”文件路徑”不要寫成<imgsrc=”文件路徑”></img>不能讀的格式當(dāng)只有一個width屬性或height屬性時，瀏覽器會自動的將等比例縮小。而不會產(chǎn)生變形。但是當(dāng)兩值都寫的時候，要變形就是以http://開頭的路徑比如新浪網(wǎng)的 相對路徑比如現(xiàn)在html文件和jpg文比如現(xiàn)在html文件和jpg文件在同一個文件夾下那么這個的代碼就要這樣書寫jpgjpg文件在下一層文件比如現(xiàn)在在aa文件夾中，那么這個的代碼就要這樣書寫html.html|_jpg文件在上一層文jpg文件在上一層文件|_ 相對路徑在的時候，一定一定要注意，不要亂移動html文件和的位置！想注意相路徑的使用從今天開始，要樹立一個文件體系的概念！現(xiàn)在文件不能瞎放了。一個你移動位置了，可能就讓一個HTML頁面中的無法顯示了；一個文件你移動位置了，這個頁面中的全部都不能顯面試題：(/r

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論