Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
大家在瀏覽網頁的時候,是否思考過這樣一個問題:怎樣才能制作出一個網頁呢?制作出一個網頁是很簡單的,只要知道什么是HTML并掌握HTML的基礎知識就可以制作出一個簡單的網頁,今天我就為講解HTML的入門及結構組成。
一、什么是HTML?
1、在我們開始學習HTML之前我們需要知道什么是HTML?
HTML的全稱為Hyper Text Markup Language,中文名稱為超文本標記語言,閱覽方式為網頁瀏覽器,同時HTML也被稱為網頁。
2、一個簡單的HTML文檔
二、HTML編輯器
我們在可以使用TXT文本文檔或者專業的HTML編輯器來編輯HTML。
1、記事本
① 創建一個TXT文本
② 輸入HTML代碼
③ 點擊文件—另存為—輸入名稱+“html”的后綴名即可得到你的第一個HTML文件。
④ 然后雙擊這個文件運行。
運行結果
2、專業編輯器
① Sublime Text
② HBuilder
③ Adobe Dreamweaver
④ CoffeeCup HTML Editor
這其中我比較推薦HBuilder這款編輯器,界面簡單,編輯起來很快。
三、HTML的組成部分
在上面的案例中我們可以看到HTML是由頭部(head)和身體(body)所組成的。
1、頭部(head)
通常包含標題(title),也就是一個網頁的名稱
網頁標題
2、身體(body)
body的部分是整個網頁的重要內容部分,讓人一眼就瀏覽到這個網頁的內容,可以插入文本、圖片、多媒體等內容。
四、HTML元素
l HTML元素是指以開始標簽起始,以結束標簽終止的元素:元素內容即為開始標簽與結束標簽之間的內容。
l <head></head>、<body></body>、<p></p>、<h1></h2>等這些都是HTML元素,在上面的案例中就有六個元素。
l 也有部分元素只有開始標簽,例如<br>,以開始標簽的結束而結束。
五、HTML的屬性
l 一般來說HTML的屬性就是HTML元素的屬性,屬性可以在元素中添加附加信息。
l 屬性總是以名稱/值對的形式出現,比如:name=”value”。
l 屬性一般描述于開始標簽。
l style中會有更多的屬性。
六、HTML格式化
HTML可定義很多供格式化輸出的元素,比如粗體字和斜體字。
HTML文本格式化標簽
標簽 | 描述 |
<b> | 定義粗體文本 |
<em> | 定義著重文字 |
<i> | 定義斜體字 |
<small> | 定義小號字 |
<strong> | 定義加重語氣 |
<sub> | 定義下標字 |
<sup> | 定義上標字 |
<ins> | 定義插入字 |
<del> | 定義刪除字 |
運行結果示意圖
HTML“計算機輸出”標簽
標簽 | 描述 |
<code> | 定義計算機代碼 |
<kdd> | 定義鍵盤碼 |
<samp> | 定義計算機代碼樣本 |
<var> | 定義變量 |
<pre> | 定義預格式文本 |
HTML引文、引用及標簽定義
標簽 | 描述 |
<abbr> | 定義縮寫 |
<address> | 定義地址 |
<bdo> | 定義文字方向 |
<blockquote> | 定義長的引用 |
<q> | 定義短的引用語 |
<cite> | 定義引用、引證 |
<dfn> | 定義一個定義項目 |
七、HTML超鏈接
超鏈接可以是圖片、文字、多媒體也可以是一個網址
示例:
結果:
點擊帶有下劃線的兩個字就可以進入某度的網站
八、HTML CSS
1、CSS是一種層疊樣式表,可以修飾html元素的樣式并可以精確地進行排版
2、CSS有三種方式:
l 內部樣式,在HTML元素中使用“style”屬性
l 內部樣式表,在頭部<head>區域使用<style>元素來包含CSS
l 外部引用,引用帶有后綴css的文件,示例:
html文檔
css文檔
如果你看到了這里,就說明你已經打開了制作網頁的大門啦~
多不從事前端工作的人,可能都不知道web前端是什么,也不知道什么是HTML,對于H5更是一頭霧水。其實web前端是呈現給用戶的視覺和基本操作,主要負責頁面的展示,就是我們在頁面看到的內容。那么什么是HTML呢,什么又是H5呢?
Web前端使用用技術涉及用html語言,CSS,JavaScrip,那么如何理解html語言?
HTML語言,是一種描述性語言,全名“HyperTextMarkupLanguage(超文本標記語言)”,我們所使用的頁面就是用html語言語言制作的。
H5是HTML5的簡稱,就是“HTML”的第5個版本,也就是第5個版本的“描述網頁的標準語言”。
相比其他語言來說,html語言是一名相對比較容易入門的語言。很多新手在網上看到HTML5,會覺的迷惑,到底是先學HTML5還是html語言,其實html語言是從HTML4.01升級到HTML5的,但是并不是html語言被淘汰了,準確來說,學習html語言其實就等于HTML4.01加上HTML5。
云和數據前端與移動開發的課程內容可以概括為”專、深、新",知識由基礎的技術點循序漸進層層深入,并結合市場最新技術,將HTML5、CSS3、Viewport、rem、Bootstrap主流適配方案融入其中,同時全面覆蓋響應式布局、Bootstrap、AngularJS等當前互聯網開發的最新技術,以真實項目貫徹課程始終,使學員能跟上最新技術的腳步,成為具有前后端開發能力的中高級開發者。
以上就是小編今天為大家分享的關于“什么是HTML,什么是H5”的文章,希望本篇文章能夠幫到你。
T之家(www.ithome.com):關于編程里的那些ABC......
本文主要是一篇基礎類整理文章,按照26個字母的排序,整理出一些在編程上比較重要的工具、框架、語言等等。
A- Angular.JS如果被設計用來構建Web應用程序的話,那就和HTML沒什么區別了。它是一款開源JavaScript函式庫,由Google和它的社區來維護,用來協助單一頁面應用程式運行的。它的目標是透過MVC模式(Model-View-Controller)功能增強基于瀏覽器的應用,使開發和測試變得更容易。函式庫讀取包含附加自定義(標簽屬性)的HTML,遵從這些自定義屬性中的指令,并將頁面中的輸入或輸出與由JavaScript變量表示的模型綁定起來。這些JavaScript變量的值可以手工設置,或者從靜態或動態JSON資源中獲取。
Angular.JS是建立在這樣的信念上的:即聲明式編程應該用于構建用戶界面以及編寫軟件構建,而指令式編程非常適合來表示業務邏輯。Angular.JS最引人注目的特征就是它的雙向數據綁定功能,這樣可以大大減少你在必要代碼上的編寫數量,Coder Factory最先向澳大利亞提供Angular.JS課程。
B- Booststrap是一個用于響應式前端開發的框架,最主要是應用在移動Web App上面。它由Twitter的設計師Mark Otto和Jacob Thornton合作開發,是一個CSS/HTML框架。Bootstrap提供了優雅的HTML和CSS規范,它即是由動態CSS語言Less寫成。Bootstrap一經推出后頗受歡迎,一直是GitHub上的熱門開源項目,包括NASA的MSNBC(微軟全國廣播公司)的Breaking News都使用了該項目。
Bootstrap是基于jQuery框架開發的,它在jQuery框架的基礎上進行了更為個性化和人性化的完善,形成一套自己獨有的網站風格,并兼容大部分jQuery插件。
C- CSS是Cascading Style Sheet的縮寫,中文名稱是層疊樣式表,又稱串樣式列表、層次結構式樣式表文件,一種用來為結構化文檔(如HTML文檔或XML應用)添加樣式(字體、間距和顏色等)的計算機語言,由W3C定義和維護。目前最新版本是CSS2.1,為W3C的推薦標準。CSS3現在已被大部分現代瀏覽器支持,而下一版的CSS4仍在開發過程中。
CSS最重要的目標是將文件的內容與它的顯示分隔開來。在CSS出現前,幾乎所有的HTML文件內都包含文件顯示的信息,比如字體的顏色、背景應該是怎樣的、如何排列、邊緣、連線等等都必須一一在HTML文件內列出,有時重復列出。CSS使作者可以將這些信息中的大部分隔離出來,簡化HTML文件,這些信息被放在一個輔助的,用CSS語言寫的文件中。HTML文件中只包含結構和內容的信息,CSS文件中只包含樣式的信息。
D- DRY是Don't repeat yourself的簡稱,一個規則,實現一次(one rule, one place)是面向對象編程中的基本原則,程序員的行事準則。旨在軟件開發中,減少重復的信息。
DRY的原則是──系統中的每一部分,都必須有一個單一的、明確的、權威的代表──指的是(由人編寫而非機器生成的)代碼和測試所構成的系統,必須能夠表達所應表達的內容,但是不能含有任何重復代碼。當DRY原則被成功應用時,一個系統中任何單個元素的修改都不需要與其邏輯無關的其他元素發生改變。此外,與之邏輯上相關的其他元素的變化均為可預見的、均勻的,并如此保持同步。違反DRY原則的解決方案通常被稱為WET,指代“Write everything twice”。
E- Elegant每一個代碼都應該是優雅、簡潔的。其實編寫程序的過程就像是一種藝術,也許有些人會問你:“如果可以編寫有效代碼的話,為什么還要編寫優雅代碼呢?”然而,我們認為提供優雅代碼的標準首先這個目的就是比較好的,因為它會帶領程序員編寫出更加簡明的、可維護的代碼。
你應該永遠記住:讀代碼比寫代碼更重要。我猜你不想讓你的同事花整個周末的時間來搞懂你的代碼到底是什么意思吧!所以多花一點時間讓代碼更漂亮!
F- Flash是由Adobe開發出來的用于創建動畫視頻、圖形和互聯網應用程序的。就像你剛從一個粗略的網站上看到的一部電影一樣,都是通過Adobe Flash播放器播放的。盡管有很指責說Flash很耗資源且不安全,但是絕大多數網站上一直在使用它。
或許你已經聽說了Steve Jobs拒絕將Flash用在蘋果設備上,如果真的有所說的那樣的缺點,或許只是Steve Jobs和Flash之間的個人恩怨,那樣我們可能永遠不會發現Flash的偉大之處。即使HTML5被預測為Flash的即將繼承者,但是Flash仍然值得我們多看它幾眼。
G- GitHub是每一位編碼人員的最好的朋友。擁有超過1150萬個倉庫的GitHub是這個世界上最大的代碼托管網站。GitHub包含社交網絡功能允許開發人員將他們的項目整合到一起,這樣一來的話就能在對開源軟件以及私人項目的維護產生重大意義。
GitHub提供免費和付費計劃,只需選擇你所需要的東西。有趣的是:GitHub是建立在Ruby on Rails基礎上的,Coder Factory可以教你框架。
H- Hydra code是一段不能修復的代碼,就像古希臘怪物每個脖子上都生出兩個頭,最后都被Hercules砍掉了。代碼有的時候就像這個一樣,即使你修復了一個bug之后,又會出現很多個bug,所以,除了重寫整個代碼以外,你別無選擇。
I - Graphic User Interface圖形用戶界面,這是一種自我解釋。圖形用戶界面估計是你看到最多的也是互動最多的一部分。第一個GUI是在Stanford Research Institute發明的,后繼開發是由Xerox PARC施行的。在參觀完Xerox之后,Steve Jobs首次將GUI技術用在了Apple Lisa和Macintosh上面,在當時來說這是一次革命創舉。
Bill Gates發布Windows GUI之后,看看下面這段有趣的對話,Steve:“你偷了我們的技術!”Bill回應:“我想我們兩個都有一個叫做Xerox的非常富有的鄰居,但是當我跑到他的房間里想要偷走電視機的時候,我發現你已經把電視機偷走了。”哈哈哈
J - Javascript是一個動態的編程語言(尤其是在客戶端),可以讓你在不用刷新網頁的情況下更新網頁內容。雖然Angular.js是一個相當不錯的框架,但它是建立在JavaScript這個基礎之上的。
JavaScript最先是由Netscape開發的,用來對抗和Microsoft進行的瀏覽器之戰。現在的Javascript已經出現在高級App開發課程里面了。
K - Donald Knuth是一個很有趣的IT專家,它也是我們很喜歡的書《The Art of Computer Programming》的作家。現在他是Stanford University的名譽教授,也是公認的“算法分析之父”。
L- Libraries代碼類庫是實現行為的一個收集,這里面有一個接口用來調用行為。估計這么說的話聽起來還是比較復雜的。基本上可以這么理解:通過類庫這種方式將這些代碼組織起來,這樣就可以被很多沒有什么關系的程序調用了。于是,用戶只需要知道類庫的界面就行了,而不是內部的邏輯結構。
M- MongoDB是一種文件導向數據庫管理系統,由C++撰寫而成,以此來解決應用程序開發社區中的大量現實問題。2007年10月,MongoDB由10gen團隊所發展。
MongoDB可以從開放源代碼來建構與安裝,更常見的是安裝binary文件,目前有Windows,Linux,OS X和Solaris版本。許多Linux套件管理系統現在已包含了MongoDB的套件,包括CentOS和Fedora,Debian和Ubuntu。MongoDB已經被一些重要的網站所采納了,例如Ebay,Craigslist甚至是New York Times。
N- Nopping是一個用于區分輸出的編輯器,來源于NOP(no-operation),這是編程行業里的行話——小睡一下。每個人時不時的都需要休息一下,現在就NOP一下吧!
O- Object面向對象的編程是一個范例,代表這一概念所描述的對象的屬性和方法改變。對象通常是類的實例,設計應用程序已達到彼此交互設計的目的。許多主要的編程語言如C++、Java、Ruby和PHP都是面向對象的。
P - Push推動基礎的交流來描述一個互動請求,這首先是出版商發起的,例如這些需求都是來自服務器而不是來自客戶端的推送。
Q- Quality代碼質量是一個廣義上的術語,每個程序員都有自己的不一樣的定義。我們通常比較樂于將代碼質量描述為易讀的、可測試的、靈活的、依賴關系小、順從的,還有就是經濟的。這一原則被稱為LTFCE。
R- Ruby on Rails是一個使用Ruby語言寫的開源Web應用框架,嚴格按照MVC結構開發的。在2005年左右由David Heinemeier-Hansson開發出來的。它努力使自身保持簡單,來使實際的應用開發時的代碼更少,使用最少的配置。Rails的設計原則包括“不做重復的事”(Don't Repeat Yourself)和“慣例優于設置”(Convention Over Configuration)。
Ruby on Rails是一種結合Ruby語言與Rails平臺的一種網頁編程語言,Ruby語言以自然、簡潔、快速著稱,全面支持面向對象程序設計,而Rails則是Ruby廣泛應用方式之一,在Rails平臺上設計出一套獨特的MVC開發架構,采取模型(Model)、外觀(View)、控制器(Controller)分離的開發方式,不但減少了開發中的問題,更簡化了許多繁復的動作。
S- Scaffolding框架是一個技術,用在MVC框架上,例如Ruby on Rails。通過Scaffolding基架,開發者可以詳細說明一個數據庫到底是怎么運作的。允許你生成代碼,例如使用非常簡化的方法來讀取、創建或刪除數據庫條目。Scaffolding基架基于數據庫架構生成網頁模板的過程。在ASP .NET中,動態數據使用基架來簡化基于Web的UI的生成過程。用戶可以通過這種UI來查看和更新數據庫。
T- Alan Mathison Turing(又譯阿蘭·圖靈,1912年6月23日-1954年6月7日),被認為是計算機科學的保護神,但是,他是一個永遠也得不到公正宣布的圣人。他是英國數學家、邏輯學家,他被視為計算機科學之父。
圖靈對于人工智能的發展有諸多貢獻,例如圖靈曾寫過一篇名為《機器會思考嗎?》(Can Machines Think?)的論文,其中提出了一種用于判定機器是否具有智能的試驗方法,即圖靈測試。至今,每年都有試驗的比賽。此外,圖靈提出的著名的圖靈機模型為現代計算機的邏輯工作方式奠定了基礎。
U- Usability可用性測試是一個很有存在意義的任務,在你的App出現在眾人面前之前必須要經過可用性測試。你的代碼也許很優雅、質量很高、不會重復,但是要是它的可用性不過關的話,那么一切都是扯淡。你想讓你的App盡可能的用戶友好型的,那么用戶是不會讓你的產品埋沒的。
一個最常見的技術測試就是A/B testing,這種方法就是用兩種不同的介紹方式將產品介紹給不同的用戶,并且監視結果。效果最好的那個才會被采納。
V - for View對于外觀、模型、控制器來說,它們就是實現用戶界面的樣品。這里面的核心部件就是Model,其包括App數據,商業邏輯規則和產品功能。View是實際產出,也是你的用戶在瀏覽器里最想看到的。Controller接收輸入并將其轉換成命令傳送給Model或者是View。
W- W3C是World Wide Web Consortium的縮寫,是Web上主要的國際標準組織,由互聯網的發明者Tim-Berners Lee創建并由其領導,W3C是World Wide Web的監護者。
X- Experience很多人都認為他們能學習代碼并能做得很好,就像Mark Zuckerberg一樣。事實是:作為一個開發者,根本沒有停下來學習的時候。科技技術改變的速度很快、很迅速,也就是說,在你的整個職業生涯里你必須抓住機會不斷學習新的知識。
Y - Yoda Yoda條件是一個編程術語,用來編寫一個表達的兩個部分,而這個表達是一個典型條件語句順序的顛倒表達方式,就像“learn to code you should, young padawan”。
Z- Konrad Zuse當然,在這個綜合性的列表上,我們沒辦法將Konrad Zuse排除在外。他是一位德國科學家,創造出了第一臺可編程的計算機——Turing-complete Z3。在第二次世界大戰之后,IBM選擇了它的專利,這也是他的工作第一次被德國以外的國家所認可。
本文主要是根據26個字母的排序來整理了在編程方面比較重要的知識點供你參考。如果有什么好的建議可以在下面的評論出寫出來。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。