css 選擇符

来源:http://www.cnblogs.com/cyn941105/archive/2016/06/16/5590106.html
-Advertisement-
Play Games

常用選擇符的介紹 通配選擇符指選定文檔對象模型(DOM)中的所有類型的單個對象。 *{css代碼規則},其中*表示所有類型,包含body,div,td等 類型選擇符指以文檔對象模型(DOM)作為選擇符,即選擇某個html標記為對象,設置樣式規則。 P{ } Div{ } 包含選擇符 對某個容器層的子 ...


常用選擇符的介紹


通配選擇符
指選定文檔對象模型(DOM)中的所有類型的單個對象。

*{css代碼規則},其中*表示所有類型,包含body,div,td等

類型選擇符指以文檔對象模型(DOM)作為選擇符,即選擇某個html標記為對象,設置樣式規則。

P{

}

Div{

}

包含選擇符 對某個容器層的子層控制,是其他同名的對象不受該規則影響,包含選擇符對象要依次選擇出對象,從大到小,即從容器層到子層。

E1  E2

{

}

E1指父層對象,E2指小點的層或子層對象,即E1對象包含E2對象

eg:

     table td

 

{

}

td  p

{

}

佈局常用選擇符:

ID選擇符 指在DOM中用惟一標識符的ID為選擇符,ID標識符以“#”打頭,其後接ID名,註意ID標識符不能在樣式中出現兩次或兩次以上,如果出現,系統會以第一次出現的為準,其他的將被忽略。

類選擇符又叫作class選擇符,表示一個類可以在文檔中使用多次

    以“.”打頭,後接class名

註意:類選擇符和類型選擇符的不同——類型是指html中的標記

分組選擇符 指對多個標記設置同樣的樣式,在不同的類型中,表示同樣的樣式。將選擇符以逗號分隔的方式併為組

Html,body

{

}

 

以下用表格對以上內容進行總結

選擇符 表達方式 例子 含義
通配選擇符 *{css代碼規則} *{css代碼規則} *表示所有類型,包含body,div,td等
類型選擇符 以文檔對象模型(DOM)作為選擇符

P{  }

Div{  }

選擇某個html標記為對象,設置樣式規則
包含選擇符  

E1  E2

{

 }

E1指父層對象,E2指小點的層或子層對象,即E1對象包含E2對象
ID選擇符 以“#”打頭,其後接ID名    
類選擇符 以“.”打頭,後接class名    

分組選擇符 

 將選擇符以逗號分隔的方式併為組  

Html,body

{

}

 對多個標記設置同樣的樣式,在不同的類型中,表示同樣的樣式

 

 


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

-Advertisement-
Play Games
更多相關文章
  • 在之前項目後臺管理界面開發中,不知道有layer這樣好用的組件,我的內心是這樣的的。。。呀!這個框架有彈框,哈哈哈,好開心,不用自己寫遮罩層,不用自己寫彈框,好開森。。 當知道有layer之後。。。。。這麼方便,這麼人性化,好漂亮,哇哦,好簡單。。。 或許我這人看到新鮮的東西都叫好吧,不好的暫時沒發 ...
  • [1]一元加 [2]一元減 [3]遞增 [4]遞減 [5]加法 [6]減法 [7]乘法 [8]除法 [9]求餘 ...
  • 我們知道,JavaScript中檢測對象類型的運算符有:typeof、instanceof,還有對象的constructor屬性: 1) typeof 運算符 typeof 是一元運算符,返回結果是一個說明運算數類型的字元串。如:"number","string","boolean","object ...
  • div+css3實現漂亮的多動畫彩標簽雲,滑鼠移動會有動畫 點擊運行效果 ...
  • 因為我是前端剛入門,昨天看了一個大神寫的的初級前端需要掌握的知識,然後我就開始一一搜索,下麵是我對css預處理器和後處理器的搜索結果,一是和大家分享下這方面的知識,另一方面方便自己以後翻閱。所以感興趣的可以看下。 轉載自"趙雷的博客",原文地址:http://zhaolei.info/2014/01 ...
  • 今天要跟大家談的是事件冒泡,這個事件呢,也是兩面性的,有時候給我們帶來bug,有時候優點也很明顯。我們就一起來看看它的真面目。 首先看看事件冒泡是什麼? 事件冒泡 :當一個元素接收到事件的時候 會把他接收到的事件傳給自己的父級,一直到window 。(註意這裡傳遞的僅僅是事件 並不傳遞所綁定的事件函 ...
  • 1.Class類的介紹 在ES6中新增了Class類的概念,讓語法看起來更像是面向對象編程,其實這可以說是一個語法糖,ES5可以做到Class絕大部分功能,但也有一些不同。在ES6以前,可以通過構造函數來模擬類的概念,如下所示 在引入了Class關鍵字後,可以這樣做,如下所示 如上所示,便是ES6中 ...
  • 彈出層在網頁開發中經常用到,以前都是百度一下複製粘貼,從來沒有仔細看過也沒有理解原理. 直到有一天沒有網路,,,然後突然就想到了.這麼簡單為什麼會複製粘貼這麼久.總結如下: 1、有個大的div背景設個透明度opacity:0.5;filter:alpha(opacity=57),來個absolute ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...