css實現二維碼掃碼框

張紅新發布于2019-08-29 16:43 / 3923人閱讀

摘要：我們一般在打開相機的時候有個掃描框，然后靜態二維碼有時候為了聚焦和利于掃描也會加一個框框，下面介紹一下如何通過來實現一個框框實現效果代碼如下

我們一般在打開相機的時候有個掃描框，然后靜態二維碼有時候為了聚焦和利于掃描也會加一個框框，下面介紹一下如何通過css 來實現一個框框
實現效果:

代碼如下:

html:

css:

.img-box {
  background: linear-gradient(#ae0000, #ae0000) left top,
    linear-gradient(#ae0000, #ae0000) left top,
    linear-gradient(#ae0000, #ae0000) right top,
    linear-gradient(#ae0000, #ae0000) right top,
    linear-gradient(#ae0000, #ae0000) right bottom,
    linear-gradient(#ae0000, #ae0000) right bottom,
    linear-gradient(#ae0000, #ae0000) left bottom,
    linear-gradient(#ae0000, #ae0000) left bottom;
  background-repeat: no-repeat;
  background-size: 2px 20px, 20px 2px;
  height: 116px;
  width: 116px;
}        
.code {
    height: 110px;
    width: 110px;
    margin-top: 2px;
    margin-left:2px;
    border: 1px solid #ae0000;
}

GPU云服務器云服務器掃碼框 java實現掃碼功能二維碼實現方法 JS輕松實現CSS設置

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/113938.html

自定義微信登錄掃碼樣式解決辦法

摘要：微信掃碼登錄近期做一個端微信掃碼登錄的需求，微信掃碼有兩種方式，一種是新開一個二維碼頁面，另一種是內嵌入產品網頁。幸運的是，微信留了一個給我們自定義樣式的機會，在之前實例化一個二維碼的時候，實例對象中屬性，允許設置樣式。 PC微信掃碼登錄近期做一個PC端微信掃碼登錄的需求，微信掃碼有兩種方式，一種是新開一個二維碼頁面，另一種是內嵌入產品網頁。本次以內嵌二維碼為例，具體怎樣在頁面中顯示...

meteor199 2019-08-29 13:58 評論0 收藏0
自定義微信登錄掃碼樣式解決辦法

摘要：微信掃碼登錄近期做一個端微信掃碼登錄的需求，微信掃碼有兩種方式，一種是新開一個二維碼頁面，另一種是內嵌入產品網頁。幸運的是，微信留了一個給我們自定義樣式的機會，在之前實例化一個二維碼的時候，實例對象中屬性，允許設置樣式。 PC微信掃碼登錄近期做一個PC端微信掃碼登錄的需求，微信掃碼有兩種方式，一種是新開一個二維碼頁面，另一種是內嵌入產品網頁。本次以內嵌二維碼為例，具體怎樣在頁面中顯示...

yexiaobai 2019-08-21 17:58 評論0 收藏0
制作QQ微信支付寶三合一收款碼

摘要：所以，我也想加一個打賞功能分析但在逛了一圈之后發現，打賞插件基本上千篇一律的掃碼微信掃碼支付寶掃碼。但由于與微信無法直接喚醒，所以直接輸出一個與微信的二維碼，然后長按掃碼實現支付。前言最近在逛博客時，發現很多博客都帶了打賞功能，雖說打賞的人可能很少，但始終是一份心意，能讓博主知道自己寫的文章有用，能夠幫助到人。所以，我也想加一個打賞功能~ 分析但在github逛了一圈之后發現，打...

Pines_Cheng 2019-06-28 18:25 評論0 收藏0
ESMap+Html5+SpringBoot+FastDFS實現導航導購App

摘要：兩者的結合通過中的組件以及依賴實現。在項目正式上線后會將本地服務器的內容打包成包發布到服務器中。數據庫部分數據庫使用關系型數據庫管理系統，在其中建立了店鋪，商品，商品類目三個表，通過其中的特定字段使兩表關聯，從而實現了簡單的聯表查詢。 ESMap-Indoor-navigation ESMap+Html5+SpringBoot+FastDFS實現導航導購Appgithub鏈接：http...

xietao3 2019-08-23 15:10 評論0 收藏0