HTML連載15-文本屬性&顏色控制屬性

来源:https://www.cnblogs.com/ruigege0000/archive/2019/06/24/11080412.html
-Advertisement-
Play Games

一、文本裝飾的屬性 1.格式:text-decoration:underline; 2.取值: (1)underline代表下劃線 (2)line-through代表刪除線 (3)overline代表上劃線 (4)none代表什麼格式都沒有(預設是這個屬性) 註意:none的大多數用處在我們使用a標 ...


一、文本裝飾的屬性

1.格式:text-decoration:underline;

2.取值:

(1)underline代表下劃線

(2)line-through代表刪除線

(3)overline代表上劃線

(4)none代表什麼格式都沒有(預設是這個屬性)

註意:none的大多數用處在我們使用a標簽的時候,可以用來去掉超級連接的下劃線,可見下方演示

 

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        p{

            text-decoration: line-through;

        }

        u{

            text-decoration: overline;

        }

        h1{

            text-decoration:underline;

        }

        a{

            text-decoration: none;

        }

</style>

</head>

<body>

<u>我是一個事例文字</u>

<p>我也是一個裝飾文字</p>

<h1>我更是一個事例文字</h1>

<a href="https://www.baidu.com">我是一個超級鏈接</a>

 

3.快捷鍵

td代表text-decoration:none;

tdu代表text-decoration:undeiline;

tdl代表text-decoration:line-through;

tdo代表text-decoration:overline;

二、文本對齊的屬性

1.格式:text-align:center;

2.取值:

(1)center代表居中

(2)right代表居右

(3)left代表居左

3.快捷鍵

ta代筆text-align:left;

tar代表text-align:right;

tac代表text-align:center;

總結:特殊的記住預設的值,平常的在記住屬性值單詞首字母。

三、文本縮進的屬性

1.格式:text-indent:2em;

2.取值:

(1)3em代筆3個字元

(2)5px代表5個像素

3.快捷鍵:

ti代表text-indent:;

ti2e代表text-indent:2em;

 

<head>

    <meta charset="UTF-8">

    <title>d64_attribute_of_text</title>

    <style>

        p{

            text-decoration: line-through;

            text-align: center;

            text-indent: 2em;

        }

        u{

            text-decoration: overline;

            text-align: right;

            text-indent: 100px;

        }

        h1{

            text-decoration:underline;

            text-align: left;

        }

        a{

            text-decoration: none;

        }

</style>

</head>

<body>

<u>我是一個事例文字</u>

<p>我也是一個裝飾文字</p>

<h1>我更是一個事例文字</h1>

<a href="https://www.baidu.com">我是一個超級鏈接</a>

</body>

 

四、顏色控制屬性

1.格式:color:值;

2.取值:

(1)顏色英文單詞

註:一般情況下常見的顏色都是由對應的英文單詞,但是英文單詞能夠表達的顏色是有限的,也就說不是所有的顏色都能夠通過英文單詞來表達

(2)RGB顏色選擇器

註:紅綠藍三原色,格式:rgb(255,0,0)代表紅色,裡面的數字分別代表紅綠藍三原色各自的亮度,webstorm很智能,可以寫代碼時直接在旁邊顯示顏色。

 


(3)RGBA顏色選擇器

註:CSS3才推出來的一種格式,其中最後的字母a其實就是代表透明度,最大為1,最小為0,值越小越透明

 


(4)十六進位(後天再寫)

(5)十六進位的縮寫

五、源碼:

d64_attribute_of_text

d65_attribute_of_color

地址:

https://github.com/ruigege66/HTML_learning

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

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

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

 


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

-Advertisement-
Play Games
更多相關文章
  • 上周遇到了將數據從orcle導入到impala的問題,這個項目耽誤了我近一周的時間,雖然是種種原因導致的,但是還是做個總結。 需求首先是跑數據,跑數據這個就不敘述,用的是公司的平臺。 講講耽誤我最久的事吧 數據的導入導出。 將數據從orcle導出 PLSQL直接導出 我這邊連接公司的orcle資料庫 ...
  • 文 | 子龍 有技術,有乾貨,有故事的斜杠青年 一,寫在前面的話 最近公司需要按天,按小時查看數據,可以直觀的看到時間段的數據峰值。接到需求,就開始瘋狂百度搜索,但是搜索到的資料有很多都不清楚,需要自己去總結和挖掘其中的重要信息。現在我把分享出來了呢,希望大家喜歡。 針對sqlserver, 有幾點 ...
  • select dateadd(dd,-day(getdate()) + 1,getdate()) '當月起始時間' //查詢當月起始時間 select dateadd(ms,-3,DATEADD(mm, DATEDIFF(m,0,getdate())+1, 0)) '當月結束時間' //查詢當月結束 ...
  • 1.什麼是redis redis是用C語言開發的一個開源的高性能鍵值對(key-value)資料庫。它通過提供多種鍵值數據類型來適應不同場景下的存儲需求,目前為止redis支持的鍵值數據類型如下字元串、列表(lists)、集合(sets)、有序集合(sorts sets)、哈希表(hashs) 2. ...
  • flutter最近顯得格外的火,公司的同事也一直在談論flutter,感覺自己不學學就要失業了。。。所以決定順應潮流學習以下flutter,做一下學習筆記,希望可以給需要的同學帶來一些幫助~ ...
  • 關於RSA的介紹Google一下很多,這裡不做說明。項目開發中一般會把公鑰放在本地進行加密,服務端通過私鑰進行解密。Android項目開發中要用到這個加密演算法,總結後實現如下: 使用如下: ...
  • 安裝ionic --npm install -g ionic --cnpm install -g ionic --npm update -g ionic --cnpm update -g ionic 安裝完成 安裝cordova --npm install -g cordova --cnpm ins ...
  • 一,效果圖。 二,代碼。 參考資料:《菜鳥教程》 ...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...