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 一区二区三区在线视频播放,日本中文字幕免费,亚洲国产高清精品线久久 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務(wù)商
          
				
          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
          
			
          
			
          				
				
          免費(fèi)咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          notepad++已成往事，文本編輯器選這些
          
        
           
          
	
	
          
		
                        
          于npp作者的一系列無腦言論，使得作為一個(gè)極易上手、使用簡便的文本編輯器的npp現(xiàn)在也是越來越不受待見。那么，我們今天就來扒一扒，除了npp，還有哪些同樣簡單便捷、啟動(dòng)快、易上手的文本編輯器。
          第五名——SciTE
          SciTE，一個(gè)支持Windows和Linux平臺使用的開源的文本編輯器，開始時(shí)只是為了演示Scintilla強(qiáng)大功能而開發(fā)的。此后它成為一個(gè)功能全面的編輯器，windows下安裝包不到2M。你可以通過用戶自定義的配置文件來擴(kuò)展默認(rèn)功能。
          一方面，這個(gè)軟件入門簡單。基本文本編輯器的功能它都具備：多格式（HTML、RTF、PDF、XML）文件導(dǎo)出，文本搜索替換、幾十種語法高亮顯示等。
          另一方面，這個(gè)軟件配置復(fù)雜。因?yàn)樗J(rèn)情況下很多功能還沒有展現(xiàn)，需要我們手動(dòng)設(shè)置，而這個(gè)設(shè)置過程也相當(dāng)復(fù)雜，如果沒有正確的配置，他就會(huì)出現(xiàn)很多問題，比如選擇中文時(shí)候出現(xiàn)亂碼，縮進(jìn)格式出錯(cuò)等等。
          考慮到它的配置復(fù)雜且默認(rèn)是英文菜單界面，所以，把它排名第五。推薦喜歡極簡風(fēng)的朋友使用或極客朋友挖掘、自定義配置使用。
          第四名——NotePad 3
          Notepad 3是一個(gè)快速、基于Scintilla的輕量級文本編輯器，同樣支持語法高亮等文本編輯器普遍具備的基礎(chǔ)功能，這點(diǎn)不用多說。值得一提的是，Notepad3安裝后會(huì)直接替代記事本，也就是你每次創(chuàng)建或新打開.txt文本文檔都會(huì)默認(rèn)使用Notepad 3, 想想人家當(dāng)初的主要目標(biāo)也是替換掉 Windows 自帶記事本。Notepad 3在windows下的安裝包僅3M，且默認(rèn)中文菜單界面，所以無論是作為常用文本編輯器，還是作為windows記事本來使用，都是比較推薦的。
          第三名——Ultra Edit
          UE作為一款老牌、流行的文本編輯器，默認(rèn)安裝后支持中文界面。不僅支持搜索替換、代碼高亮等文本編輯功能，還支持ASCII/ANSI files編碼的腳本。可以在對應(yīng)的語法文件下進(jìn)行函數(shù)和類的跳轉(zhuǎn)，是不是有點(diǎn)智能IDE的意思了，還支持宏錄制等一下進(jìn)階玩法。但是，這個(gè)軟件并不是開源軟件，30天的試用期后需要付費(fèi)使用，安裝包大概90M左右。
          第二名——Sublime Text 3
          在作者認(rèn)為Sublime Text 3 和 UE，如果僅從功能上來看，作者認(rèn)為兩者各有千秋，不分伯仲，但是從安裝包體積、用戶使用界面，以及擴(kuò)展包源豐富性而言，作者更傾向于ST3，ST3的編輯界面更加好看些。ST3支持快捷鍵豐富，進(jìn)行工程編輯時(shí)，可以通過命令來快速進(jìn)行文件跳轉(zhuǎn)、類跳轉(zhuǎn)、行跳轉(zhuǎn)，猶如使用idea進(jìn)行代碼跟進(jìn)一樣。Sublime安裝后默認(rèn)為英文界面，可以通過安裝插件包修改為中文界面，目前是作者使用較為頻繁的一個(gè)編輯器。
          第一名——VS code
          世界上最好的文本編輯器——VS code！
          VS code排第一，相信大家無可爭議，絕對的No.1，嚴(yán)格來說，把VS code僅僅定位為一個(gè)文本編輯器，實(shí)在是殺雞用牛刀，大材小用了。但是就僅僅討論文本編輯功能來說，VS code也是十分跟手，代碼跳轉(zhuǎn)、代碼片段運(yùn)行、文本搜索替換等都是入門標(biāo)配，且是大廠出品，UI美觀性更不必說，VS code除了本身功能全面、便捷外，還有一個(gè)更讓人們依賴的是它豐富的插件庫，你幾乎可以找到工作中處理代碼和文本所需要的所有插件，配合插件后，vscode簡直如絲般潤滑。
          其實(shí)，文本編輯器本身核心功能差不多都一樣，至于選擇哪款，還是取決于你是追求小巧便捷，還是功能豐富；是喜歡開箱即用，還是手動(dòng)定制（比如宏開發(fā)）。
          希望，上面推薦的幾款編輯器，能夠滿足大家工作需求。
          工具，順手即可~
          者：Lucida
          原文鏈接：http://lucida.me/blog/sublime-text-complete-guide
          # 摘要（Abstract）
          本文系統(tǒng)全面的介紹了 Sublime Text，旨在成為最優(yōu)秀的 Sublime Text 中文教程。
          # 更新記錄
          1.2014/09/27：完成初稿
          2.2014/09/28：
          更正打開控制臺的快捷鍵為 Ctrl + `
          更正全局替換的快捷鍵為 Ctrl + Alt + Enter
          3.2016/09/15：作者已全面轉(zhuǎn)向 Visual Studio Code
          # 前言（Prologue）
          Sublime Text 是一款跨平臺代碼編輯器（Code Editor），從最初的 Sublime Text 1.0，到現(xiàn)在的 Sublime Text 3.0，Sublime Text 從一個(gè)不知名的編輯器演變到現(xiàn)在幾乎是各平臺首選的 GUI 編輯器。而這樣優(yōu)秀的編輯器卻沒有一個(gè)靠譜的中文教程，所以我試圖通過本文彌補(bǔ)這個(gè)缺陷。
          # 編輯器的選擇（Editor Choices）
          從初學(xué)編程到現(xiàn)在，我用過的編輯器有 EditPlus、UltraEdit、Notepad++、Vim、TextMate 和 Sublime Text，如果讓我從中推薦，我會(huì)毫不猶豫的推薦 Vim 和 Sublime Text，原因有下面幾點(diǎn)：
          1.跨平臺：Vim 和 Sublime Text 均為跨平臺編輯器（在 Linux、OS X 和 Windows 下均可使用）。作為一個(gè)程序員，切換系統(tǒng)是常有的事情，為了減少重復(fù)學(xué)習(xí)，使用一個(gè)跨平臺的編輯器是很有必要的。
          2.可擴(kuò)展：Vim 和 Sublime Text 都是可擴(kuò)展的（Extensible），并包含大量實(shí)用插件，我們可以通過安裝自己領(lǐng)域的插件來成倍提高工作效率。
          3.互補(bǔ)：Vim 和 Sublime Text 分別是命令行環(huán)境（CLI）和圖形界面環(huán)境（GUI）下的最佳選擇，同時(shí)使用兩者會(huì)大大提高工作效率。
          # 個(gè)人背景（Personal Background）
          我是一名非常典型的程序員：平時(shí)工作主要在 Linux 環(huán)境下使用 Java 和 Python，偶爾會(huì)用 HTML+CSS+JavaScript 編寫網(wǎng)頁；業(yè)余時(shí)會(huì)在 Windows 環(huán)境編寫一些 C# 程序（包括控制臺程序（Console Application）和移動(dòng)應(yīng)用（Mobile App），也會(huì)玩一些非主流語言（比如 Haskell，ML 和 Ruby 等）以拓展見識。
          所以這篇文章會(huì)我的個(gè)人工作內(nèi)容為主要使用場景（Scenario），盡管無法覆蓋到所有的使用場景，但我認(rèn)為依然可以覆蓋到絕大部分，如果您認(rèn)為我遺漏了什么內(nèi)容，請?jiān)谖恼孪旅婊貜?fù)，我會(huì)盡量更新。
          # 本文風(fēng)格（Writing Style）
          受益于 K&R C 的寫作風(fēng)格，我傾向于以實(shí)際案例來講解 Sublime Text 的功能，所以本文中的例子均源于我在實(shí)際開發(fā)時(shí)遇到的問題。
          此外，把本文會(huì)使用大量動(dòng)畫（GIF）演示 Sublime Text 的編輯功能，因?yàn)槲野l(fā)現(xiàn)圖片難以演示完整的編輯流程（Workflow），而視頻又過于重量級。本文的GIF動(dòng)畫均使用 ScreenToGif 進(jìn)行錄制。
          # 編輯器（Editor） vs 集成開發(fā)環(huán)境（Integrated Development Environment，下文簡稱 IDE）
          我經(jīng)常看到一些程序員拿編輯器和 IDE 進(jìn)行比較，諸如 Vim 比 Eclipse 強(qiáng)大或是 Visual Studio 太慢不如 Notepad++ 好使之類的討論比比皆是，個(gè)人認(rèn)為這些討論沒有意義，因?yàn)榫庉嬈骱?IDE 根本是面向兩種不同使用場景的工具：
          1.編輯器面向無語義的純文本，不涉及領(lǐng)域邏輯，因此速度快體積小，適合編寫單獨(dú)的配置文件和動(dòng)態(tài)語言腳本（Shell、Python 和 Ruby 等）。
          2.IDE 面向有語義的代碼，會(huì)涉及到大量領(lǐng)域邏輯，因此速度偏慢體積龐大，適合編寫靜態(tài)語言項(xiàng)目（Java、C++ 和 C# 等）。
          我認(rèn)為應(yīng)當(dāng)使用正確的工具去做有價(jià)值的事情，并把效率最大化，所以我會(huì)用 Eclipse 編寫 Java 項(xiàng)目，用 Vim 編寫Shell，用 Sublime Text 編寫 JavaScript/HTML/Python，用 Visual Studio 編寫C#。
          前言到此結(jié)束，下面進(jìn)入正題。
          # 安裝（Installation）


          Sublime Text 官方網(wǎng)站 提供了 Sublime Text 各系統(tǒng)各版本的下載，目前Sublime Text 的最新版本是 Sublime Text 3。這里以 Windows 版本的 Sublime Text 安裝為例。
          注意在安裝時(shí)勾選 Add to explorer context menu，這樣在右鍵單擊文件時(shí)就可以直接使用 Sublime Text 打開。
          # 添加 Sublime Text 到環(huán)境變量
          使用 Win + R 運(yùn)行 sysdm.cpl 打開 “系統(tǒng)屬性”。
          然后在 “高級” 選項(xiàng)卡里選擇 “環(huán)境變量”，編輯 “Path”，增加 Sublime Text 的安裝目錄（例如 D:\Program Files\Sublime Text 3）。
          接下來你就可以在命令行里面利用 subl 命令直接使用 Sublime Text 了：
          subl file :: 使用 Sublime Text 打開 file 文件
subl folder :: 使用 Sublime Text 打開 folder 文件夾
subl . :: 使用 Sublime Text 當(dāng)前文件夾
          # 安裝 Package Control
          前文提到 Sublime Text 支持大量插件，如何找到并管理這些插件就成了一個(gè)問題，Package Control 正是為了解決這個(gè)問題而出現(xiàn)的，利用它我們可以很方便的瀏覽、安裝和卸載 Sublime Text 中的插件。

          # 安裝 Package Control
          前文提到 Sublime Text 支持大量插件，如何找到并管理這些插件就成了一個(gè)問題，Package Control 正是為了解決這個(gè)問題而出現(xiàn)的，利用它我們可以很方便的瀏覽、安裝和卸載 Sublime Text 中的插件。
          進(jìn)入 Package Control 的 官網(wǎng)，里面有詳細(xì)的 安裝教程。Package Control 支持 Sublime Text 2 和 3，本文只給出 3 的安裝流程：
          1.使用 Ctrl + ` 打開 Sublime Text 控制臺。
          2.將下面的代碼粘貼到控制臺里：

          import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
          3.等待 Package Control 安裝完成。之后使用 Ctrl + Shift + P 打開命令板，輸入 PC 應(yīng)出現(xiàn) Package Control：
          成功安裝 Package Control 之后，我們就可以方便的安裝使用 Sublime Text 的各種插件：
          # 購買（Purchase）
          Sublime Text 是一個(gè)收費(fèi)閉源軟件，這在一定程度上成為了我支持 Sublime Text 的理由（我心中的軟件靠譜程度：免費(fèi)開源 << 免費(fèi)閉源 < 收費(fèi)開源 < 收費(fèi)閉源）：在 這里 購買。
          不過不購買 Sublime Text 也可以 “正常” 使用它，只是 Sublime Text 會(huì)時(shí)不時(shí)的彈出一個(gè)對話框提醒你購買，此外窗口處會(huì)有一個(gè)很屌絲很 low 逼的 (UNREGISTERED)。（在高頻操作下，一般 20 分鐘提示一次，個(gè)人認(rèn)為算是很厚道了）
          也許不少人會(huì)覺著 Sublime Text 70 刀的價(jià)格太貴，但相比它的功能和帶來的效率提升，70 刀真的不值一提，如果你不方便使用 Paypal 付款可以郵件聯(lián)系我，你支付寶給我打款然后我?guī)湍愀犊睿瑑r(jià)格按當(dāng)日匯率折算（450 元左右）。
           概覽（Tour）
          # 基本概念（Basic Concepts）
          Sublime Text 的界面如下：
          1.標(biāo)簽（Tab）：無需介紹。
          2.編輯區(qū)（Editing Area）：無需介紹。
          3.側(cè)欄（Side Bar）：包含當(dāng)前打開的文件以及文件夾視圖。
          4.縮略圖（Minimap）：如其名。
          5.命令板（Command Palette）：Sublime Text 的操作中心，它使得我們基本可以脫離鼠標(biāo)和菜單欄進(jìn)行操作。
          6.控制臺（Console）：使用 Ctrl + ` 調(diào)出，它既是一個(gè)標(biāo)準(zhǔn)的 Python REPL，也可以直接對 Sublime Text 進(jìn)行配置。
          7.狀態(tài)欄（Status Bar）：顯示當(dāng)前行號、當(dāng)前語言和Tab格式等信息。
          # 配置（Settings）
          與其他 GUI 環(huán)境下的編輯器不同，Sublime Text 并沒有一個(gè)專門的配置界面，與之相反，Sublime Text 使用 JSON 配置文件，例如：
          {
 "font_size": 12,
 "highlight_line": true,
}
          會(huì)將默認(rèn)字體大小調(diào)整為 12，并高亮當(dāng)前行。

          會(huì)將默認(rèn)字體大小調(diào)整為 12，并高亮當(dāng)前行。
          JSON 配置文件的引入簡化了 Sublime Text 的界面，但也使得配置變的復(fù)雜，一般我會(huì)到 這里 查看可用的 Sublime Text 配置。
          # 編輯（Editing）
          Sublime Text 的編輯十分人性化——它不像 Vim 那樣反人類（盡管我也用 Vim 但我還是要說 Vim 的快捷鍵設(shè)定絕壁連代謝產(chǎn)物都不如），少量的快捷鍵就可以完成絕大多數(shù)編輯任務(wù)。
          # 基本編輯（Basic Editing）
          ↑↓←→ 就是 ↑↓←→，不是 KJHL，（沒錯(cuò)我就是在吐槽 Vim，尼瑪設(shè)成 WSAD 也比這個(gè)強(qiáng)啊），粘貼剪切復(fù)制均和系統(tǒng)一致。
          Ctrl + Enter 在當(dāng)前行下面新增一行然后跳至該行；Ctrl + Shift + Enter 在當(dāng)前行上面增加一行并跳至該行。
          Ctrl + ←/→ 進(jìn)行逐詞移動(dòng)，相應(yīng)的，Ctrl + Shift + ←/→ 進(jìn)行逐詞選擇。
          Ctrl + ↑/↓ 移動(dòng)當(dāng)前顯示區(qū)域，Ctrl + Shift + ↑/↓ 移動(dòng)當(dāng)前行。


          # 選擇（Selecting）
          Sublime Text 的一大亮點(diǎn)是支持多重選擇——同時(shí)選擇多個(gè)區(qū)域，然后同時(shí)進(jìn)行編輯。
          Ctrl + D 選擇當(dāng)前光標(biāo)所在的詞并高亮該詞所有出現(xiàn)的位置，再次 Ctrl + D 選擇該詞出現(xiàn)的下一個(gè)位置，在多重選詞的過程中，使用 Ctrl + K 進(jìn)行跳過，使用 Ctrl + U 進(jìn)行回退，使用 Esc 退出多重編輯。
          多重選詞的一大應(yīng)用場景就是重命名——從而使得代碼更加整潔。盡管 Sublime Text 無法像 IDE（例如 Eclipse）那樣進(jìn)行自動(dòng)重命名，但我們可以通過多重選詞+多重編輯進(jìn)行直觀且便捷的重命名：
          有時(shí)我們需要對一片區(qū)域的所有行進(jìn)行同時(shí)編輯，Ctrl + Shift + L 可以將當(dāng)前選中區(qū)域打散，然后進(jìn)行同時(shí)編輯：
          有打散自然就有合并，Ctrl + J 可以把當(dāng)前選中區(qū)域合并為一行：
          # 查找&替換（Finding&Replacing）
          Sublime Text 提供了強(qiáng)大的查找（和替換）功能，為了提供一個(gè)清晰的介紹，我將 Sublime Text 的查找功能分為 快速查找、標(biāo)準(zhǔn)查找 和 多文件查找 三種類型。
          # 快速查找&替換
          多數(shù)情況下，我們需要查找文中某個(gè)關(guān)鍵字出現(xiàn)的其它位置，這時(shí)并不需要重新將該關(guān)鍵字重新輸入一遍然后搜索，我們只需要使用 Shift + ←/→ 或 Ctrl + D 選中關(guān)鍵字，然后 F3 跳到其下一個(gè)出現(xiàn)位置， Shift + F3 跳到其上一個(gè)出現(xiàn)位置，此外還可以用 Alt + F3 選中其出現(xiàn)的所有位置（之后可以進(jìn)行多重編輯，也就是快速替換）。


          # 標(biāo)準(zhǔn)查找&替換
          另一種常見的使用場景是搜索某個(gè)已知但不在當(dāng)前顯示區(qū)域的關(guān)鍵字，這時(shí)可以使用 Ctrl + F 調(diào)出搜索框進(jìn)行搜索：
          以及使用 Ctrl + H 進(jìn)行替換：


          # 關(guān)鍵字查找&替換
          對于普通用戶來說，常規(guī)的關(guān)鍵字搜索就可以滿足其需求：在搜索框輸入關(guān)鍵字后 Enter 跳至關(guān)鍵字當(dāng)前光標(biāo)的下一個(gè)位置， Shift + Enter 跳至上一個(gè)位置， Alt + Enter 選中其出現(xiàn)的所有位置（同樣的，接下來可以進(jìn)行快速替換）。
          Sublime Text 的查找有不同的模式：Alt + C 切換大小寫敏感（Case-sensitive）模式， Alt + W 切換整字匹配（Whole matching）模式，除此之外Sublime Text還支持在選中范圍內(nèi)搜索（Search in selection），這個(gè)功能沒有對應(yīng)的快捷鍵，但可以通過以下配置項(xiàng)自動(dòng)開啟。

          "auto_find_in_selection": true
          這樣之后在選中文本的狀態(tài)下范圍內(nèi)搜索就會(huì)自動(dòng)開啟，配合這個(gè)功能，局部重命名（Local Renaming）變的非常方便：
          使用 Ctrl + H 進(jìn)行標(biāo)準(zhǔn)替換，輸入替換內(nèi)容后，使用 Ctrl + Shift + H 替換當(dāng)前關(guān)鍵字， Ctrl + Alt + Enter 替換所有匹配關(guān)鍵字。
          # 正則表達(dá)式查找&替換
          正則表達(dá)式 是非常強(qiáng)大的文本查找&替換工具，Sublime Text中使用 Alt + R 切換正則匹配模式的開啟/關(guān)閉。Sublime Text的使用Boost里的Perl正則表達(dá)式風(fēng)格。
          出于篇幅原因，本文不會(huì)對正則表達(dá)式進(jìn)行詳細(xì)介紹，Mastering Regex（中譯本：精通正則表達(dá)式）對正則表達(dá)式的原理和各語言下的使用進(jìn)行了詳細(xì)介紹。此外網(wǎng)上有大量正則表達(dá)式的優(yōu)秀教程（“正則表達(dá)式30分鐘入門教程” 和 MSDN正則表達(dá)式教程.aspx)），以及在線測試工具（regexpal 和 regexer）。
          # 多文件搜索&替換
          使用 Ctrl + Shift + F 開啟多文件搜索&替換（注意此快捷鍵和搜狗輸入法的簡繁切換快捷鍵有沖突）：
          多文件搜索&替換默認(rèn)在當(dāng)前打開的文件和文件夾進(jìn)行搜索/替換，我們也可以指定文件/文件夾進(jìn)行搜索/替換。
          # 跳轉(zhuǎn)（Jumping）
          Sublime Text 提供了強(qiáng)大的跳轉(zhuǎn)功能使得我們可以在不同的文件/方法/函數(shù)中無縫切換。就我的使用經(jīng)驗(yàn)而言，目前還沒有哪一款編輯器可以在這個(gè)方面超越Sublime Text。
          # 跳轉(zhuǎn)到文件
          Ctrl + P 會(huì)列出當(dāng)前打開的文件（或者是當(dāng)前文件夾的文件），輸入文件名然后 Enter 跳轉(zhuǎn)至該文件。
          需要注意的是，Sublime Text使用模糊字符串匹配（Fuzzy String Matching），這也就意味著你可以通過文件名的前綴、首字母或是某部分進(jìn)行匹配：例如， EIS 、 Eclip 和 Stupid 都可以匹配 EclipseIsStupid.java 。


          # 跳轉(zhuǎn)到符號
          盡管是一個(gè)文本編輯器，Sublime Text 能夠?qū)Υa符號進(jìn)行一定程度的索引。Ctrl + R 會(huì)列出當(dāng)前文件中的符號（例如類名和函數(shù)名，但無法深入到變量名），輸入符號名稱 Enter 即可以跳轉(zhuǎn)到該處。
          此外，還可以使用 F12 快速跳轉(zhuǎn)到當(dāng)前光標(biāo)所在符號的定義處（Jump to Definition）。
          比較有意思的是，對于 Markdown， Ctrl + R 會(huì)列出其大綱，非常實(shí)用。


          # 跳轉(zhuǎn)到某行
          Ctrl + G 然后輸入行號以跳轉(zhuǎn)到指定行：
          # 組合跳轉(zhuǎn)
          在 Ctrl + P 匹配到文件后，我們可以進(jìn)行后續(xù)輸入以跳轉(zhuǎn)到更精確的位置：
          1.@ 符號跳轉(zhuǎn)：輸入 @symbol 跳轉(zhuǎn)到 symbol 符號所在的位置
          2.# 關(guān)鍵字跳轉(zhuǎn)：輸入 #keyword 跳轉(zhuǎn)到 keyword 所在的位置
          3.: 行號跳轉(zhuǎn)：輸入 :12 跳轉(zhuǎn)到文件的第12行。
          所以 Sublime Text 把 Ctrl + P 稱之為 “Go To Anything”，這個(gè)功能如此好用，以至于我認(rèn)為沒有其它編輯器能夠超越它。
          # 中文輸入法的問題
          從 Sublime Text 的初版（1.0）到現(xiàn)在（3.0 3065），中文輸入法（包括日文輸入法）都有一個(gè)問題：輸入框不跟隨。
          目前官方還沒有修復(fù)這個(gè) bug，解決方法是安裝 IMESupport 插件，之后重啟 Sublime Text 問題就解決了。


          # 文件夾（Folders）
          Sublime Text 支持以文件夾做為單位進(jìn)行編輯，這在編輯一個(gè)文件夾下的代碼時(shí)尤其有用。在 File 下 Open Folder ：
          你會(huì)發(fā)現(xiàn)右邊多了一個(gè)側(cè)欄，這個(gè)側(cè)欄列出了當(dāng)前打開的文件和文件夾的文件，使用 Ctrl + K, Ctrl + B 顯示或隱藏側(cè)欄，使用 Ctrl + P 快速跳轉(zhuǎn)到文件夾里的文件。
          # 窗口&標(biāo)簽（Windows & Tabs）
          Sublime Text 是一個(gè)多窗口多標(biāo)簽編輯器：我們既可以開多個(gè)Sublime Text窗口，也可以在一個(gè)Sublime Text窗口內(nèi)開多個(gè)標(biāo)簽。


          # 窗口（Window）
          使用 Ctrl + Shift + N 創(chuàng)建一個(gè)新窗口（該快捷鍵再次和搜狗輸入法快捷鍵沖突，個(gè)人建議禁用所有搜狗輸入法快捷鍵）。
          當(dāng)窗口內(nèi)沒有標(biāo)簽時(shí)，使用 Ctrl + W 關(guān)閉該窗口。
          # 標(biāo)簽（Tab）
          使用 Ctrl + N 在當(dāng)前窗口創(chuàng)建一個(gè)新標(biāo)簽， Ctrl + W 關(guān)閉當(dāng)前標(biāo)簽， Ctrl + Shift + T 恢復(fù)剛剛關(guān)閉的標(biāo)簽。
          編輯代碼時(shí)我們經(jīng)常會(huì)開多個(gè)窗口，所以分屏很重要。Alt + Shift + 2 進(jìn)行左右分屏， Alt + Shift + 8 進(jìn)行上下分屏， Alt + Shift + 5 進(jìn)行上下左右分屏（即分為四屏）。
          分屏之后，使用 Ctrl + 數(shù)字鍵 跳轉(zhuǎn)到指定屏，使用 Ctrl + Shift + 數(shù)字鍵 將當(dāng)前屏移動(dòng)到指定屏。例如， Ctrl + 1 會(huì)跳轉(zhuǎn)到1屏，而 Ctrl + Shift + 2 會(huì)將當(dāng)前屏移動(dòng)到2屏。
          # 全屏（Full Screen）
          Sublime Text 有兩種全屏模式：普通全屏和無干擾全屏。
          個(gè)人強(qiáng)烈建議在開啟全屏前關(guān)閉菜單欄（Toggle Menu），否則全屏效果會(huì)大打折扣。
          F11 切換普通全屏：
          Shift + F11 切換無干擾全屏：


          # 風(fēng)格（Styles）
          風(fēng)格對于任何軟件都很重要，對編輯器也是如此，尤其是GUI環(huán)境下的編輯器。作為一個(gè)程序員，我希望我的編輯器足夠簡潔且足夠個(gè)性。
          Notepad++ 默認(rèn)界面
          Sublime Text 默認(rèn)界面
          所以在用過 Sublime Text 之后，我立刻就卸掉了 Notepad++。
          Sublime Text 自帶的風(fēng)格是我喜歡的深色風(fēng)格（也可以調(diào)成淺色），默認(rèn)主題是Monokai Bright，這兩者的搭配已經(jīng)很不錯(cuò)了，不過我們還可以做得更好：接下來我將會(huì)展示如何通過設(shè)置偏好項(xiàng)和添加自定義風(fēng)格/主題使得 Sublime Text 更加 Stylish。
          # 一些設(shè)置（Miscellaneous Settings）
          下面是我個(gè)人使用的設(shè)置項(xiàng)。
          // 設(shè)置Sans-serif（無襯線）等寬字體，以便閱讀
"font_face": "YaHei Consolas Hybrid",
"font_size": 12,
// 使光標(biāo)閃動(dòng)更加柔和
"caret_style": "phase",
// 高亮當(dāng)前行
"highlight_line": true,
// 高亮有修改的標(biāo)簽
"highlight_modified_tabs": true,
          設(shè)置之后的效果如下：


          # 主題（Themes）
          Sublime Text 有大量第三方主題：[https://sublime.wbond.net/browse/labels/theme]，這里我給出幾個(gè)個(gè)人感覺不錯(cuò)的主題：
          Soda Light
          Soda Dark
          Nexus
          Flatland
          Spacegray Light
          Spacegray Dark


          # 配色（Color）
          colorsublime 包含了大量 Sublime Text 配色方案，并支持在線預(yù)覽，配色方案的安裝教程在 這里，恕不贅述。
          我個(gè)人使用的是 Nexus 主題和 Flatland Dark 配色，配置如下：
          "theme": "Nexus.sublime-theme",
"color_scheme": "Packages/Theme - Flatland/Flatland Dark.tmTheme",
          效果如下：
          # 編碼（Coding）
          優(yōu)秀的編輯器使編碼變的更加容易，所以 Sublime Text 提供了一系列功能以提高開發(fā)效率。


          # 良好實(shí)踐（Good Practices）


          良好的代碼應(yīng)該是規(guī)范的，所以Google為每一門主流語言都設(shè)置了其代碼規(guī)范（Code Style Guideline）。我自己通過下面的設(shè)置使以規(guī)范化自己的代碼。
          // 設(shè)置tab的大小為2
"tab_size": 2,
// 使用空格代替tab
"translate_tabs_to_spaces": true,
// 添加行寬標(biāo)尺
"rulers": [80, 100],
// 顯示空白字符
"draw_white_space": "all",
// 保存時(shí)自動(dòng)去除行末空白
"trim_trailing_white_space_on_save": true,
// 保存時(shí)自動(dòng)增加文件末尾換行
"ensure_newline_at_eof_on_save": true,
          # 代碼段（Code Snippets）
          Sublime Text 支持代碼段（Code Snippet），輸入代碼段名稱后 Tab 即可生成代碼段。
          你可以通過Package Control安裝第三方代碼段，也可以自己創(chuàng)建代碼段，參考這里。
          # 格式化（Formatting）
          Sublime Text 基本的手動(dòng)格式化操作包括：Ctrl + [ 向左縮進(jìn)， Ctrl + ] 向右縮進(jìn)，此外 Ctrl + Shift + V 可以以當(dāng)前縮進(jìn)粘貼代碼（非常實(shí)用）。
          除了手動(dòng)格式化，我們也可以通過安裝插件實(shí)現(xiàn)自動(dòng)縮進(jìn)和智能對齊：
          1.HTMLBeautify：格式化HTML。
          2.AutoPEP8：格式化Python代碼。
          3.Alignment：進(jìn)行智能對齊。
          # 自動(dòng)完成（Auto Completion）
          Sublime Text 支持一定的自動(dòng)完成，按 Tab 自動(dòng)補(bǔ)全。


          # 括號（Brackets）
          編寫代碼時(shí)會(huì)碰到大量的括號，利用 Ctrl + M 可以快速的在起始括號和結(jié)尾括號間切換， Ctrl + Shift + M 則可以快速選擇括號間的內(nèi)容，對于縮進(jìn)型語言（例如Python）則可以使用 Ctrl + Shift + J 。
          此外，我使用 BracketHighlighter 插件以高亮顯示配對括號以及當(dāng)前光標(biāo)所在區(qū)域，效果如下：


          # 命令行（Command Line）
          盡管提供了 Python 控制臺，但 Sublime Text 的控制臺僅支持單行輸入，十分不方便，所以我使用 SublimeREPL 以進(jìn)行一些編碼實(shí)驗(yàn)（Experiments）。


          # 其它（Miscellaneous）
          盡管我試圖在本文包含盡可能多的 Sublime Text 實(shí)用技能，但受限于篇幅和我的個(gè)人經(jīng)驗(yàn)，本文仍不免有所遺漏，歡迎在評論里指出本文的錯(cuò)誤及遺漏。
          下面是一些可能有用但我很少用到的功能：
          1.宏（Macro）：Sublime Text 支持錄制宏，但我在實(shí)際工作中并未發(fā)現(xiàn)宏有多大用處。
          2.其它平臺（Other Platforms）：本文只介紹了 Windows 平臺上 Sublime Text 的使用，不過 Linux 和 OS X 上Sublime Text的使用方式和Windows差別不大，只是在快捷鍵上有所差異，請參考 Windows/Linux快捷鍵 和 OS X 快捷鍵。
          3.項(xiàng)目（Projects）：Sublime Text支持簡單的 項(xiàng)目管理，但我一般只用到文件夾。
          4.Vim模式（Vintage）：Sublime Text自帶 Vim模式。
          5.構(gòu)建（Build）：通過配置，Sublime Text可以進(jìn)行 源碼構(gòu)建。
          6.調(diào)試（Debug）：通過安裝 插件，Sublime Text 可以對代碼進(jìn)行調(diào)試。
          # 快捷鍵列表（Shortcuts Cheatsheet）
          我把本文出現(xiàn)的Sublime Text按其類型整理在這里，以便查閱。
          通用（General）
          1.↑↓←→：上下左右移動(dòng)光標(biāo)，注意不是不是 KJHL ！
          2.Alt：調(diào)出菜單
          3.Ctrl + Shift + P：調(diào)出命令板（Command Palette）
          4.Ctrl + ` ：調(diào)出控制臺
          # 編輯（Editing）
          1.Ctrl + Enter：在當(dāng)前行下面新增一行然后跳至該行
          2.Ctrl + Shift + Enter：在當(dāng)前行上面增加一行并跳至該行
          3.Ctrl + ←/→：進(jìn)行逐詞移動(dòng)
          4.Ctrl + Shift + ←/→進(jìn)行逐詞選擇
          5.Ctrl + ↑/↓移動(dòng)當(dāng)前顯示區(qū)域
          6.Ctrl + Shift + ↑/↓移動(dòng)當(dāng)前行
          #選擇（Selecting）
          1.Ctrl + D：選擇當(dāng)前光標(biāo)所在的詞并高亮該詞所有出現(xiàn)的位置，再次 Ctrl + D 選擇該詞出現(xiàn)的下一個(gè)位置，在多重選詞的過程中，使用 Ctrl + K 進(jìn)行跳過，使用 Ctrl + U 進(jìn)行回退，使用 Esc 退出多重編輯
          2.Ctrl + Shift + L：將當(dāng)前選中區(qū)域打散
          3.Ctrl + J：把當(dāng)前選中區(qū)域合并為一行
          4.Ctrl + M：在起始括號和結(jié)尾括號間切換
          5.Ctrl + Shift + M：快速選擇括號間的內(nèi)容
          6.Ctrl + Shift + J：快速選擇同縮進(jìn)的內(nèi)容
          7.Ctrl + Shift + Space：快速選擇當(dāng)前作用域（Scope）的內(nèi)容
          # 查找&替換（Finding&Replacing）
          1.F3：跳至當(dāng)前關(guān)鍵字下一個(gè)位置
          2.Shift + F3：跳到當(dāng)前關(guān)鍵字上一個(gè)位置
          3.Alt + F3：選中當(dāng)前關(guān)鍵字出現(xiàn)的所有位置
          4.Ctrl + F/H：進(jìn)行標(biāo)準(zhǔn)查找/替換，之后：
          5.Alt + C：切換大小寫敏感（Case-sensitive）模式
          6.Alt + W：切換整字匹配（Whole matching）模式
          7.Alt + R：切換正則匹配（Regex matching）模式
          8.Ctrl + Shift + H：替換當(dāng)前關(guān)鍵字
          9.Ctrl + Alt + Enter：替換所有關(guān)鍵字匹配
          10.Ctrl + Shift + F：多文件搜索&替換
          # 跳轉(zhuǎn)（Jumping）
          1.Ctrl + P：跳轉(zhuǎn)到指定文件，輸入文件名后可以：
          2.@ 符號跳轉(zhuǎn)：輸入 @symbol 跳轉(zhuǎn)到 symbol 符號所在的位置
          3.# 關(guān)鍵字跳轉(zhuǎn)：輸入 #keyword 跳轉(zhuǎn)到 keyword 所在的位置
          4.: 行號跳轉(zhuǎn)：輸入 :12 跳轉(zhuǎn)到文件的第12行。
          5.Ctrl + R：跳轉(zhuǎn)到指定符號
          6.Ctrl + G：跳轉(zhuǎn)到指定行號
          # 窗口（Window）
          1.Ctrl + Shift + N：創(chuàng)建一個(gè)新窗口
          2.Ctrl + N：在當(dāng)前窗口創(chuàng)建一個(gè)新標(biāo)簽
          3.Ctrl + W：關(guān)閉當(dāng)前標(biāo)簽，當(dāng)窗口內(nèi)沒有標(biāo)簽時(shí)會(huì)關(guān)閉該窗口
          4.Ctrl + Shift + T：恢復(fù)剛剛關(guān)閉的標(biāo)簽
          # 屏幕（Screen）
          1.F11：切換普通全屏
          2.Shift + F11：切換無干擾全屏
          3.Alt + Shift + 2：進(jìn)行左右分屏
          4.Alt + Shift + 8：進(jìn)行上下分屏
          5.Alt + Shift + 5：進(jìn)行上下左右分屏
          6.分屏之后，使用 Ctrl + 數(shù)字鍵 跳轉(zhuǎn)到指定屏，使用 Ctrl + Shift + 數(shù)字鍵 將當(dāng)前屏移動(dòng)到指定屏
          延伸閱讀（Further Reading）
          # 書籍（Books）
          Mastering Sublime Text：我讀過的唯一一本關(guān)于 Sublime Text 的書籍，書中介紹的插件很實(shí)用，但對編輯技巧介紹不全。
          Instant Sublime Text Starter：另外一本關(guān)于 Sublime Text的書，我沒有讀過。
          # 鏈接（Links）
          1.官方文檔：http://www.sublimetext.com/docs/3/
          2.官方論壇：http://www.sublimetext.com/forum/
          3.Stack Overflow 的 Sublime Text 頻道：4.http://stackoverflow.com/questions/tagged/sublimetext
          5.http://stackoverflow.com/questions/tagged/sublimetext2
          6.http://stackoverflow.com/questions/tagged/sublimetext3
          7.非官方文檔：http://sublime-text-unofficial-documentation.readthedocs.org/ 甚至比官方文檔還要全面！
          8.Package Control：https://sublime.wbond.net/ 大量的 Sublime Text 插件和主題。
          # 視頻（Videos）
          1.Getting Started with SublimeText：https://www.youtube.com/watch?v=04gKiTiRlq8
          2.Sublime Text Pefect Workflow：https://www.youtube.com/watch?v=bpEp0ePIOEM&list=PLuwqxbvf3olpLsnFvo06gbrkcEB5o7K0g
          .1 HTML簡介
          1.1.1 HTML：Hyper Text Markup Language（超文本標(biāo)記語言）
          在學(xué)習(xí)使用HTML之前，大家經(jīng)常會(huì)問，什么是HTML？HTML是用來描述頁面的一種語言，它是一種超文本標(biāo)記語言，也就是說，HTML不是一種編程語言，僅是一種標(biāo)記語言。 HTML由一套標(biāo)記標(biāo)簽組成，在制作網(wǎng)頁時(shí)，HTML使用標(biāo)記標(biāo)簽來描述網(wǎng)頁。
          1.1.2 發(fā)展史

          1.1.3 HTML5的優(yōu)勢
          HTML5自正式推出以來，就以一種驚人的速度被迅速推廣著，各主流瀏覽器對于HTML5表現(xiàn)出來的熱烈歡迎、積極支持。
          1、世界知名瀏覽器廠商對HTML5的支持 
          通過對Internet、Explorer、Google、Firefox、Safari、Opera等主要的web瀏覽器發(fā)展策略調(diào)查，發(fā)現(xiàn)它們都在支持HTML5上采取了措施
           - 微軟：2010年3月16日，微軟與拉斯維加斯市舉行的MIX10技術(shù)大會(huì)上宣布已推出InternetExplorer(IE)9瀏覽器開發(fā)者預(yù)覽版。
           - Google：2010年2月19日，GoogleGears項(xiàng)目經(jīng)理伊安~費(fèi)特通過博客宣布，谷歌將放棄對Gears瀏覽器插件項(xiàng)目支持、重點(diǎn)開發(fā)HTML5項(xiàng)目
           - 蘋果：2010年6月7日，蘋果開發(fā)者大會(huì)的會(huì)后發(fā)布了Safari5。這款瀏覽器支持10個(gè)以上HTML5的新技術(shù)，包括全屏播放、HTML5地理位置、HTML5的形式驗(yàn)證等功能
           - Opera：2010年5月5日，Opera軟件公司首席技術(shù)官Hakon Wium Lie先生在訪華之際，接受了中國軟件資訊網(wǎng)等少數(shù)幾家媒體采訪，他認(rèn)為HTML5和CSS3將是全球互聯(lián)網(wǎng)發(fā)展的未來趨勢
           - Mozilla：2010年7月，Mozilla基金會(huì)發(fā)布了Firefox4瀏覽器的第一個(gè)測試版，從官方文檔看，它對HTML5是完全級別的支持 
          2、市場的需求
           現(xiàn)在的市場已經(jīng)迫不及待地要求有一個(gè)統(tǒng)一的互聯(lián)網(wǎng)通用標(biāo)準(zhǔn)。HTML5之前的情況是，由于各瀏覽器之間不統(tǒng)一，僅修改web瀏覽器之間的由于兼容性而引起的bug就浪費(fèi)了大量的時(shí)間。而HTML5的目標(biāo)就是將web帶入一個(gè)成熟的應(yīng)用平臺，在HTML5平臺上，視頻，音頻，圖像，動(dòng)畫及同計(jì)算器的交互都被標(biāo)準(zhǔn)化。
           3、跨平臺
           HTML5可以做到跨平臺開發(fā)，用戶只用打開瀏覽器即可訪問應(yīng)用，PC網(wǎng)站、各種移動(dòng)設(shè)備，插件等核心代碼就可以不需要重復(fù)編寫，極大地減少了開發(fā)人員的工作量。
          1.1.4 W3C標(biāo)準(zhǔn)
          發(fā)明HTML的初衷是實(shí)現(xiàn)信息資料的網(wǎng)絡(luò)傳播和共享，希望HTML文檔具有平臺無關(guān)性，即同一個(gè)HTML文件，在不同的瀏覽器上看到同樣的頁面內(nèi)容和效果。但是遺憾的是，隨著瀏覽器市場的激烈競爭，各大瀏覽器廠商為了吸引用戶，都在早期HTML版本的基礎(chǔ)上擴(kuò)展各類標(biāo)簽，各瀏覽器之間互不兼容，導(dǎo)致HTML編碼規(guī)則混亂，違背了HTML發(fā)明的初衷，因此需要一個(gè)組織來指定和維護(hù)統(tǒng)一的國際化web開發(fā)標(biāo)準(zhǔn)，確保多個(gè)瀏覽器都兼容，HTML內(nèi)容結(jié)構(gòu)都是語義化的。
          W3C標(biāo)準(zhǔn)不是某一個(gè)標(biāo)準(zhǔn)，而是一系列的標(biāo)準(zhǔn)集合，一個(gè)網(wǎng)頁主要有三部分組成，即結(jié)構(gòu)、表現(xiàn)、行為。
          對應(yīng)的標(biāo)準(zhǔn)也分三方面：結(jié)構(gòu)化標(biāo)準(zhǔn)語言主要包括XHTML和XML，表現(xiàn)標(biāo)準(zhǔn)語言主要包括CSS，行為標(biāo)準(zhǔn)主要包括對象模型（如W3CDOM）、ECMAScript等。這些標(biāo)準(zhǔn)大部分由W3C起草和發(fā)布，也有一些是其他標(biāo)準(zhǔn)組織制訂的標(biāo)準(zhǔn)，比如ECMA（European Computer Manufacturers Association）的ECMAScript標(biāo)準(zhǔn)。
          1.1.5 網(wǎng)頁編輯工具
          1、開發(fā)工具：
          • 記事本、Dreamweaver、UltraEdit、Sublime、WebStorm等 
          • 你可以從以上軟件的官網(wǎng)中下載對應(yīng)的軟件，按步驟安裝即可。 
          • 接下來我們將為大家演示如何使用 WebStorm來創(chuàng)建 HTML 文件。 
          2、使用WebStorm編輯HTML文檔如下： 
          • 打開WebStorm編輯器后，選擇File->New->HTML File命令，打開“HTML File”對話框; 
          • 在“Name”文本框中輸入HTML的文件名為“my_firstPage”在“Kind”下拉列表框中選擇HTML5 file選項(xiàng) 后OK按鈕即可創(chuàng)建一個(gè)HTML5頁面的模板; 
          • 在body元素和title元素中添加網(wǎng)頁內(nèi)容; 
          • 網(wǎng)頁內(nèi)容添加完成后，鼠標(biāo)移動(dòng)到編輯器的右上方，會(huì)出現(xiàn)幾個(gè)常見的瀏覽器圖標(biāo)，單擊Chrome瀏覽器附表即可打開頁面; 
          • 在Chrome瀏覽器中可以顯示出結(jié)果。
          2.1 HTML基礎(chǔ)
          2.1.1 HTML5的基本結(jié)構(gòu)
          <html>
    <head>
             <title>我的第一個(gè)網(wǎng)頁</title>
    </head>
    <body>
             我的第一個(gè)網(wǎng)頁
    </body>
