2.css簡介

什么是css:
CSS (Cascading Style Sheets,層疊樣式表),是一種用來為結構化文檔(如 HTML 文檔或 XML 應用)添加樣式(字體、間距和顏色等)的計算機語言,CSS 文件擴展名為 .css。
通過使用 CSS 我們可以大大提升網頁開發的工作效率!
在我們的 CSS 教程中,您會學到如何使用 CSS 同時控制多重網頁的樣式和布局。

樣式表定義如何顯示 HTML 元素,就像 HTML 中的字體標簽和顏色屬性所起的作用那樣。樣式通常保存在外部的 .css 文件中。我們只需要編輯一個簡單的 CSS 文檔就可以改變所有頁面的布局和外觀。

CSS 規則由兩個主要的部分構成:選擇器,以及一條或多條聲明:
在這里插入圖片描述
選擇器通常是您需要改變樣式的 HTML 元素。
每條聲明由一個屬性和一個值組成。
屬性(property)是您希望設置的樣式屬性(style attribute)。每個屬性有一個值。屬性和值被冒號分開。

實例
/*這是個注釋*/
p
{/*這是另一個注釋*/color:red;text-align:center;
}

id 和 class 選擇器
如果你要在HTML元素中設置CSS樣式,你需要在元素中設置"id" 和 "class"選擇器。

id 選擇器
id 選擇器可以為標有特定 id 的 HTML 元素指定特定的樣式。
HTML元素以id屬性來設置id選擇器,CSS 中 id 選擇器以 “#” 來定義。
以下的樣式規則應用于元素屬性 id=“para1”:

#para1
{text-align:center;color:red;
}

ID屬性不要以數字開頭,數字開頭的ID在 Mozilla/Firefox 瀏覽器中不起作用。

class 選擇器
class 選擇器用于描述一組元素的樣式,class 選擇器有別于id選擇器,class可以在多個元素中使用。
class 選擇器在 HTML 中以 class 屬性表示, 在 CSS 中,類選擇器以一個點 . 號顯示:
在以下的例子中,所有擁有 center 類的 HTML 元素均為居中。

.center {text-align:center;}

類名的第一個字符不能使用數字!它無法在 Mozilla 或 Firefox 中起作用。

外部樣式表
當樣式需要應用于很多頁面時,外部樣式表將是理想的選擇。在使用外部樣式表的情況下,你可以通過改變一個文件來改變整個站點的外觀。每個頁面使用 標簽鏈接到樣式表。 標簽在(文檔的)頭部:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/896874.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/896874.shtml
英文地址,請注明出處:http://en.pswp.cn/news/896874.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

機器人學習模擬框架 robosuite (3) 機器人控制代碼示例

Robosuite框架是一個用于機器人模擬和控制的強大工具&#xff0c;支持多種類型的機器人。 官方文檔&#xff1a;Overview — robosuite 1.5 documentation 開源地址&#xff1a;https://github.com/ARISE-Initiative/robosuite 目錄 1、通過鍵盤或SpaceMouse遠程控制機器人…

可終身授權的外國工具,不限次數使用!PDF轉CAD的軟件

最近有不少朋友問我有沒有好用的CAD轉換工具&#xff0c;今天就來給大家分享兩款超實用的小軟件&#xff0c;希望能幫到大家。 第一款軟件是一款國外開發的&#xff0c;它專門用來把PDF文件轉換成CAD格式&#xff0c;特別方便。 這款軟件的操作非常簡單&#xff0c;打開后無需安…

Ubuntu系統上部署Node.js項目的完整流程

以下是在Ubuntu系統上部署Node.js項目的完整流程&#xff0c;分為系統初始化、環境配置、項目部署三個部分&#xff1a; 一、系統初始化 & 環境準備 bash # 1. 更新系統軟件包 sudo apt update && sudo apt upgrade -y# 2. 安裝基礎工具 sudo apt install -y buil…

Android內存優化指南:從數據結構到5R法則的全面策略

目錄 一、APP 內存限制 二、內存的三大問題 2.1、內存抖動(Memory Churn) 2.1.1 頻繁創建短生命周期對象 2.1.2 系統API或第三方庫的不合理使用 2.1.3 Handler使用不當 2.2、內存泄漏(Memory Leak) 2.2.1 靜態變量持有Activity或Context引用 2.2.2 未取消的回調或…

ffmpeg源碼編譯支持cuda

1.安裝cuda CUDA Toolkit 11.3 Downloads | NVIDIA Developer 在選擇組件的時候&#xff0c;將CUDA中的Nsight VSE和Visual Studio Integration取消勾選 不然會安裝失敗 2.編譯ffmpeg 把cuda編譯宏定義開啟&#xff0c;再編譯avcodec 3.編譯livavutil報錯struct "Cuda…

Git強制覆蓋分支:將任意分支完全恢復為main分支內容

Git強制覆蓋分支&#xff1a;將任意分支完全恢復為main分支內容 場景背景完整操作步驟一、前置準備二、操作流程步驟 1&#xff1a;更新本地 main 分支步驟 2&#xff1a;強制重置目標分支步驟 3&#xff1a;強制推送至遠程倉庫 三、操作示意圖 關鍵風險提示&#xff08;必讀&a…

【Java反序列化測試】

Java反序列化測試 1. 識別反序列化入口點2. 構造探測Payload3. 發送Payload并觀察結果4. 繞過可能的防護5. 自動化工具注意事項總結 Java反序列化測試&#xff1a; 1. 識別反序列化入口點 常見入口&#xff1a; HTTP請求參數&#xff08;如POST數據、Cookie、Headers&#xff…

