Web前端開發(fā)技術(shù)項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.3知識點2CSS基本選擇器

CSS基本選擇器信息安全技術(shù)應用ApplicationofInformationSecurityTechnology《前端技術(shù)開發(fā)》前端技術(shù)開發(fā)知識儲備選擇器的概念1標記選擇器2類選擇器3ID選擇器401選擇器的概念前端技術(shù)開發(fā)選擇器的概念前端技術(shù)開發(fā)01CSS選擇器是用于在HTML文檔中實現(xiàn)一對一、一對多或多對一的控制，它決定了哪些元素將應用CSS樣式。選擇器可以根據(jù)元素的標簽名、類名、ID、屬性、層級關系等條件進行選擇。語法選擇器

{

屬性1:值1;屬性2:值2；

}每一條css樣式定義由兩部分組成，寫在<style></style>中，形式如下：h2{background-color:red;}p{font-size:30px;backgroud-color:gray;}02標記選擇器前端技術(shù)開發(fā)標記選擇器前端技術(shù)開發(fā)02CSS選擇器具有多種不同類型，從大類上分主要有“基本”選擇器和“復合”選擇器。CSS基本選擇器有標記選擇器、類選擇器和ID選擇器三種。調(diào)試CSS代碼，鼠標右鍵打開瀏覽器的“開發(fā)者工具”<spanid="local">當前位置：</span><span>首頁>2023年文化和自然遺產(chǎn)日?江蘇>文章詳情</span><h1>2023年“文化和自然遺產(chǎn)日”非遺宣傳展示活動啟動</h1><h3>發(fā)布時間：2023-06-09

來源：“文旅之聲”微信公眾號</h3>標記選擇器標記選擇器：span，h1，h3ID選擇器ID選擇器：#local標記選擇器前端技術(shù)開發(fā)02直接使用HTML標記名稱作為選擇器。對同一種HTML元素應用樣式。【實例】標記選擇器標記選擇器03類選擇器前端技術(shù)開發(fā)類選擇器前端技術(shù)開發(fā)03設置標記中的class屬性定義類別，將網(wǎng)頁元素進行分類，將某特定CSS樣式作用于這一類元素。類選擇器的書寫方式是在自定義類名稱的前面加一個句點“.”，即class屬性值前面加句點“.”。【實例】類選擇器類選擇器04ID選擇器前端技術(shù)開發(fā)ID選擇器前端技術(shù)開發(fā)04在HTML文檔中，需要唯一標識一個元素時，賦予它一個id標識，用來對這個元素定義單獨的樣式。先在元素中定義id屬性，后使用“#id屬性值”來定義CSS樣式。HTML代碼1<h1>我是一個1級標題<h1>2<h3>我是一個3級標題<h3>3<pid="pid">我是段落</p>4<p>我是段落</p>CSS代碼1#pid{2color:red;3font-size:24px;4}ID選擇器【實例】ID選擇器小結(jié)前端技術(shù)開發(fā)05(1)正確書寫CSS代碼

(2)學會使用三種基本選擇器標記選擇器p{font-size:30px;}類選擇器.important{color:red;}ID選擇器

#box1{color：red；}selector{property:value;property:v