</html>

          標(biāo)簽都是成對出現(xiàn)的。 有一個(gè)開頭標(biāo)記就應(yīng)該有一個(gè)對應(yīng)的結(jié)束標(biāo)記記，“<>”開始，以“</>”結(jié)束，要求成對出現(xiàn)，標(biāo)簽之間有縮進(jìn)，提現(xiàn)層次感，方便閱讀。
          HTML5的基本結(jié)構(gòu)分為兩部分。整個(gè)HTML包括頭部｛head｝和主體｛body｝兩部分，頭部包括網(wǎng)頁標(biāo)題｛title｝等基本信息，主體包括頁面的內(nèi)容信息，如圖片、文字等。
          2.1.2 網(wǎng)頁的基本信息
          1、DOCTYPE 聲明在這個(gè)HTML5文件最上面有一行關(guān)于DOCTYPE文檔類型的聲明，約束HTML文檔結(jié)構(gòu)。檢查是否符合相關(guān)WEB標(biāo)準(zhǔn)，同時(shí)告訴瀏覽器使用那中規(guī)范來解釋這個(gè)文檔中的代碼。DOCTYPE聲明必須位于HTML文檔的第一行。
          HTML5:
          <!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

</body>
</html>

          HTML4：
          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://wwww.w3.org/TR/xhtml1-transitional.dtd">

          2、<title>標(biāo)簽 使用<title>標(biāo)簽描述頁面的標(biāo)簽，類似一個(gè)文檔的標(biāo)題，為一個(gè)簡介的主題，并能使讀者有興趣。
          <title>搜狐-中國最大的門戶網(wǎng)站</title>

          3、<meta>標(biāo)簽 使用<meta>標(biāo)簽描述網(wǎng)頁的摘要信息，包括文檔內(nèi)容類型、字符編碼信息，搜索關(guān)鍵字、網(wǎng)站提供的功能和服務(wù)的詳細(xì)描述等。<meta>標(biāo)簽的內(nèi)容并不顯示，其目的是方便瀏覽器解析或利于搜索引擎搜索，它采用“名稱/值”對的方式描述摘要信息。
          meta標(biāo)簽可分為兩大部分：http-equiv和name變量。
          http-equiv相當(dāng)于http的文件頭作用，它可以向?yàn)g覽器傳回一些有用的信息，以幫助瀏覽器正確地顯示網(wǎng)頁內(nèi)容。



          name屬性主要用于描述網(wǎng)頁，與之對應(yīng)的屬性值為content，content中的內(nèi)容主要是便于搜索引擎機(jī)器人查找信息和分類信息用的。


           1.文檔內(nèi)容類型，字符編碼信息書寫如下：
           HTML5:
          <meta charset="UTF-8">

           HTML4:
          <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

           屬性：charset表示字符集編碼，常用的編碼有以下幾種。
           1.gb2312：簡體中文，一般用于包含中文和英文的頁面；
           2.ISO-885901：純英文，一般用于只包含英文的頁面；
           3.big5：繁體，用于帶有繁體字的頁面；
           4.UTF-8：國際性通用的編碼，同樣適用于中文和英文的頁面。和gb2312編碼相比，國際通用性更好。
           2.搜索關(guān)鍵字和內(nèi)容描述信息書寫如下：
          <meta name="keywords" content="云圖智聯(lián)">
