html四种选择器的特点,css四种选择器总结
css 在網頁開發中扮演著重要的角色,被譽為網頁開發的三劍客,如果說html是人的外在器官部分,那css無疑是各個器官組成在一起然后表現出來,css又稱樣式重疊在網頁排版布局中的地位舉足輕重。
做為后端開發者來說,學好css樣式也是快速入門各類框架的基礎,也是做為一名全棧工程師必備的知 識,下面來說說css中重要的選擇器,
在css中常見的選擇器有四種常見,說到選擇器就不得不說css引入文件的常見的三種方法,1,內聯文件,2,外部文件,3.內嵌文件 ,其中三種常規的例子如下
1,借助link標簽來引入“外部文件“,href 則代表其路徑文件屬性
2,中則是"內嵌文件"在html /head 標簽下面 style之內
3.內聯在html代碼中被稱為"內聯文件"。
之所以講三種引入樣式文件方法,是因為他們與選擇器息息相關,
總結:1,不管哪一種方式,都得先找到 對應元素,對應id,對應class,或是全局通配,才能賦予其css樣式。
2,三種方式存在著優先級,內聯>內嵌>外部。
3,目前較為流行的是外部樣式。
1,在html代碼中標有 id=“***“時就是 id 選擇器,在css樣式中則用#號獲取該id
ps; 以#號做開始標志選中賦予其背景顏色黃色 說明#id具有唯一性,
1,在html代碼中標有 class=“***“時就是 class 選擇器,在css樣式中則用.號獲取該id
3,元素選擇器中 沒有class ,id 只有標簽的稱為元素 h1-6標簽? p 或 div span等 就是個元素
ps:元素之間可以相互找下級元素以逗分割;如下
這個樣式包含h1與div元素 都會被顯示黃色背景,h1與div之外的不會顯示
4,通配*用來做全局的適配常用來初始化:如下:
ps:全部設置背景顏色黃色
總結;在網頁排版中可以靈活運用以上四種常見的選擇器,繁衍出高級的選擇器。
前端基礎----CSS語法、CSS四種引入方式、CSS選擇器、CSS屬性操作
一.CSS語法 CSS 規則由兩個主要的部分構成:選擇器,以及一條或多條聲明. 例如: h1 {color:red; font-size:14px;} 二.CSS四種引入方式 1,行內式 行內式是在標 ...
css四種基本選擇器
css選擇器是什么? 要使用css對HTML頁面中的元素實現一對一,一對多或者多對一的控制,這就需要用到CSS選擇器. HTML頁面中的元素就是通過CSS選擇器進行控制的. CSS選擇器:就是指定CS ...
CSS四種定位及應用
定位(position) 如果,說浮動, 關鍵在一個 “浮” 字上面, 那么 我們的定位,關鍵在于一個 “位” 上. PS: 定位是我們CSS算是數一數二難點的了,但是,你務必要學好它,我們CSS離不 ...
css四種定位
概述:元素定位屬性主要包括的模式和邊偏移兩部分,也就是說以后定位要和邊偏移量搭配使用.邊偏移加定位定位模式才能構成一個完整的定義方式. 偏移量說明: 邊偏移屬性 描述 top: 頂端偏移,定義元素相對 ...
Css四種樣式
1. 2 3 4 5 6.
CSS 簡介、 選擇器、組合選擇器
#CSS 裝飾器引入
< ...CSS實現和選擇器
CSS實現和選擇器 本課內容: 一.實現CSS四種方式 1,每個html標簽中都有一個style樣式屬性,該屬性的值就是css代碼.(針對一個標簽)2,使用style標簽的方式. 一般都定義在head ...
CSS 引入方式 選擇器
---恢復內容開始--- CSS是Cascading Style Sheets的簡稱,中文稱為層疊樣式表,用來控制網頁數據的表現,可以使網頁的表現與數據內容分離. 步驟: A.找到標簽 B.操作標簽 ...
css的基本操作學習--css樣式,選擇器,hover,文字屬性,文本屬性,背景
什么是css? 通配符選擇器
/* *通配符選擇器 匹配任何元素 */ *{ margin: 0; padding: 0; } css樣式有三種 ...隨機推薦
如何搞定IE+google雙內核的360瀏覽器表單自動回填兼容問題
最近開發中碰到一個關于表單問題,在用戶提交表單時候瀏覽器會提示是否保存帳號 如果點擊保存,在退出帳號切換其他帳號時,瀏覽器會自動為表單填充數據,為了解決這個自動填充問題時, 主要分2個思路來解決,一個 ...
Linux(Ubuntu) Mysql的安裝配置例子以及常用命令
1.安裝配置例子 有空再寫 2.注意事項 (1)啟動mysql 在/etc/mysql 目錄下 service mysql start ?新版本是(service mysqld start ?) (2 ...
深入理解SELinux SEAndroid
參考文章: 一. http://blog.csdn.net/innost/article/details/19299937 二. http://blog.csdn.net/innost/article ...
Bootstrap系列 -- 21. 表單提示信息
平常在制作表單驗證時,要提供不同的提示信息.在Bootstrap框架中也提供了這樣的效果.使用了一個"help-block"樣式,將提示信息以塊狀顯示,并且顯示在控件底部. < ...
使用ASP.NET web API創建REST服務(三)
本文檔來源于:http://www.cnblogs.com/madyina/p/3390773.html Creating a REST service using ASP.NET Web API A ...
SQL Server Compact免安裝部署
原文:SQL Server Compact免安裝部署 情況 應用程序中的EF使用了SQL Server Compact,打包部署到客戶機器上后提示數據庫連接異常,信息類似”配置節“.”Provider ...
C#中如何使用IComparable<;T>;與IComparer<;T>;接口(轉載)
本分步指南描述如何使用兩個接口:?IComparer和IComparable.在同一篇文章中討論這些接口有兩個原因.經常在一起,使用這些接口和接口類似 (并且有相似的名稱),盡管它們用于不同用途. 如 ...
python服務器環境搭建(3)——參數配置
前面我們已安裝好了python服務器運行所需要的相關軟件,而最重要最繁瑣的就是參數配置,寫這篇就踩了好多坑,花了好多時間,遇到了各種各樣的問題.好了費話少說,直接進入本篇話題. PS:本人不是專業的運 ...
分頁查詢最好加排序(order by)
昨天,與外部化系統對接時,發現有一個數據一直咩有集成到,雙方各自排查了自己系統的代碼,都覺得邏輯非常簡單,無法就是一個分頁查詢而已. 問題就出在這個分頁查詢上. 為了說明當時問題發生的情景,我模擬了一 ...
總結
以上是生活随笔為你收集整理的html四种选择器的特点,css四种选择器总结的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 简谐振动的能量与合成(大学物理笔记)
- 下一篇: JMeter Linux下执行测试