support palestine banner下載 - support palestine banner源代碼下載

support palestine banner

其他源碼

1.0.0

下載

支持巴勒斯坦橫幅

歡迎來到支持巴勒斯坦橫幅項目！該存儲庫包含許多標誌，以幫助在網絡上顯示對巴勒斯坦的支持 - 包括網站橫幅，讀書人橫幅和Github徽章 - OSS項目可以將其用於傳播詞，支持事業並幫助巴勒斯坦在這種災難性的情況下。

如何使用

要在您自己的項目中包括顯示的顯示橫幅 -

找到您想從下面的“徽章和橫幅”部分中使用的特定支持橫幅。
複製並粘貼所選橫幅的關聯的標準代碼，並將支持項目中的Markdown的任何文件。
要包括網站橫幅，請確保從“網站橫幅安裝”部分複制HTML摘要，並在您項目的HTML文件的開頭<body>標籤後立即粘貼它。
如果您想自定義支持橫幅中的鏈接，只需用所需的鏈接替換現有鏈接即可。
保存更改後，橫幅應立即顯示。請參閱下面的“故障排除”部分和/或如果查看有任何問題，請參見。

徽章和橫幅

徽章橫幅

 [ ![ StandWithPalestine ] ( https://raw.githubusercontent.com/Safouene1/support-palestine-banner/master/StandWithPalestine.svg )] ( https://github.com/Safouene1/support-palestine-banner/Markdown-pages/Support.md )

Readme Banner

 [ ![ ReadMeSupportPalestine ] ( https://raw.githubusercontent.com/Safouene1/support-palestine-banner/master/banner-support.svg )] ( https://github.com/Safouene1/support-palestine-banner/Markdown-pages/Support.md )

項目的讀書橫幅

 [ ![ ReadMeSupportPalestine ] ( https://raw.githubusercontent.com/Safouene1/support-palestine-banner/master/banner-project.svg )] ( https://github.com/Safouene1/support-palestine-banner/Markdown-pages/Support.md )

React的橫幅組件，NextJS 13，Vue（V2和V3）帶有尾風

帶有黑暗模式的移動樣本

示例圖像移動暗模式

帶有光模式的桌面樣本

示例圖像桌面燈模式

這些組件開箱即用支持

	特徵
✅	JavaScript
✅	打字稿
✅	服務器組件
✅	響應迅速
✅	可關閉
✅	位置粘性或親戚

如果您不使用尾風，請導入此CSS文件：banner.css

組件可以在這裡找到

網站橫幅安裝

使用此片段在網站頂部向巴勒斯坦人表示支持。安裝它需要幾分鐘。

關於網站橫幅

該代碼在您的網站上添加了一個小黑色橫幅，並帶有巴勒斯坦國旗和支持消息。它鏈接到伊斯蘭利益的捐贈網站，但您可以將鏈接更改為指向您選擇的支持渠道。

安裝橫幅

安裝很簡單。只需在打開<body>標籤後立即將此代碼複製到您的模板。

 < style >
  body {
    margin-top: 35px;
  }
  .support-palestine,
  .support-palestine:visited {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    background: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
    padding-top: 5px;
    padding-bottom: 5px;
    z-index: 10000;
    text-decoration: none;
    font-family: arial;
  }
  .support-palestine:hover,
  .support-palestine:active {
    background: black;
    display: flex;
    background: rgb(80, 80, 80);
    text-decoration: none;
  }
  .support-palestine__flag {
    margin-right: 10px;
  }

  .support-palestine__label {
    color: white;
    font-size: 12px;
    line-height: 24px;
  }
  .background {
    background: darkgreen;

    height: 21px;
  }
  .top {
    background: black;
    width: 40px;
    height: 8px;
    z-index: 1;
  }
  .middle {
    background: white;
    width: 100%;
    height: 8px;
    z-index: 1;
  }
  .triangle {
    background: auto;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 20px solid red;
    z-index: 2;
    position: relative;
    top: -16px;
    left: 0;
  }
</ style >
< a
  class =" support-palestine "
  href =" https://www.islamic-relief.org.uk/giving/appeals/palestine/ "
  target =" _blank "
  rel =" nofollow noopener "
  title =" Donate to support palestine "
>
  < div
    class =" support-palestine__flag "
    role =" img "
    aria-label =" Flag of palestine "
  >
    < div class =" background " >
      < div class =" top " > </ div >
      < div class =" middle " > </ div >
      < div class =" triangle " > </ div >
    </ div >
  </ div >
  < div class =" support-palestine__label " > Donate to support Palestine </ div >
</ a >