1. 程式人生 > >html css 零基礎入門之第一個html程式碼(注重於vscode的安裝使用)

html css 零基礎入門之第一個html程式碼(注重於vscode的安裝使用)

  html css 零基礎入門之第一個html程式碼

剛博主已經做了一個基礎部分的margin與padding的講解!為了給零基礎的小夥伴們提供更多的幫助,現在我們來學習一下如何構建第一個HTML程式碼呢?

針對與啥都不懂的萌新來說,一開始,前十個程式碼把,博主建議用windows自帶的記事本敲程式碼!這樣至少你會對HTML程式碼的結構有一個基本的瞭解!

熟悉了HTML基本結構之後呢,,是不是覺得每次都要輸入那多“模版”是不是好煩啊!偷笑

沒關係下面博主就會為大家推薦一款超級好用的編輯器,很多大公司都在用呢,,意不意外?驚不驚喜?哦對了,,還是開源的哦!嗯,那就是我們的VSCODE!

嗯,廢話少說直接貼下載連結哈:https://code.visualstudio.com/


進入之後是醬紫哦!之後下拉找到對應的版本下載就可以了!


vscode還是非常人性化的,不管你是win還是Linux還是MAC在這裡都會找到自己所需要的版本哦!下載之後直接解壓就可以咯!博主在這裡就不下載了哈,但是最好把下載的檔案儲存到一個檔案中,不然待會出來大量的檔案,這個感覺非常不爽!!!

之後找到應用程式就可以打開了!就是這個圖示哈,雙擊!

出來是這樣的:

之後點選新建-檔案效果如下:


之後點選新建-另存為:


這裡注意儲存型別為HTML,名字博主隨便取的!點選儲存之後在vscode中輸入!之後按下回車,出現如下介面:


這樣,我們的第一個HTML模版就生成了!此時如果瀏覽器訪問檔案,是一個空檔案,也就是空白頁面!

當然vscode是非常強大的,無敵的他幾乎可以編輯任何語言,包括我們前端常用的HTML CSS JS等等!其他的功能小夥伴們可以自行體會哦!

好了,這次的分享就到這裡咯!喜歡的小夥伴點個攢哦!歡迎留言評論交流,我們下次再見!

相關推薦

html css 基礎入門一個html程式碼注重vscode安裝使用

  html css 零基礎入門之第一個html程式碼剛博主已經做了一個基礎部分的margin與padding的講解!為了給零基礎的小夥伴們提供更多的幫助,現在我們來學習一下如何構建第一個HTML程式碼呢?針對與啥都不懂的萌新來說,一開始,前十個程式碼把,博主建議用windo

Web前端丨Web開發丨Web代碼 html+css基礎入門教程

strong 大型 打字 添加 瀏覽器 lock 效果 格式化文本 size 什麽是HTML文本格式化 HTML 可定義很多供格式化輸出的元素,比如粗體和斜體字。 如下代碼: <p>TThis text is normal</p><b>

[小甲魚]基礎入門python012講課後測試題及答案:列表:一個打了激素的陣列3

1. 請問如何將下邊這個列表的'小甲魚'修改為'小魷魚'?     list1 = [1, [1, 2, ['小甲魚']], 3, 5, 8, 13, 18]     list1[1][2][0]="小甲魚" 2. 要對一個列表進行順序排序,請問使用什

[小甲魚]基礎入門python010講課後測試題及答案:列表:一個打了激素的陣列1

測試題: 0. 列表都可以存放一些什麼東西?    任何資料型別:如 數字,字串,列表,字典 1. 向列表增加元素有哪些方法?    .append()  .extend()  .insert() 2. append() 方法和

[小甲魚]基礎入門python006講課後測試題及答案:python常用操作符

測試題: 0. Python 的 floor 除法現在使用 “//” 實現,那 3.0 // 2.0 您目測會顯示什麼內容呢?     地板除法,3//2=1,  3.0//2.0=1.0,整數的地板除//永遠是整數,即使除不盡 1. a < b < c

小甲魚基礎入門python005講課後測試題及答案:閒聊python的資料型別

0.在 Python 中, int 表示整型, 那你還記得 bool 、 float 和 str 分別表示什麼嗎? bool :布林型,ture代表1,false代表0;float:浮點型;str:字串 1. 你知道為什麼布林型別 (bool) 的 True 和 False 分別用 1 和 0

基礎入門python002講課後測試題及答案:用python設計一個小遊戲

0. 什麼是BIF? BIF 就是 Built-in Functions,內建函式。為了方便程式設計師快速編寫指令碼程式(指令碼就是要程式設計速度快快快!!!),Python 提供了非常豐富的內建函式,我們只需要直接呼叫即可,例如 print() 的功能是“列印到螢幕”,input() 的作用是接收使用者輸入

[小甲魚]基礎入門python009講課後測試題及答案:了不起的分支和迴圈3

