學(xué)習(xí)HTML+CSS的一些方法

2023-12-25    分類(lèi)： 網(wǎng)站建設(shè)

現(xiàn)在市面上到處都是各種指南教程，為了顯示這一系列文章的不同，我特意起名為指北系列，不同在哪里?我會(huì)按一個(gè)對(duì)HTML一點(diǎn)概念的人的腦子來(lái)教你一步一步的學(xué)，保證你看完后有收獲。

學(xué)習(xí)之前，請(qǐng)記住偉大的哲學(xué)家兼武術(shù)家李小龍的一句話：清空你的杯子，方能在行注滿(mǎn)。空無(wú)以求全。

推薦參考書(shū)：1，O'reilly.HeadFirst.Html.With.Css.And.Xhtml

2，W3C shcool

3，CSS禪意花園

4，HTML 文檔 CSS文檔

我覺(jué)得如果想入門(mén)的話，上面三本書(shū)就夠了，買(mǎi)其它的書(shū)真浪費(fèi)錢(qián)，還不如好好的看看HTML DOCUMENT ,and CSS document.

第1集 了解HTML and CSS

目標(biāo)：通過(guò)本課，你要做到：知道HTML是做什么的，CSS的作用。

OK，開(kāi)始上課了，借用軟件工程學(xué)里的觀察者模式，我假定任何看此文章的必須是往WEB方面發(fā)展，如果不是向往這方面發(fā)展看這文章我想腦子肯定進(jìn)水了。OK，那首先大至的了解下WEB這個(gè)概念。

WEB百度的解釋如下：網(wǎng)頁(yè)是構(gòu)成網(wǎng)站的基本元素，是承載各種網(wǎng)站應(yīng)用的平臺(tái)。通俗的說(shuō)，您的網(wǎng)站就是由網(wǎng)頁(yè)組成的。

還要了解一下瀏覽器的概念：

瀏覽器：萬(wàn)維網(wǎng)(Web)服務(wù)的客戶(hù)端瀏覽程序。可向萬(wàn)維網(wǎng)(Web)服務(wù)器發(fā)送各種請(qǐng)求，并對(duì)從服務(wù)器發(fā)來(lái)的超文本信息和各種多媒體數(shù)據(jù)格式進(jìn)行解釋、顯示和播放。

可以這樣理解：WEB主要 由客戶(hù)端和服務(wù)器端組成，客戶(hù)端是接收信息的終端，類(lèi)似于我們發(fā)短信的時(shí)候，客戶(hù)端就是收信人，服務(wù)器端是發(fā)信人。當(dāng)然抽象化的省略了防火墻，DNS之類(lèi)的東西，因?yàn)檫@些東西你不需要了解。

所以，你有時(shí)候也聽(tīng)一些書(shū)呆子說(shuō)web的架構(gòu)是B/S架構(gòu)，如果你懂一點(diǎn)點(diǎn)英語(yǔ)，也就知道是(brower,and server)的簡(jiǎn)稱(chēng)，沒(méi)什么意思。

當(dāng)然，上面的東西全是廢話，你看不懂不需要看，學(xué)習(xí)HTML 和CSS，其實(shí)要了解的東西很少很少。

閉上眼睛，想一想，比如你今天想上網(wǎng)看美女圖片，你會(huì)干什么?OK,肯定要打開(kāi)一個(gè)瀏覽器吧，不管是IE還是FIREFOX,所以，你肯定會(huì)自然而然的知道，我們必須借助于瀏覽器才能看到網(wǎng)站上的網(wǎng)頁(yè)，用專(zhuān)業(yè)一點(diǎn)的話可以說(shuō)，瀏覽器是負(fù)責(zé)把HTML CSS JS等傳到客戶(hù)的端的語(yǔ)言按照內(nèi)置的一整套規(guī)則解析成我們?nèi)四芸吹枚膬?nèi)容的一個(gè)工具。

只要你大至懂了瀏覽器的解析規(guī)則，等于說(shuō)你基本讀得懂HTML和CSS 代碼了，好，現(xiàn)在我們來(lái)看看瀏覽器是如何解析的。先從一個(gè)經(jīng)典的HELLOWORLD例子開(kāi)始第一課。

