HTML連載20-並集選擇器&兄弟選擇器

来源:https://www.cnblogs.com/ruigege0000/archive/2019/07/07/11144828.html
-Advertisement-
Play Games

一、並集選擇器 1.作用:給所有的選擇器選中的標簽設置屬性。 2.格式: 3.例如: 4.註:支持多個標簽取並集,中間用逗號連接就行。上一節中交集選擇器也可以取多個交集 二、兄弟選擇器 1.相鄰兄弟選擇器 (1)定義:給指定選擇器後面緊跟的那個選擇器選中的標簽設置屬性。 (2)格式: (3)例子: ...


一、並集選擇器

1.作用:給所有的選擇器選中的標簽設置屬性。

2.格式:

 

選擇器1,選擇器2{

      屬性:值;

}

 

 

3.例如:

 

        .abc1,#abc2{

            color:red;

        }

.......省略代碼.......

<p class="abc1">並集1</p>

<p id="abc2">並集2</p>

 

 

4.註:支持多個標簽取並集,中間用逗號連接就行。上一節中交集選擇器也可以取多個交集

二、兄弟選擇器

1.相鄰兄弟選擇器

(1)定義:給指定選擇器後面緊跟的那個選擇器選中的標簽設置屬性。

(2)格式:

 

標簽1+標簽2{

                    屬性:值;

 

                    }

 

 

(3)例子:

 

        h1+p{

            color:red;

.......省略代碼.......

<h1>我是標題1</h1>

<p>我是段落1</p>

<p>我是段落2</p>

<p>我是段落3</p>

<h1>我是標題2</h1>

<p>我是標題5</p>

<p>我是標題6</p>

<p>我是標題7</p>

 

(4)註意點:相鄰兄弟選擇器只能選中緊跟後面的那個標簽;

如果選擇多個,也就是多個選擇器用加號相鄰,則最後一個會生效,前提是按順序寫,別跳過標簽,例如

 

h1+p+p+p+a{

    color:red;

}

.......省略代碼.......

<h1>我是標題1</h1>

<p>我是段落1</p>

<p>我是段落2</p>

<p>我是段落3</p>

2.通用兄弟選擇器

(1)定義:給指定選擇器後面的所有選擇器選中的所有標簽設置屬性。

(2)格式:

 

選擇器1~選擇器2{

    屬性:值;

}

 

 

(3)舉例:

 

    h2~p{

            color:blue;

        }

.......省略代碼.......       

<h2>我是標題3</h2>

<a href="#">我來阻擋1</a>

<p>我是段落8</p>

<p>我是段落9</p>

<p>我是段落10</p>

<a href="#">我來阻擋2</a>

 

 

(4)註:後面的p標簽全都生效了,即使有其他標簽阻擋也沒事

三、源碼:​

d75_union_selectord76_brother_selector

地址:

https://github.com/ruigege66/HTML_learning/tree/master

2.CSDN:https://blog.csdn.net/weixin_44630050(心悅君兮君不知-睿)

3.博客園:https://www.cnblogs.com/ruigege0000/

4.歡迎關註微信公眾號:傅里葉變換,後臺回覆“禮包”獲取Java大數據學習視頻禮包


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • mysql 安裝與基本管理 [TOC] MySQL介紹 mysql是什麼 資料庫管理軟體分類 下載安裝 Linux版本 源碼安裝mariadb Window版本 上一步解決了一些問題,但不夠徹底,因為在執行【mysqd】啟動MySQL伺服器時,當前終端會被hang住,那麼做一下設置即可解決此問題,即 ...
  • Mysql數據簡單入門 [TOC] 資料庫管理系統 DBMS 什麼是資料庫? 資料庫優點? 資料庫的優勢? 資料庫運行示意圖 專業名詞: DBMS 資料庫管理系統 (英語:Database Management System) 數據 data 文件夾 資料庫database 簡稱db 資料庫管理員 ...
  • ''' SELECT a.id, substring_index(substring_index(a.bill_ids, ',', b.id), ',', 1) bill_ids, a.status, a.card_name FROM (SELECT id, bill_ids,status,card ...
  • 在Redis上,可以通過對key值的獨占來實現分散式鎖,錶面上看,Redis可以簡單快捷通過set key這一獨占的方式來實現分散式鎖,也有許多重覆性輪子,但實際情況並非如此。總得來說,Redis實現分散式鎖,如何確保鎖資源的安全&及時釋放,是Redis實現分散式鎖的最關鍵因素。如下逐層分析Redi ...
  • Mysql將欄位用逗號拼接、分割,行轉列/列轉行/兩表間複製數據/生成不同位數的隨機數 ...
  • QSqlDatabase 使用靜態方法addDatabase來創建一個資料庫連接。 如果你的程式中只有一個資料庫連接,可以使用如下語句創建連接 QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE"); 如果你的程式要處理多個資料庫連接,那麼就使用 ...
  • 1. select * from my_table limit 10 offset 5 數據是從第0條開始的,所以這句代碼表示從 第六條數據開始的10行數據。 2. select * from my_table limit 10 不帶 offset 時,表示查詢10條數據。 ...
  • 利用windows的cmd命令備份導出數據(也可以連接上sqlplus進行操作)--導出--將資料庫orcl完全導出 exp system/oracle@orcl file=c:\oracle_bak\orcl_bak.dmp full=y --將資料庫中scott用戶的所有對象導出 exp sco ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...