golang的io

https://www.bilibili.com/list/BV1gx4y1r7xb 1. 原生io包 io包是Go語言標準庫中底層的I/O接口層&#xff0c;定義了通用的讀寫規則和錯誤處理邏輯。每次讀寫都是直接調用底層系統 I/O&#xff0c;每次讀取1字節&#xff0c;系統調用次數多。適用于小數據量、實時性要求高。io…

【北京迅為】iTOP-RK3568OpenHarmony系統南向驅動開發-第4章 UART基礎知識

瑞芯微RK3568芯片是一款定位中高端的通用型SOC&#xff0c;采用22nm制程工藝&#xff0c;搭載一顆四核Cortex-A55處理器和Mali G52 2EE 圖形處理器。RK3568 支持4K 解碼和 1080P 編碼&#xff0c;支持SATA/PCIE/USB3.0 外圍接口。RK3568內置獨立NPU&#xff0c;可用于輕量級人工…

【計算機網絡入門】初學計算機網絡(十)(重要)

目錄 1. 網絡層的作用 2. IPV4 2.1 IP 數據報格式 2.2 IP地址分類方案 2.3 數據的轉發 2.4 特殊用途的IP地址 3. 子網劃分和子網掩碼 3.1 子網劃分 3.2 子網掩碼 1. 網絡層的作用 按照教學五層模型&#xff0c;應用層、傳輸層、網絡層、數據鏈路層、物理層&#xff…

機器學習(五)

一&#xff0c;多類&#xff08;Multiclass&#xff09; 多類是指輸出不止有兩個輸出標簽&#xff0c;想要對多個種類進行分類。 Softmax回歸算法&#xff1a; Softmax回歸算法是Logistic回歸在多類問題上的推廣&#xff0c;和線性回歸一樣&#xff0c;將輸入的特征與權重進行…

基于 Vue 和 SSM 的前后端分離項目實戰:登錄與注冊功能實現

文章目錄 前言項目概述前端部分&#xff08;Vue&#xff09;1. 項目初始化2. 頁面布局Login.vueRegister.vue 3. 路由配置4. 主組件 后端部分&#xff08;SSM&#xff09;1. 項目結構2. 數據庫設計3. MyBatis 配置4. DAO 層5. Service 層6. Controller 層7. 配置文件8. Spring …

Windows安裝nvm【超詳細圖解】

目錄 前言 一、NVM下載 方式一&#xff1a;官網下載 方式二&#xff1a;GitHub 下載 二、NVM安裝 鏡像源配置 三、Node安裝 四、環境變量配置 前言 NVM&#xff08;Node Version Manager&#xff09;是一個命令行工具&#xff0c;用于在一臺計算機上輕松管理和切換多…

KVM虛擬機磁盤創建探究-2

使用 virt-install 命令自動創建磁盤鏡像和使用 qemu-img 手動創建磁盤鏡像&#xff0c;在磁盤鏡像本身格式和基本功能上是一致的&#xff0c;但在一些特性如初始占用磁盤空間、創建時的可配置性等方面存在區別&#xff0c;下面以 QCOW2 格式磁盤鏡像為例進行詳細說明。 初始占…

京準電鐘:NTP校時服務器于安防監控系統應用方案

京準電鐘&#xff1a;NTP校時服務器于安防監控系統應用方案 京準電鐘&#xff1a;NTP校時服務器于安防監控系統應用方案 NTP校時服務器在安防監控系統中的應用方案主要通過高精度時間同步技術&#xff0c;解決設備間時間差異問題&#xff0c;確保日志、錄像等數據的時間一致性…

遞歸遍歷目錄 和 普通文件的復制 [Java EE]

遞歸遍歷目錄 首先 先列出當前目錄所包含的內容 File[] files currentDir.listFiles();if (files null || files.length 0) {// 若是空目錄或非法目錄, 則直接返回return;} 然后 遍歷列出的文件, 分情況兩種討論 for (File f: files) {// 加個日志, 方便查看程序執行情…

NO.19十六屆藍橋杯模擬賽第三期上

1 如果一個數 p 是個質數&#xff0c;同時又是整數 a 的約數&#xff0c;則 p 稱為 a 的一個質因數。 請問&#xff0c; 2024 的最大的質因數是多少&#xff1f; 答&#xff1a;23 #include <bits/stdc.h> using namespace std;int main() {ios::sync_with_stdio(false)…

Linux網絡_應用層自定義協議與序列化_守護進程

一.協議 協議是一種 "約定". socket api 的接口, 在讀寫數據時, 都是按 "字符串" 的方式來發送接 收的. 如果我們要傳輸一些 "結構化的數據" 怎么辦呢? 其實&#xff0c;協議就是雙方約定好的結構化的數據 像下面&#xff0c;兩端都知道數據結構…

SQL命令詳解之多表查詢(連接查詢)

目錄 1 簡介 2 內連接查詢 2.1 內連接語法 2.2 內連接練習 3 外連接查詢 3.1 外連接語法 3.2 外連接練習 4 總結 1 簡介 連接的本質就是把各個表中的記錄都取出來依次匹配的組合加入結果集并返回給用戶。我們把 t1 和 t2 兩個表連接起來的過程如下圖所示&#xff1a; …

001-碼云操作

碼云操作 一、配置公鑰1.官網地址1.進入 git bash2.查看生成的公鑰3.設置到 Gitee4.測試 二、初始化一個項目1.新建倉庫 一、配置公鑰 方便后續提交代碼不用填寫密碼 1.官網地址 官網地址&#xff1a;https://gitee.com/Git碼云教程&#xff1a;https://gitee.com/help/arti…