<meta name="description"content="云圖智聯(lián)是國內(nèi)的IT教育集團(tuán)，致力于為中國培養(yǎng)優(yōu)秀的IT技術(shù)人才">

          網(wǎng)站示例：
          <!--京東-->
 <meta name="description"
          content="京東JD.COM-專業(yè)的綜合網(wǎng)上購物商城,銷售家電、數(shù)碼通訊、電腦、家居百貨、服裝服飾、母嬰、圖書、食品等數(shù)萬個(gè)品牌優(yōu)質(zhì)商品.便捷、誠信的服務(wù)，為您提供愉悅的網(wǎng)上購物體驗(yàn)!"/>
    <meta name="Keywords" content="網(wǎng)上購物,網(wǎng)上商城,手機(jī),筆記本,電腦,MP3,CD,VCD,DV,相機(jī),數(shù)碼,配件,手表,存儲卡,京東"/>

          <!--淘寶-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="renderer" content="webkit" />
  <title>淘寶網(wǎng) - 淘！我喜歡</title>
  <meta name="spm-id" content="a21bo" />
  <meta name="description" content="淘寶網(wǎng) - 亞洲較大的網(wǎng)上交易平臺，提供各類服飾、美容、家居、數(shù)碼、話費(fèi)/點(diǎn)卡充值… 數(shù)億優(yōu)質(zhì)商品，同時(shí)提供擔(dān)保交易(先收貨后付款)等安全交易保障服務(wù)，并由商家提供退貨承諾、破損補(bǔ)寄等消費(fèi)者保障服務(wù)，讓你安心享受網(wǎng)上購物樂趣！" />
  <meta name="aplus-xplug" content="NONE">
  <meta name="keyword" content="淘寶,掏寶,網(wǎng)上購物,C2C,在線交易,交易市場,網(wǎng)上交易,交易市場,網(wǎng)上買,網(wǎng)上賣,購物網(wǎng)站,團(tuán)購,網(wǎng)上貿(mào)易,安全購物,電子商務(wù),放心買,供應(yīng),買賣信息,網(wǎng)店,一口價(jià),拍賣,網(wǎng)上開店,網(wǎng)絡(luò)購物,打折,免費(fèi)開店,網(wǎng)購,頻道,店鋪" />

          2.1.3 HTML5的基本標(biāo)簽
          1、標(biāo)題標(biāo)簽
          <h1>…</h1>