下面的迴圈會列印多少次"I Love FishC"? for i in range(0, 10, 2): print(‘I Love FishC’) 0,2,4,6,8,會列印5次 下面的迴圈會列印多少次"I Love FishC"? for i in 5: print(

[小甲魚]基礎入門python007、008講課後測試題及答案:了不起的分支迴圈1&2

0. if not (money < 100): 上邊這行程式碼相當於?    if money >= 100: 1. assert 的作用是什麼?     斷言,當這個關鍵字後邊的條件為假的時候,程式自動崩潰並丟擲AssertionEr

Python基礎入門函式的修飾器詳解!

內嵌函式 要理解修飾器,首先要知道python的內嵌函式。 在函式內部可以建立另外一個函式,不過內部函式也只能在外部函式的作用域之內呼叫才有效。 如果內部函式定義中包含了外部函式定義的物件的引用,內部函式會被稱為閉包 私信小編007即可獲取小編精心準備的大禮包一份哦!

Python基礎入門python程式碼的外部模組引用與基本賦值語句!

從結構化程式設計流行以來,程式碼便被分塊儲存,稱之為模組或庫。 在python中仍然如其它程式語言一樣,我們可以在一個文件中方便地引用一個模組,然後可以在當前文件的程式碼中使用外部模組的可用物件。 一般來說,在python中一個外部模組也對應了一個以.py結尾的具體檔案。 一、引用模組中

[小甲魚] 基礎入門python017講課後測試題及答案:函式-python的樂高積木

0. 你有聽說過DRY嗎?     沒有1. 都是重複一段程式碼,為什麼我要使用函式(而不使用簡單的拷貝黏貼)呢?    函式方便使用  2. 函式可以有多個引數嗎?    可以,一般三四個為宜  3. 建立函式使用什麼關鍵字,要注意什麼?     def  4. 請問這個函

Python基礎入門三---for迴圈+列表

Python的for迴圈與C、C++等語言的for迴圈的結構還是有很大的差別的,不過還是很容易上手的,Python的列表類似於C語言中的陣列,但是相比陣列的功能更加強大,玩笑話是說打了激素中的陣列。 For迴圈 (1)For迴圈的語法結構: For

如何成為python聖鬥士一個python程序1

python 小白 聖鬥士 安裝python解釋器python是跨平臺的語言,目前主流的有2.X和3.X系列版本,由於3.X系列是不兼容2.X系列的,但現如今很多程序和第三方庫都是基於2.X系列開發的,因此我們以2.X為主,期間也會穿插介紹3.X的部分特性。學習編程語言的第一步那就是hellowo

【轉載】《基礎入門深度學習》系列文章教程+程式碼

轉自:https://blog.csdn.net/TS1130/article/details/53244576 無論即將到來的是大資料時代還是人工智慧時代,亦或是傳統行業使用人工智慧在雲上處理大資料的時代,作為一個有理想有追求的程式設計師,不懂深度學習(Deep Learning)這個超熱的技

TypeScrip入門—環境搭建和一個TS程式碼

介紹 TypeScript 擴充套件了 JavaScript 語法,任何已經存在的 JavaScript 程式,可以不加任何改動,在 TypeScript 環境下執行。TypeScript 只是向 JavaScript 添加了一些新的遵循 ES6 規範的語法,以及基於類的面向物件程式設計

基礎入門學習python》學習過程

學習時間:2017/10/17 第18、19、20、21、22、23課:函式 18課知識點彙總: 建立和呼叫函式: >>> def Function_name(parameters): #函式建立 functio

[轉]《基礎入門深度學習》系列文章教程+程式碼

無論即將到來的是大資料時代還是人工智慧時代,亦或是傳統行業使用人工智慧在雲上處理大資料的時代,作為一個有理想有追求的程式設計師,不懂深度學習(Deep Learning)這個超熱的技術,會不會感覺馬上就out了?現在救命稻草來了,《零基礎入門深度學習》系列文章旨

Unity引擎入門——製作一個2D遊戲1

Unity作為當今最流行的遊戲引擎之一,受到各大廠商的喜愛。 像是爐石傳說,以及最近的逃離塔克夫,都是由unity引擎開發製作。 作為初學者的我們,雖然無法直接做出完成度那麼高的作品,但每一個偉大的目標,都有一個微不足道的開始。讓我們從一個2D小遊戲入手,來學習Unity引擎的使用吧! ① 新建專案,尋找素材

Unity引擎入門——製作一個2D遊戲2角色移動與動畫

在上一節的內容裡,我們已經創建出了一個主角,也搭建了一個簡單的場景。 傳送門:https://www.cnblogs.com/zny0222/p/12653088.html 既然有了主角,要怎樣才能讓主角動起來呢? 這時候我們就需要寫一些簡單的程式碼,來控制我們人物的移動。 如圖所示,我們新建一個資料夾,用