前端開發 Day4

2021-10-24 21:15:41 字數 1838 閱讀 5530

本章介紹了 html 中較為常用的標籤的例項。

您可能還沒接觸過這些例項,不過不用擔心,閱讀完本章您就能夠掌握它們了! 

html 標題(heading)是通過 

你也可以通過實戰實驗來嘗試挑戰乙個 h2 標題的設定:

html標題

實戰實驗

html 段落是通過標籤來定義的,p是英文paragraph段落的縮寫,經常被用來建立乙個段落,就和你寫作文一樣,您可以進行實戰演練。

這是乙個段落。

這是另外乙個段落。

下面這個例項講述了標題和段落的結構層次:

羅貫中

話說天下大勢,分久必合,合久必分。

且說董卓字仲穎

卻說張飛飲了數杯悶酒

在**中可能包含了很多的空格——這是沒有必要的

下面的兩個**片段是等價的:

狗 狗 很 呆 萌。

狗 狗 很

呆 萌。

無論你用了多少空格(包括空格字元,包括換行),當渲染這些**的時候,html 直譯器會將連續出現的空格字元減少為乙個單獨的空格符。

為什麼我們會使用那麼多的空格呢? 

答案就是為了可讀性——如果你的**被很好地進行格式化,那麼就很容易理解你的**,反之就會很混亂。在我們的 html **中,我們讓每乙個巢狀的元素以兩個空格縮排。

你使用什麼風格來格式化你的**取決於你(比如所對於每層縮排使用多少個空格),但是記住你應該堅持使用某種風格。

html 鏈結是通過標籤來定義的。a標籤,也叫anchor(錨點)元素,既可以用來鏈結到外部位址實現頁面跳轉功能,也可以鏈結到當前頁面的某部分實現內部導航功能。

這是乙個鏈結
(您將在本教程稍後的章節中學習更多有關屬性的知識)

html鏈結

實戰測驗

html 影象是通過標籤來定義的。使用img元素來為你的**新增,使用src屬性指向乙個的具體位址。

舉例如下:

請注意:img元素是自關閉元素,不需要結束標記。

注意:影象的名稱和尺寸是以屬性的形式提供的。

html影象

實戰測驗

在人類語言中,為了突出一句話的意思,我們通常強調某些詞,並且我們通常想要標記某些詞作為重點或者表示某種程度上的不同。html 提供了許多語義化的元素,並且允許我們通過這些元素的意義標記正文內容,在這個章節中,我們將看到最常見的一小部分元素。

在html中我們可以使用em(emphasis)元素來標記這樣的情況,瀏覽器預設風格為斜體:

i am glad you weren't late.

在html中我們還可以使用(strong importance)元素來標記這樣的請況,瀏覽器預設風格為粗體:

this liquid ishighly toxic.

i am counting on you.do notbe late!

注意:為了不同的字型風格,我們應該使用元素和一些 css 的樣式。

前端學習Day4

一.css樣式表的權重 1.比喻 a.在公司 組長告訴你 本週加班7天。在公司 老闆告訴你 本週放假7天。有衝突b.在家 爺爺告訴你 抓緊娶媳婦 在家 爸爸告訴你 抓緊掙錢 有衝突c.老闆說 後天你休息 組長說 明天你工作 沒有衝突 2.樣式表的權重關係 a.內聯樣式表的權重最大。b.內部和外部樣式...

寒假前端學習day4

前幾天van遊戲惹。果然停一天就會導致停好幾天。下次還玩勇者海王星和向日葵教會qwq。表單form action填的是乙個伺服器啥啥的 method有post和get之分。成單標籤 屬性type number txt password url email txt 輸入文字,如賬號之類 number ...

WEB前端學習 Day4(定位)

乙個元素,如何讓它擺在自己想要的位置。就需要弄透css的定位相關的屬性。首先,乙個元素預設是按照文件流進行布局的,比如說三個div,它缺省會占用三行,三個span,它預設占用一行,當這一行不夠時,也會換行。這就是預設的文件流,每個元素根據自己的特性進行布局。有時候需要擺脫文件流,就需要特殊處理。現在...