推薦使用的編輯器:notepad++,editplus,dreamware(新手不推薦使用，這些IDE集成工具會(huì)毀了你的，讓你一輩子也不會(huì)寫(xiě)出一行完整的代碼),

<html>?? <head>?? <title>the first example</title>?? </head>?? <body>?? <!----這里寫(xiě)注釋-------->?? <helloword?? </body>?? </html>

ok,保存一下上面的例子成一個(gè).html,或者.htm文件，用瀏覽器瀏覽一下。

通過(guò)上面的例子你會(huì)了解以下知識(shí)：

1，標(biāo)簽一般是成對(duì)出現(xiàn)的，有沒(méi)有不是成對(duì)出現(xiàn)的標(biāo)簽?當(dāng)然有,比如<input type="image" />但單標(biāo)簽一般的在最后面要加一個(gè)斜線，意思是我已經(jīng)關(guān)閉了。

2，HTML由二部分組成，<head><body>他們被最外面的<html>包著，HTML的世界里，有一些內(nèi)容(永遠(yuǎn)要記住，HTML只負(fù)責(zé)WEB的內(nèi)容方面的東西)，基本上只要是內(nèi)容方面的東西，他要么是屬于head,要么是屬于body,如果你以后看到有的東西既可以放到 head里，又可以放在body里，我可以百分百的跟你說(shuō)，那些代碼不是負(fù)責(zé)內(nèi)容方面的東西的，他們要么負(fù)責(zé)樣式方面，要么負(fù)責(zé)一些動(dòng)態(tài)東西，除此之外沒(méi)有其它的東西了。

因?yàn)椋诳蛻?hù)端里面，大至分為三種東西:

HTML:負(fù)責(zé)內(nèi)容

CSS:負(fù)責(zé)樣式

javascript:負(fù)責(zé)動(dòng)態(tài)東西

舉一個(gè)例子你一下子就明白了：

大富翁的虛擬社區(qū)最近興起了房地產(chǎn)，： 阿士伯想蓋一個(gè)和錢(qián)夫人一樣的大大的house(百度一下你就知道，house在西方專(zhuān)指別墅),他想蓋一個(gè)五室三廳四衛(wèi)的House，要有一個(gè)大的花園，一個(gè)停車(chē)庫(kù)，在他的房間里面他將會(huì)買(mǎi)一些家電一些家具，請(qǐng)一些傭人。

這里面，虛擬社區(qū)里把停車(chē)庫(kù)，花園，臥式當(dāng)成了一個(gè)一個(gè)獨(dú)立的東西(這些在WEB里面就被稱(chēng)為HTML元不經(jīng)意)。所以，阿士伯花了一些金幣買(mǎi)了這些道具，但買(mǎi)了之后，在自己的空空的空間里怎么放，這里肯定有一套規(guī)則 吧：有可能這套規(guī)則這樣寫(xiě)：

1，南邊是二個(gè)主臥式

2，車(chē)庫(kù)最后和地下室在一起

3，各個(gè)道具的大小如何設(shè)置

4，各個(gè)道具的間距如何設(shè)置

(這些就被稱(chēng)為CSS樣式)

然后阿士伯購(gòu)買(mǎi)的家電和傭人肯定也根據(jù)自己心中的要求來(lái)選擇吧，可能是這樣的：

1，家電必須要有X-max的效果

2，最好是一整套的智能家居解決方案

3，那個(gè)傭人不但要會(huì)做魚(yú)香肉絲，也必須要會(huì)煮方便面。

本文來(lái)自成都品牌網(wǎng)站建設(shè)網(wǎng)站設(shè)計(jì)公司-創(chuàng)新互聯(lián)

文章名稱(chēng)：學(xué)習(xí)HTML+CSS的一些方法
轉(zhuǎn)載來(lái)源：http://muchs.cn/news43/310343.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信公眾號(hào)、商城網(wǎng)站、網(wǎng)站收錄、小程序開(kāi)發(fā)、關(guān)鍵詞優(yōu)化、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站制作