1

我使用 CSS3 Toolkit 生成代码,但是当我将其粘贴到编辑器中时,它不会返回形状,事实上,它不会在屏幕上返回任何内容。请有人指出我哪里出错了。它与 css 文件的链接方式无关,因为它适用于我的其他 css 代码。只是我用从 App Store 购买的 CSS3 工具包生成的这个特定代码不起作用。

HTML:

 <!DOCTYPE HTML>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="indexcss.css">
        <script type="text/javascript" href="dist/js/bootstrap.js"></script>
    </head>
    <body>
        <div class="ToolKitStyle"></div>
    </body>
</html>

CSS:

    .ToolKitStyle{
    background-color: #2EC0FE;
    -moz-border-radius: 34px;
    -webkit-border-radius: 34px;
    border-radius: 34px;
    -moz-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    -webkit-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    background-image: -o-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -moz-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -webkit-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -ms-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
}
4

3 回答 3

2

您需要在 CSS 中添加宽度和高度

.ToolKitStyle{
    background-color: #2EC0FE;
    -moz-border-radius: 34px;
    -webkit-border-radius: 34px;
    border-radius: 34px;
    -moz-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    -webkit-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    background-image: -o-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -moz-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -webkit-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -ms-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    width:100px;
    height:100px;
}
于 2013-08-29T19:04:17.987 回答
1

您需要在里面放一些东西或设置宽度/高度:http: //jsfiddle.net/2qyEP/

.ToolKitStyle{
    width: 200px;
    height: 200px;
    background-color: #2EC0FE;
    -moz-border-radius: 34px;
    -webkit-border-radius: 34px;
    border-radius: 34px;
    -moz-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    -webkit-box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    box-shadow:inset 0px 4px 9px rgba(0,0,0,1);
    background-image: -o-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -moz-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -webkit-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: -ms-linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
    background-image: linear-gradient(90deg , rgb(0,4,5) 0%, rgb(246,107,255) 100%);
}
于 2013-08-29T19:06:55.993 回答
1

您的 JS 未正确链接。src不使用href

<script type="text/javascript"  src="dist/js/bootstrap.js"></script>

关于您的 CSS 问题-

您没有任何内容,这就是您的 css 似乎不起作用的原因。

这是定义了高度,宽度

演示http://jsfiddle.net/kevinPHPkevin/73t6R/

于 2013-08-29T19:05:14.070 回答