【代碼筆記】Web-CSS-CSS偽類

来源:https://www.cnblogs.com/yang-guang-girl/archive/2020/07/23/13364312.html

一,效果圖。 二,代碼。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS 偽類</title> <style> a:link { color: #FF0000; } /* unvisited link */ a:visi ...


一,效果圖。

 

二,代碼。

 

複製代碼
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS 偽類</title>
    <style>
    a:link {
        color: #FF0000;
    }
    /* unvisited link */
    
    a:visited {
        color: #00FF00;
    }
    /* visited link */
    
    a:hover {
        color: #FF00FF;
    }
    /* mouse over link */
    
    a:active {
        color: #0000FF;
    }
    /* selected link */
    
    p:first-child {
        color: blue;
    }
    
    p>i:first-child {
        color: blue;
    }
    
    q:lang(no) {
        quotes: "~" "~";
    }
    </style>
</head>

<body>
    <p><b><a href="/css/" target="_blank">這是一個鏈接</a></b></p>
    <p><b>註意:</b> a:hover 必須在 a:link 和 a:visited 之後,需要嚴格按順序才能看到效果。</p>
    <p><b>註意:</b> a:active 必須在 a:hover 之後。</p>
    <p>This is some text.</p>
    <p>This is some text.</p>
    <p><b>Note:</b> For :first-child to work in IE8 and earlier, a DOCTYPE must be declared.</p>
    <p>I am a <i>strong</i> man.I am a <i>strong</i>man.</p>
    <p>I am a <i>string</i> man.I am a <i>strong</i>man.</p>
    <p><b>Note:</b>For:first-child to work in IE8 and earlier,a DOCTYPE must be declared.</p>
    <p>Some text
        <q lang="no">A quote in a paragraph</q> Some text.</p>
    <p>In this example, :lang defines the quotation marks for q elements with lang="no":</p>
    <p><b>Note:</b> IE8 supports the :lang pseudo class only if a !DOCTYPE is specified.</p>
</body>

</html>
複製代碼

 

參考資料:《菜鳥教程》


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

更多相關文章
  • 微信端返回按鈕 WeixinJSBridge.call('closeWindow'); $("#close").click(function(){ setTimeout(function(){WeixinJSBridge.call('closeWindow');},1000); }) ...
  • BOM(瀏覽器對象模型)簡介、window對象、location對象、history對象、navigator對象、screen對象、document對象 ...
  • 效果圖看左上角 代碼如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>基於CSS3的3D立方體旋轉動畫</title> <style> /* 3d旋轉樣式 */ .cub { width: 2.5rem; height: ...
  • 最近工作中用到了jQuery UI中排序和拖拽功能,花了大概一天的時間,搞清楚了大概的參數配置,以及遇到的一些問題,總結如下。 sortable 簡單的配置如下: $('#subs-box').sortable({ axis: 'y', cursor: 'ns-resize', placeholde ...
  • 室內地圖製作經過易景空間地圖團隊的持續優化迭代,新版本地圖編輯器中的畫圓柱體、模型庫、快速畫道路、房間直接換紋理貼圖等功能終於上線了,目前市面上一款無需安裝軟體就能直接使用瀏覽器訪問的線上室內地圖製作編輯器。 ...
  • 摘要 重裝電腦系統後,使用npm install初始化項目依賴失敗了,錯誤提示:'proxy' config is set properly..........,具體的錯誤提示如下圖所示: 解決方案 經過報錯信息查詢解決辦法,最終找到了兩個比較好的方案,在此總結一下,以便下次再遇到此類問題。 方案一 ...
  • 引入Javascript的發展史 JavaScript的基本語法篇 1.與HTML結合的方式 2.0 註釋與數據類型 3.0 變數 4.0 運算符 (1)一元運算符 (2)比較運算符 (3)邏輯運算符 (4)三元運算符 5.流程式控制制語句 6.JS特殊語法 練習:在頁面上列印一個99乘法表 <!DOC ...
  • 隨著我國經濟的飛速發展,三維地下管網、地下管線系統直觀高效的參考,結合GIS、資料庫和三維技術,直觀顯示地下管線的空間層次和位置信息,資源的統籌利用審批工作提供準確,易景空間地圖專業致力於三維管網、管網建模、bim管線、三維管網檢測提供專業的技術服務,數據驅動快速生成三維管網矢量模型。 ...
一周排行
  • 比如要拆分“呵呵呵90909086676喝喝999”,下麵當type=0返回的是中文字元串“呵呵呵,喝喝”,type=1返回的是數字字元串“90909086676,999”, private string GetStrings(string str,int type=0) { IList<strin ...
  • Swagger一個優秀的Api介面文檔生成工具。Swagger可以可以動態生成Api介面文檔,有效的降低前後端人員關於Api介面的溝通成本,促進項目高效開發。 1、使用NuGet安裝最新的包:Swashbuckle.AspNetCore。 2、編輯項目文件(NetCoreTemplate.Web.c ...
  • 2020 年 7 月 30 日, 由.NET基金會和微軟 將舉辦一個線上和為期一天的活動,包括 微軟 .NET 團隊的演講者以及社區的演講者。本次線上大會 專註.NET框架構建微服務,演講者分享構建和部署雲原生應用程式的最佳實踐、模式、提示和技巧。有關更多信息和隨時瞭解情況:https://focu... ...
  • #abp框架Excel導出——基於vue #1.技術棧 ##1.1 前端採用vue,官方提供 UI套件用的是iview ##1.2 後臺是abp——aspnetboilerplate 即abp v1,https://github.com/aspnetboilerplate/aspnetboilerp ...
  • 前言 本文的文字及圖片來源於網路,僅供學習、交流使用,不具有任何商業用途,版權歸原作者所有,如有問題請及時聯繫我們以作處理。 作者:碧茂大數據 PS:如有需要Python學習資料的小伙伴可以加下方的群去找免費管理員領取 input()輸入 Python提供了 input() 內置函數從標準輸入讀入一 ...
  • 從12年到20年,python以肉眼可見的趨勢超過了java,成為了當今It界人人皆知的編程語言。 python為什麼這麼火? 網路編程語言搜索指數 適合初學者 Python具有語法簡單、語句清晰的特點,這就讓初學者在學習階段可以把精力集中在編程對象和思維方法上。 大佬都在用 Google,YouT ...
  • 在社會上存在一種普遍的對培訓機構的學生一種歧視的現象,具體表現在,比如:當你去公司面試的時候,一旦你說了你是培訓機構出來的,那麼基本上你就涼了,那麼你瞞著不說,然後又通過了面試成功入職,但是以後一旦在公司被髮現有培訓經歷,可能會面臨被降薪,甚至被辭退,培訓機構出來的學生,在用人單位眼裡就是能力低下的 ...
  • from typing import List# 這道題看了大佬寫的代碼,經過自己的理解寫出來了。# 從最外圍的四周找有沒有為O的,如果有的話就進入深搜函數,然後深搜遍歷# 判斷上下左右的位置是否為Oclass Solution: def solve(self, board: List[List[s ...
  • import requests; import re; import os; # 1.請求網頁 header = { "user-agent":'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, li ...
  • import requests; import re; import os; import parsel; 1.請求網頁 header = { "user-agent":'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537. ...