<h2>…</h2>
<h3>…</h3>
<h4>…</h4>
<h5>…</h5>
<h6>…</h6>

          標(biāo)題標(biāo)簽表示一段文字和標(biāo)題或主題，并且支持多層的內(nèi)容結(jié)構(gòu)。例如，一級標(biāo)題采用h1，二級標(biāo)題采用h2，其他級別標(biāo)題以此類推。HTML共提供了六級標(biāo)題h1~h6，并賦予了標(biāo)題一定的外觀，所有標(biāo)題字體加粗，h1字號最大，h6字號最小。
          2、段落標(biāo)簽、換行標(biāo)簽和水平線標(biāo)簽
          <p>段落標(biāo)簽</p>
<br/><!--換行標(biāo)簽-->
<hr><!--水平線標(biāo)簽-->

          3、字體樣式標(biāo)簽
          <!--加粗-->
<strong></strong>
<b></b>
<!--傾斜-->
<em></em>
<i></i>
<!--字體縮小-->
<small></small>
<!--刪除線-->
<s></s>
<!--下劃線-->
<u></u>

          4、圖像標(biāo)簽
          （1）常見的圖像格式
           1.JPG格式
           JPG格式圖像是在Internet上被廣泛支持的圖像格式，它是聯(lián)合圖像專家組格式的英文縮寫。JPG格式采用的是有損壓縮，會(huì)造成圖像畫面的失真，不過壓縮之后的體積很小，而且比較清晰，所以比較適合在網(wǎng)頁中應(yīng)用此格式最適合用于排和或連續(xù)取色調(diào)圖像的高級格式，這事因?yàn)镴PG文件可以包含數(shù)百萬種顏色。隨著JPG格式文件品格式質(zhì)的提高，文件的大小和下載時(shí)間也會(huì)隨著增加。通常可以通過壓縮JPG格式文件在圖像品質(zhì)和文件大小之間達(dá)到良好的平衡。
           2.GIF格式
           GIF格式圖像是網(wǎng)頁中使用最廣泛，最普通的一種圖像格式，它是圖像交換格式的英文縮寫。GIF格式文件支持透明色，使得GIF格式在網(wǎng)頁的背景和一些多層特效的顯示上 用得非常多；還支持動(dòng)畫，這是它最突出的一個(gè)特點(diǎn)，因此GIF格式圖像在網(wǎng)頁中應(yīng)用非常廣泛。
           3.BMP格式
           BMP格式圖像在Windows操作系統(tǒng)中使用得比較多，它是位圖的英文縮寫。BMP格式圖像格式與其他Microsoft Windows程序兼容。它不支持文件壓縮，也不是用于Web頁。
           4.PNG格式
           PNG格式是20世紀(jì)90年代中期開始開發(fā)的圖像文件儲存格式，它兼有GIF和JPG格式的優(yōu)勢，同時(shí)具備GIF格式不具備的特性。
          （2）圖像標(biāo)簽
          <img src="path" alt="text" title="text"  width="x"  height="y" />

           src屬性表示圖片路徑，alt屬性指定圖像的代替文本，表示圖像無法顯示時(shí)（如圖片路徑錯(cuò)誤或網(wǎng)速太慢等）替代先是文本，這樣，即使當(dāng)圖像無法顯示時(shí)，用戶還可以看到網(wǎng)頁丟失的信息內(nèi)容。
           title屬性可以提供額外的提示或幫助信息，當(dāng)鼠標(biāo)移至圖片上時(shí)顯示提示信息，方便用戶使用。
           width和height兩個(gè)屬性分別表示圖片的寬度和高度，如果不設(shè)置，那么圖片默認(rèn)顯示原始大小。
          5、超鏈接標(biāo)簽
          （1）超鏈接包含兩部分內(nèi)容，一是鏈接地址，即鏈接的目標(biāo)，可以是某個(gè)網(wǎng)站或文件路徑，對應(yīng)a標(biāo)簽的href屬性；二是鏈接文本或圖像，點(diǎn)擊該文本或圖像，將跳轉(zhuǎn)到href屬性指定的鏈接地址。
          <a href="path" target="目標(biāo)窗口位置">鏈接文本或圖像</a>

           href：鏈接地址的路徑;
           target：指定鏈接在哪個(gè)窗口打開，常用的取值有_self（自身窗口）、_blank（新建窗口）。 超鏈接即可以是文本超鏈接，也可以使圖片超鏈接
          （2）常用的超鏈接
           1>頁面間鏈接
           從一個(gè)頁面鏈接到另一個(gè)頁面
           2>錨鏈接
           錨鏈接也稱錨點(diǎn)鏈接，命名錨點(diǎn)鏈接（也叫書簽鏈接）常常用于那些內(nèi)容龐大繁瑣的網(wǎng)頁，通過點(diǎn)擊命名錨點(diǎn)，自動(dòng)跳轉(zhuǎn)到我們設(shè)置錨點(diǎn)的位置，類似于我們閱讀書籍時(shí)的目錄頁碼或章回提示。
           錨點(diǎn)鏈接可以跳轉(zhuǎn)到頁面的任何位置。一般用于在頁面下面的時(shí)候，點(diǎn)擊回到最上面。錨點(diǎn)鏈接的名稱可以隨意取，只起到標(biāo)記作用。
           1.從A頁面的甲位置跳轉(zhuǎn)到本頁中的乙位置
          示例：
              <a href="#a1">a1</a>
    <a href="#a2">a2</a>
    <a href="#a3">a3</a>
    <a href="#a4">a4</a>

    <div id="a1">a1</div>
    <div id="a2">a2</div>
    <div id="a3">a3</div>
    <div id="a4">a4</div>
           2.從A頁面的甲位置跳轉(zhuǎn)到B頁面中的乙位置
          示例：
          <!--A頁面-->
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
<title>錨鏈接</title>
</head>
<body>
<p>
    [<a href="help.html#register">A位置</a>] 
    [<a href="help.html#login">B位置</a>]
