如何设置您创建的桌面小工具的大小答案

【问题标题】：How to set the size of a desktop gadget that you create如何设置您创建的桌面小工具的大小
【发布时间】：2013-09-15 08:38:24
【问题描述】：

我正在尝试创建一个非常基本的 Windows 桌面小工具来展示我的 Stack Overflow Flair。

我没有太多的 html 或 web 开发经验。我尝试按照说明here 进行操作，但是当我安装小工具时它很小：

是的，就是那个白色的小方块。

我尝试设置背景图像，但它似乎也不起作用（我实际上并不需要背景图像，我只是想让它工作）。如果我单独运行 html 源文件，那么它会在浏览器中正确显示：

这是来自 html 源文件（名为 MySOFlair.html）的代码：

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  </head>

  <body>
    <div id="gadgetContent">
      <a href="http://stackoverflow.com/users/2012446/chrisprosser">
        <img src="http://stackoverflow.com/users/flair/2012446.png" width="208" height="58" 
             alt="profile for ChrisProsser at Stack Overflow, Q&amp;A for professional and enthusiast programmers" 
             title="profile for ChrisProsser at Stack Overflow, Q&amp;A for professional and enthusiast programmers"/>
      </a>
    </div>
  </body>
</html>

这是清单文件 (Gadget.xml) 中的代码：

<?xml version="1.0" encoding="utf-8" ?>
<gadget>
  <name>MySOFlair</name>
  <version>1.0.0.0</version>
  <author name="Chris Prosser" />
  <description>Mt Stack Overflow Flair Gadget</description>
  <!--<icons>
    <icon src="http://stackoverflow.com/users/flair/2012446.png" 
          width="208" 
          height="58" />
  </icons>-->
  <hosts>
    <host name="sidebar">
      <base type="HTML" apiVersion="1.0.0" src="MySOFlair.html" />
      <permissions>Full</permissions>
      <platform minPlatformVersion="1.0" />
      <!--<defaultImage src="http://stackoverflow.com/users/flair/2012446.png" 
                    width="208" 
                    height="58"/>-->
    </host>
  </hosts>
</gadget>

我尝试在此处取消注释图像链接，但没有任何改变。

任何关于如何正确设置大小的想法将不胜感激。

【问题讨论】：

标签： html windows windows-7 windows-desktop-gadgets

【解决方案1】：

我找到了解决此问题的方法。我找到了一个可以插入 HTML 标题部分的样式元素。这是新的 HTML 文件：

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">
    body
    {
       margin:  0;
       width: 212;
       height: 62;
    }
    #gadgetContent
    {
       margin:  0px;
       width: 208px;
       height: 58px;
    }
    </style>
  </head>

  <body>
    <div id="gadgetContent">
      <a href="http://stackoverflow.com/users/2012446/chrisprosser">
        <img src="http://stackoverflow.com/users/flair/2012446.png" width="208" height="58" 
             alt="profile for ChrisProsser at Stack Overflow, Q&amp;A for professional and enthusiast programmers" 
             title="profile for ChrisProsser at Stack Overflow, Q&amp;A for professional and enthusiast programmers"/>
      </a>
    </div>
  </body>
</html>

【讨论】：