摘要:的繼承的繼承指的是當(dāng)標(biāo)簽具有嵌套關(guān)系時,內(nèi)部標(biāo)簽自動擁有外部標(biāo)簽的不沖突的樣式的性質(zhì)。多邊框類的屬性都沒有繼承,例如,等。
CSS的繼承
css的繼承指的是當(dāng)標(biāo)簽具有嵌套關(guān)系時,內(nèi)部標(biāo)簽自動擁有外部標(biāo)簽的不沖突的樣式的性質(zhì)。
在Css中有些屬性不允許繼承,例如,border屬性沒有繼承性。多邊框類的屬性都沒有繼承 ,例如,padding 、 margin 、 background等。
示例:
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta content="text/css" charset="GB2312">
<title>css使用實例title>
<style type="text/css" >
div{
color: red;
font-size: 10pt;
font-weight: bold;
font-family: 黑體;
border: 1px solid #000;
}
p{
color: blue;
font-size: 12pt;
font-style: italic;
}
em{
color: green;
}
style>
head>
<body>
<p>這是藍(lán)色,12pt,斜體,默認(rèn)宋體p>
<div>
<p>這是藍(lán)色,12pt,斜體加粗,黑體p>
div>
<br>
<div>這是紅色,10pt,加粗,黑體,有邊框div><br>
<div>
這是紅色,10pt,黑體<br>
<em>我是em元素的文字,綠色文字周邊無邊框em>
div>
body>
html>
?
?
CSS的使用方式
在html頁面中使用CSS主要有3種方法:內(nèi)嵌方式,內(nèi)部樣式表,使用標(biāo)簽鏈接外部樣式表。
1.內(nèi)嵌方式(是將CSS代碼寫在HTML的標(biāo)簽里。)
示例:
DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>內(nèi)嵌方式title>
head>
<body>
<p align="center" style="color: red;">內(nèi)嵌方式p>
body>
html>
2.內(nèi)部樣式表
與行間樣式表類似,都是將CSS代碼寫在HTML文檔中; 不同的是內(nèi)部樣式表不是寫在標(biāo)簽中,而且有一定的格式。
示例:
DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>內(nèi)部樣式表示例title>
<style type="text/css">
div{
width: 100px;
height: 40px;
color: yellow;
background-color: red;
text-align: center;
}
style>
head>
<body>
<div>內(nèi)部樣式表div>
body>
html>
3.使用標(biāo)簽鏈接外部樣式表
與內(nèi)部樣式表的相同之處在于都有一定的格式; 不同的是他的CSS代碼是寫在HTML文檔外的.css文件中,而且使用時需要引用。
實例:
html1.html
DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>外部樣式表示例title>
<link rel="stylesheet" href="css/css1.css" />
head>
<body>
<div>外部樣式表div>
body>
html>
CSS1.css
div {
width: 100px;
height: 40px;
color: yellow;
background-color: red;
text-align: center;
}
?
?
?
?
?
?
特此聲明:如需轉(zhuǎn)載請注明出處,如有疑問請及時提出以便于改正,如有侵權(quán),聯(lián)系刪除,謝謝
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/1696.html
摘要:在中,你可以像俄羅斯套娃那樣在規(guī)則塊中嵌套規(guī)則塊。這個過程中,用了兩步,每一步都是像打開俄羅斯套娃那樣把里邊的嵌套規(guī)則塊一個個打開。與此類似,會命中元素和類名為的元素。這種選擇器稱為群組選擇器。1. 使用變量; sass讓人們受益的一個重要特性就是它為css引入了變量。你可以把反復(fù)使用的css屬性值 定義成變量,然后通過變量名來引用它們,而無需重復(fù)書寫這一屬性值?;蛘撸瑢τ趦H使用過一 次的屬...
摘要:區(qū)別在于,類是在中運用的,混合器是在樣式表中使用的。基本用法選擇器繼承,用去繼承一個選擇器定義的所有樣式。繼承背后的基本實現(xiàn)思路背后最基本的想法是,如果繼承了,那么樣式表中的任何一處選擇器都會用這一選擇器組進(jìn)行替換和打開。 上一篇詳述了Sass如何嵌套、導(dǎo)入和注釋這3個基本方式來保持條理性和可讀性,這一篇更進(jìn)一步地闡述sass保持樣式復(fù)用和簡潔的方式——混合器和選擇器繼承——這兩種方式...
摘要:類選擇器具有更高的專用性,所以將戰(zhàn)勝元素選擇器。個位在整個選擇器中每包含一個元素選擇器或偽元素就在該列中加分。選擇器六明顯地輸給了了五,其專用性值為和它在鏈中少了一個元素選擇器。當(dāng)有多個選擇器作用在一個元素上時,哪個規(guī)則最終會應(yīng)用到元素上? 其實這是通過層疊機制來控制的,這也和樣式繼承(元素從其父元素那里獲得屬性值)有關(guān)。 元素的最終樣式可以在多個地方定義,它們以復(fù)雜的形式相互影響。這些復(fù)雜...
摘要:相反的,提供了全局作用域和局部作用域。組成界面的分子的樣式可以通過元素選擇器定位。元素選擇器的優(yōu)先級很低,因此他們不會覆蓋任何基于類選擇器的樣式。使用元素選擇器有以下優(yōu)點避免了的冗長沒有冗余的類。 最近學(xué)習(xí)到CSS的繼承屬性,正好看到這篇文章,便將它翻譯出來。作者的思想,在平時的項目中或多或少都有用過,但是從來沒有仔細(xì)去思考如何利用這些特性讓代碼更加優(yōu)雅。 我熱愛模塊化設(shè)計。長期以來,...
閱讀 3395·2021-10-13 09:40
閱讀 2619·2021-10-08 10:17
閱讀 4030·2021-09-28 09:45
閱讀 960·2021-09-28 09:35
閱讀 1846·2019-08-30 10:51
閱讀 2931·2019-08-26 12:11
閱讀 1677·2019-08-26 10:41
閱讀 3120·2019-08-23 17:10