</p>
</body>
</html>
          <!--B頁面-->
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>錨鏈接</title>
    <style>
        div{
            width: 100%;
            height: 500px;
            border: 1px solid red;
        }
    </style>
</head>
<body>
<h4><a name="register">A位置</a></h4>
<div>
    <h2>A位置</h2>
</div>
<h4><a name="login">B位置</a></h4>
<div>
    <h2>B位置</h2>
</div>
</body>
</html>
          3>功能性鏈接
          <!--下載圖片-->
<a href="img/qq.jpg">點(diǎn)擊下載圖片</a>
          <!--發(fā)送郵件-->
<a href="mailto:Webmaster@ytzl.cn">聯(lián)系我們</a>
          <!--引用腳本語言-->
<a href="javascript：alert('哈哈哈哈')"></a>
          6、注釋和特殊符號
          <!--注釋符號-->
          當(dāng)頁面的HTML結(jié)構(gòu)復(fù)雜或內(nèi)容較多時(shí)，需要添加必要的注釋方便代碼閱讀和維護(hù)。同時(shí)，有時(shí)為了調(diào)試，需要暫時(shí)注釋掉一些不必要的HTML代碼。特殊符號一般以"&"符號開頭，";"結(jié)尾。


          3.1 練習(xí)
          3.1.1 制作《悟空》歌詞
          需求：
           1、標(biāo)題使用標(biāo)題標(biāo)簽，文字使用p標(biāo)簽標(biāo)題與正文之間的分隔線使用水平線標(biāo)簽；歌詞詞結(jié)束后使用換行標(biāo)簽換行
           2、人名加粗顯示，時(shí)間斜體顯示 
           3、制作頁面版權(quán)部分
          <html>
    <head>
             <title>我的第一個(gè)網(wǎng)頁</title>
    </head>
    <body>
             我的第一個(gè)網(wǎng)頁
    </body>
