從符號學(xué)的角度來看Html/CSS中的示例分析

小編給大家分享一下從符號學(xué)的角度來看Html/CSS中的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

CSS的好處是：HTML元素可以在不依賴class屬性的情況下實現(xiàn)各種風(fēng)格的樣式化，文章試圖證明class屬性是過時的，不適合于布局，不用class可以訓(xùn)練我們創(chuàng)建更多可用，可重用的內(nèi)容。

如果同一類型的兩個元素屬于出現(xiàn)在相同的上下文中，則它們是相似的 ，怎么辦？

索緒爾對語言作為一個系統(tǒng)的理解基于兩種基本關(guān)系; 范式和語段(聚合關(guān)系和組合關(guān)系):

范式

范式是是一組詞 ，具有功能相似性但在含義上有細微或根本的差異。比如“螃蟹位于龍蝦旁邊”，“位于”這個詞屬于一種替代詞的范式，還可以代指包括“休息于”和“蹲伏于”以及“站立于”，這是一種替代關(guān)系。

在英語中替換有一定的規(guī)則，動詞不能用名詞替換，就像在HTML中一樣，內(nèi)聯(lián)元素(表示內(nèi)聯(lián)這樣的動作動詞)不能總是用塊級元素（名詞）替換。

語段

一個語段基本上是一個由范式選擇組成的結(jié)構(gòu)段。在英語中，句子，段落，章節(jié)和書籍都是語段。在HTML中，由您選擇的元素組成的代碼塊可以被視為一種語段。

每個語段都有自己的語義系統(tǒng)，較小的語段可以屬于較大的語段系統(tǒng)，就像一個段落可以屬于一個章節(jié)，

用處？

索緒爾的語言模型可以識別或?qū)懗鰯?shù)TB的小說，小說，散文和戲劇，不必發(fā)明新詞或重新定義舊詞。如果這個模型對于諸如英語之類的自然語言來說已經(jīng)足夠好了，那么它對于諸如HTML之類的簡單元語言來說已經(jīng)足夠好了。當(dāng)然，隨著時間的推移，新詞會被創(chuàng)造出來，就像HTML規(guī)范中慢慢引入新元素一樣，但這是通過仔細的審議和共識來完成的。class沒有這樣的授權(quán)過程。

索緒爾模型為我們提供了足夠的優(yōu)雅和發(fā)明空間，并禁止我們做出錯誤的選擇。通過根據(jù)它們的內(nèi)容和位置what and where來構(gòu)造元素的樣式從而組成我們文檔，那么現(xiàn)在誤導(dǎo)或混淆用戶就變得極其困難，我們所做的只是使用CSS來顯示頁面的固有結(jié)構(gòu)。

語境的重要性

從符號學(xué)的角度來看，也許兩個相似的事物之間唯一真正的區(qū)別在于它們的背景：它們被發(fā)現(xiàn)的環(huán)境。英國本土人和法國本地人在基因上相似但在文化上有所不同。他們的國籍背景使他們以許多值得注意的方式不相同。

下面這段Html/CSS:

<font><i>// HTML:</i></font><font>

<article>
   <h2 <b>class</b>=</font><font>"main-title"</font><font>>Article Title</h2>
   <aside>
      <h2 <b>class</b>=</font><font>"main-title"</font><font>>Aside Title</h2>
   </aside>
</article>

</font><font><i>// CSS:</i></font><font>
.main-title {
   font-size:30px;
}
</font>

創(chuàng)造class類型為.main-title，我們創(chuàng)建了一個翻譯器來幫助我們輕松地為所有頂級標題設(shè)置相似的樣式。但是，我們示例中的兩個標題h2并不相似，任何理解HTML5解析器的人都會知道，有一個標題h2屬于aside組合，而另外一個標題h2直接屬于article內(nèi)，這兩種關(guān)系哪個最重要？

直接屬于article:
 

<article>
   <h2 <b>class</b>=<font>"main-title"</font><font>>Article Title</h2>
</font>

直接屬于aside, aside屬于article:

<article>
   <h2 <b>class</b>=<font>"main-title"</font><font>>Article Title</h2>
   <aside>
      <h2 <b>class</b>=</font><font>"main-title"</font><font>>Aside Title</h2>
</font>

解析器將把aside的h2標題視為僅僅是副標題，屬于第一個標題之后的副標題。

這個例子中的class是多余的：我們可以使用h2 style屬性來設(shè)置元素的樣式如font-size: 30px。關(guān)鍵是如果我們根據(jù)上下文區(qū)分這兩個元素，那么區(qū)分上下文的辦法是使用 派生選擇器 ：aside h2，那么CSS將綁定到HTML的結(jié)構(gòu)(aside h2是一種結(jié)構(gòu)，h2屬于小語段，aside屬于大語段，h2小語段被包含在大語段aside中)，并且元素的外觀將與其計算的含義一致。

模塊化和可移植性

使用Class屬性的方法其實是一種面向?qū)ο蠓椒?，面向?qū)ο蟮姆椒ㄊ窍胱屢粋€元素在任何地方都看起來一樣，不受環(huán)境背景的影響，這如同一個英國人移民到其他國家，拒絕說當(dāng)?shù)卣Z言，這是不恰當(dāng)?shù)摹?/p>

我不認為CSS是面向?qū)ο蟮? 我認為它是面向接口的。CSS的目的不是讓單個項目看起來像我們想要的那樣，而是提供一個接口來樣式化HTML文檔，這些接口具有說服力和可讀性。為了使接口具有最佳可理解性，所有組件應(yīng)該禮貌地協(xié)同工作，并且應(yīng)該尊重整體視覺結(jié)構(gòu)，無論組件來自何處。

簡而言之，我們的目標應(yīng)該是真正區(qū)分樣式和內(nèi)容，允許內(nèi)容在不同樣式界面接口之間傳播，但樣式界面仍然不動。在任何格式正確的文檔中，屬性應(yīng)該是表達內(nèi)容來源的(class作為元素屬性卻不是表達內(nèi)容來源，而是表達內(nèi)容來源的類型)。

以上是“從符號學(xué)的角度來看Html/CSS中的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！