首頁 web前端 html教學 利用边框border的属性做小符号_html/css_WEB-ITnose

利用边框border的属性做小符号_html/css_WEB-ITnose

Jun 24, 2016 pm 12:05 PM
border 使用 屬性 邊框

前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址。最后问了同学,才得知是用border属性做出来的。

符号如右: 

其css代码如下:

.fuhao{    position:absolute;    top:12px;    left:12px;    width:0px;    height:0px;    overflow:hidden;    border-width:6px 0px 6px 6px;    border-color:transparent #A92222;    border-style:dashed none dashed solid;}
登入後複製

这里是利用一个空的div即fuhao,给它定义好位置后,让它高度和宽度都为0,但边框具有宽度。那么这个div里面什么有没有,只剩下边框。

按道理来说应该是这样的:

然后下面的语句给上下边框做了透明transparent处理,右边框做0px处理,就得出了那个符号了。

其实,我也不是很明白,但觉得用边框border来做符号非常有趣,就所见所得,拿来即用吧。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

<🎜>:泡泡膠模擬器無窮大 - 如何獲取和使用皇家鑰匙
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系統,解釋
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆樹的耳語 - 如何解鎖抓鉤
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1670
14
CakePHP 教程
1428
52
Laravel 教程
1329
25
PHP教程
1274
29
C# 教程
1256
24
Windows 11 上調整視窗邊框設定的方法:變更顏色和大小 Windows 11 上調整視窗邊框設定的方法:變更顏色和大小 Sep 22, 2023 am 11:37 AM

Windows11將清新優雅的設計帶到了最前沿;現代介面可讓您個性化和更改最精細的細節,例如視窗邊框。在本指南中,我們將討論逐步說明,以協助您在Windows作業系統中建立反映您的風格的環境。如何更改視窗邊框設定?按+開啟“設定”應用程式。 WindowsI前往個人化,然後按一下顏色設定。顏色變更視窗邊框設定視窗11「寬度=」643「高度=」500「&gt;找到在標題列和視窗邊框上顯示強調色選項,然後切換它旁邊的開關。若要在「開始」功能表和工作列上顯示主題色,請開啟「在開始」功能表和工作列上顯示主題

如何利用GitLab進行專案文件管理 如何利用GitLab進行專案文件管理 Oct 20, 2023 am 10:40 AM

如何利用GitLab進行專案文件管理一、背景介紹在軟體開發過程中,專案文件是非常重要的資料,不僅能夠幫助開發團隊了解專案的需求和設計,還能提供給測試團隊和客戶參考。為了方便專案文件的版本控制和團隊協作,我們可以利用GitLab來進行專案文件管理。 GitLab是一個基於Git的版本控制系統,除了支援程式碼管理,還可以管理專案文件。二、GitLab環境建置首先,我

如何在Python中取得整數位面量屬性而不是SyntaxError? 如何在Python中取得整數位面量屬性而不是SyntaxError? Aug 20, 2023 pm 07:13 PM

要獲得intliteral屬性而不是語法錯誤,請使用空格或括號。intliteral是Python中NumericLiterals的一部分。NumericLiterals還包括以下四種不同的數字類型-int(有符號整數) - 它們通常被稱為整數或整數,是正數

如何在Java中使用Gson重命名JSON的屬性? 如何在Java中使用Gson重命名JSON的屬性? Aug 27, 2023 pm 02:01 PM

Gson@SerializedName註解可以序列化為JSON,並將提供的名稱值作為其欄位名稱。此註解可以覆寫任何FieldNamingPolicy,包括可能已在Gson實例上設定的預設欄位命名策略。可以使用GsonBuilder類別來設定不同的命名策略。語法@Retention(value=RUNTIME)@Target(value={FIELD,METHOD})public@interfaceSerializedName範例importcom.google.gson.annotations.*;

Python的dir()函數:查看物件的屬性和方法 Python的dir()函數:查看物件的屬性和方法 Nov 18, 2023 pm 01:45 PM

Python的dir()函數:查看物件的屬性和方法,需要具體程式碼範例摘要:Python是一種強大而靈活的程式語言,其內建函數和工具為開發人員提供了許多方便的功能。其中一個非常有用的函數是dir()函數,它允許我們查看一個物件的屬性和方法。本文將介紹dir()函數的用法,並透過具體的程式碼範例來示範其功能和用途。正文:Python的dir()函數是一個內建函數,

excel邊框設定方法科普 excel邊框設定方法科普 Mar 20, 2024 am 10:30 AM

Excel出現在我們日常工作和生活中已經不是一件罕見的事情了,無論是員工資訊、薪資表的製作或是學生入學資訊和成績單的製作,Excel都是一款比較好用的工具。當要列印Excel的時候需要設定邊框來實現列印需求。本文小編為大家科普幾個Excel邊框設定方法。方法1、利用功能選項卡按鈕,這應該是大家常用的方法,方便快捷,具體操作:選取需要新增邊框的儲存格區域B2:H10,依序點選【開始】選項卡-【邊框】右側下拉按鈕-【所有框線】,完成新增框線。方法2、選取需要新增邊框的儲存格區域B2:H10

如何在 Microsoft Word 中製作自訂邊框 如何在 Microsoft Word 中製作自訂邊框 Nov 18, 2023 pm 11:17 PM

想讓你的學校計畫的頭版看起來令人興奮嗎?沒有什麼比工作簿首頁上的漂亮、優雅的邊框更能使其從其他提交中脫穎而出了。但是,MicrosoftWord中的標準單行邊框已經變得非常明顯和無聊。因此,我們展示了在MicrosoftWord文件中建立和使用自訂邊框的步驟。如何在MicrosoftWord中製作自訂邊框建立自訂邊框非常容易。但是,您將需要一個邊界。步驟1–下載自訂邊框網路上有大量的免費邊界。我們已經下載了一個這樣的邊框。步驟1–在Internet上搜尋自訂邊框。或者,您可以轉到剪貼

如何使用CSS實現元素的邊框動畫效果 如何使用CSS實現元素的邊框動畫效果 Nov 21, 2023 pm 02:26 PM

如何使用CSS實現元素的邊框動畫效果導語:在網頁設計中,為了增加使用者的視覺體驗和頁面的吸引力,常常會使用一些動畫效果來使頁面元素更加生動和有趣。其中,邊框動畫是一種很常見的效果,它可以讓元素邊框呈現出變化、閃爍或流動的動態效果。本文將介紹如何使用CSS來實現元素的邊框動畫效果,並提供具體的程式碼範例。一、實現邊框顏色變化動畫要實現邊框顏色變化的動畫效果,可以

See all articles