</html>

          3.1.2 制作圖書簡介頁面
          使用學(xué)過的圖像標(biāo)簽、標(biāo)題標(biāo)簽、水平線標(biāo)簽、斜體標(biāo)簽、加粗標(biāo)簽、段落標(biāo)簽等制作京東讀書新聞資訊頁面，主標(biāo)題使用一級標(biāo)題標(biāo)簽，副標(biāo)題使用二級標(biāo)題標(biāo)簽，二級標(biāo)題與圖片之間使用水平線分隔。
          <h1>HTML5+CSS3從入門到精通（標(biāo)準(zhǔn)版）</h1>
<h2>作者：未來科技</h2>
<hr/>
<p><img src="images/book.jpg" alt="圖書" width="200"/></p>
<p><em>HTML 5 CSS 3 JavaScript從入門到精通（標(biāo)準(zhǔn)版）</em></p>
<p><em>  以基礎(chǔ)知識、示例、實(shí)戰(zhàn)案例相結(jié)合的方式詳盡講述了HTML  CSS  JavaScript及目前*的前端技術(shù)html5移動(dòng)開發(fā) html5實(shí)戰(zhàn) html5 canvas html5 app html5入門 html5 動(dòng)畫  html5揭秘 html 游戲 html5權(quán)威指南 的基本知識都有涉及。</em></p>
<p><strong>全書分兩大部分，共12章</strong></p>
<p>介紹了HTML5入門和CSS3實(shí)戰(zhàn)入門內(nèi)容：使用HTML標(biāo)簽標(biāo)識網(wǎng)頁內(nèi)容，使用CSS設(shè)計(jì)網(wǎng)頁基本樣式，如使用并美化文本、圖像、超鏈接、列表、表單和表格等</p>
<p>第二部分為CSS3布局部分，主要講解使用CSS3設(shè)計(jì)完整網(wǎng)頁的方法和技巧，以及CSS3中的各種新技術(shù)應(yīng)用；</p>
<p>? 2015-2025 云圖智聯(lián)</p>

          3.1.3 錨鏈接的應(yīng)用
          <!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        a{
            display: block;
            width: 30px;
            height: 30px;
            line-height: 30px;
            font-size: 18px;
        }
        div{
            width: 400px;
            height: 400px;
            margin-top: 20px;
            border: 1px solid red;
        }
    </style>
