如何编辑 Skype 联系我按钮 CSS？

Question

我需要有关 Skype 联系我按钮的帮助。

使用 margin: 24px; vertical-align: -30px; 的标准 Skype 按钮所以我试图删除边距和垂直对齐，但没有任何效果。

添加代码片段：

Skype.ui({
  "name": "chat",
  "element": "SkypeButton_Call_Sandrita.logistics_1",
  "participants": ["Sandrita.logistics"],
  "imageSize": 24
});

#SkypeButton_Call_Sandrita.logistics_1_paraElement {
  margin: 0;
}
#SkypeButton_Call_Sandrita.logistics_1_paraElement img {
  margin: 0 !important;
  vertical-align: middle !important;
}

<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>

<header>
  <div class="container">
    <div id="SkypeButton_Call_Sandrita.logistics_1"></div>
  </div>
</header>

感谢您的帮助！

Answer 1

您需要转义您正在使用的id中的点（注意.用于引用类）-请参阅下面的演示：

Skype.ui({
  "name": "chat",
  "element": "SkypeButton_Call_Sandrita.logistics_1",
  "participants": ["Sandrita.logistics"],
  "imageSize": 24
});

#SkypeButton_Call_Sandrita\.logistics_1_paraElement {
  margin: 0;
}
#SkypeButton_Call_Sandrita\.logistics_1_paraElement img {
  margin: 0 !important;
  vertical-align: middle !important;
}

<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>

<header>
  <div class="container">
    <div id="SkypeButton_Call_Sandrita.logistics_1"></div>
  </div>
</header>

Answer 2

选择器不工作，因为它包含一个点“.”

Skype.ui({
           "name": "chat",
           "element": "SkypeButton_Call_Sandrita",
           "participants": ["Sandrita.logistics"],
           "imageSize": 24
         });

#SkypeButton_Call_Sandrita div {
  margin:0;
}
#SkypeButton_Call_Sandrita img {
  margin:0 !important;
  vertical-align:middle !important;
}

<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>

<header>
  <div class="container">
    <div id="SkypeButton_Call_Sandrita"> </div>
  </div>
</header>

Answer 3

从您的 ID 中删除圆点 #SkypeButton_Call_Sandrita_logistics_1

Skype.ui({
  "name": "chat",
  "element": "SkypeButton_Call_Sandrita_logistics_1",
  "participants": ["Sandrita.logistics"],
  "imageSize": 24
});

<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>

<style>
  #SkypeButton_Call_Sandrita_logistics_1_paraElement {
    margin: 0;
  }
  #SkypeButton_Call_Sandrita_logistics_1_paraElement img {
    margin: 0px !important;
    vertical-align: middle !important;
  }
</style>

<header>
  <div class="container">
    <div id="SkypeButton_Call_Sandrita_logistics_1"></div>
  </div>
</header>

如何编辑 Skype 联系我按钮 CSS？

How to edit Skype contact me button CSS?

html

javascript

css

css-selectors

skypedeveloper