</head>
<body>
<a href="#a1">a1</a><a href="#a2">a2</a><a href="#a3">a3</a><a href="#a4">a4</a>
<div id="a1">a1</div>
<div id="a2">a2</div>
<div id="a3">a3</div>
<div id="a4">a4</div>
</body>
</html>
          免費(fèi)學(xué)習(xí)視頻歡迎關(guān)注云圖智聯(lián)：https://e.yuntuzhilian.com/
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
乱色精品无码一区二区国产盗|
日韩中文字幕精品免费一区|
久久一区二区三区精品|
无码丰满熟妇一区二区|
国产在线精品一区二区在线观看
|
国产香蕉一区二区精品视频|
日韩一区二区三区在线精品|
无码av中文一区二区三区桃花岛|
久久国产一区二区|
国产一区二区精品久久岳|
国产女人乱人伦精品一区二区|
人妻夜夜爽天天爽爽一区|
国产在线精品一区二区三区不卡|
日本精品视频一区二区|
麻豆精品人妻一区二区三区蜜桃|
蜜桃无码AV一区二区|
少妇人妻精品一区二区三区|
日韩人妻无码一区二区三区久久99|
无码人妻精品一区二区蜜桃AV|
国产婷婷色一区二区三区深爱网|
无码人妻精一区二区三区|
欧美av色香蕉一区二区蜜桃小说|
久久精品成人一区二区三区|
亚洲熟女乱色一区二区三区|
无码人妻精品一区二区三区久久久
|
成人免费视频一区二区三区
|
亚洲av无码一区二区三区观看
|
亚洲va乱码一区二区三区|
人妻无码第一区二区三区|
日韩精品无码中文字幕一区二区|
波多野结衣AV无码久久一区|
亚洲韩国精品无码一区二区三区|
免费一区二区无码东京热|
亚洲AV无码一区东京热久久|
精品无码人妻一区二区三区品
|
精品综合一区二区三区|
人成精品视频三区二区一区
|
国产精品小黄鸭一区二区三区|
精品福利一区二区三区|
午夜福利一区二区三区在线观看|
精品无码一区二区三区电影|