1

我已经搜索过，但似乎无法解决我的问题。不知何故，我错过了这个问题的解决方案。我是 Muse 的新手，但对 html 和 css 非常熟悉。我在文本编辑器中制作了这个联系表格，它在 DW 和 jsfiddle 中完美运行。当我将它插入 Muse 时，它​​会粉碎它。我尝试过外部样式表，内部带有对象插入，内联带有对象插入。所有人都给了我相同的结果（下图）。甚至有人建议在 assets 文件夹中放置一个外部样式表，我这样做了，甚至尝试了 css 文件夹和普通文件夹，没有运气。

这是否可以修复或 Muse 不允许这种类型的事情？

提前感谢所有有用的回复。萨姆

这是代码的样子：

   

label {
    float: left;
    width: 6em;
    text-align: right;
    margin-right: 10px;
}

.submit {
    margin-left: 6em;
}

fieldset {
    width: 500px;
    background-color: #FFDE00;
    border: none;
}

p {
    font-family: arial;
}

   
<fieldset>
<form action="mailto:xxx@hotmail.com"
      method="post" enctype="text/plain">

    <!-----Form heading----->    
<p> Tell us who you are </p>    
    
    <!-----Inout customer details----->
<p>
    <label class="username" for="first Name">
        First Name: </label>
    <input type="text" name="firstname" id="first Name"
        size="35" maxlength="40" /> </p>    
    
<p>
    <label class="username" for="Email">
        Email: </label>
    <input type="text" name="email" id="Email"
        size="35" maxlength="40" /> </p>  
    
    <!-----Dropdown make----->    
<p> Please select your make: </p>
<p>
    <select name="make">
        <option value="3M">3M</option>
        <option value="3M">Acer</option>
        <option value="3M">Ask</option>
        <option value="3M">BenQ</option>
        <option value="3M">Epson</option>
        <option value="3M">Hitachi</option>
        <option value="3M">InFocus</option>
        <option value="3M">LG</option>
        <option value="3M">Mitsubishi</option>
        <option value="3M">NEC</option>
        <option value="3M">Optoma</option>
        <option value="3M">Panasonic</option>
        <option value="3M">Philips</option>
        <option value="3M">Samsung</option>
        <option value="3M">Sanyo</option>
        <option value="3M">Sharp</option>
        <option value="3M">Sony</option>
        <option value="3M">Toshiba</option>
        <option value="3M">Viewsonic</option>
        <option value="3M">Vivitek</option>
        <option value="3M">Other</option>
    </select> </p>   

    <!-----Submit picture of sticker----->
<p> Use the Choose File button to submit a picture of your model           sticker if unsure what number to use: </p>  
<p>
    <input type="file" size="30" /> </p>    
    
    <!-----Text Area----->
<p> For any other comments or if you selected Other please             specify here: </p> 
<p> 
    <textarea name="comments" rows="5" cols="40">
Enter more comments here...
    </textarea> </p>  
    
    <!-----Submit & Reset buttons----->
<p class="submit"> 
    <input type="submit" value="Submit" />
    <input type="reset" value="Clear the form" /> </p>    
    
</form>
</fieldset>

这是开始和最终结果的样子：

不太好

4

1 回答 1

0

您可能会发现 DW 使用了很多浏览器初始 CSS 样式，而 Muse 可能会重置所有内容。所以你必须从头开始陈述事情，比如边框、边距、填充等。

例如，您的每个段落元素都需要应用一些 margin-bottom。这将立即使它看起来更像第一个示例。

   

label {
    float: left;
    width: 6em;
    text-align: right;
    margin-right: 10px;
}

.submit {
    margin-left: 6em;
}

fieldset {
    width: 500px;
    background-color: #FFDE00;
    border: none;
}

p {
    font-family: arial;
    margin-bottom:1em;
}

   
<fieldset>
<form action="mailto:xxx@hotmail.com"
      method="post" enctype="text/plain">

    <!-----Form heading----->    
<p> Tell us who you are </p>    
    
    <!-----Inout customer details----->
<p>
    <label class="username" for="first Name">
        First Name: </label>
    <input type="text" name="firstname" id="first Name"
        size="35" maxlength="40" /> </p>    
    
<p>
    <label class="username" for="Email">
        Email: </label>
    <input type="text" name="email" id="Email"
        size="35" maxlength="40" /> </p>  
    
    <!-----Dropdown make----->    
<p> Please select your make: </p>
<p>
    <select name="make">
        <option value="3M">3M</option>
        <option value="3M">Acer</option>
        <option value="3M">Ask</option>
        <option value="3M">BenQ</option>
        <option value="3M">Epson</option>
        <option value="3M">Hitachi</option>
        <option value="3M">InFocus</option>
        <option value="3M">LG</option>
        <option value="3M">Mitsubishi</option>
        <option value="3M">NEC</option>
        <option value="3M">Optoma</option>
        <option value="3M">Panasonic</option>
        <option value="3M">Philips</option>
        <option value="3M">Samsung</option>
        <option value="3M">Sanyo</option>
        <option value="3M">Sharp</option>
        <option value="3M">Sony</option>
        <option value="3M">Toshiba</option>
        <option value="3M">Viewsonic</option>
        <option value="3M">Vivitek</option>
        <option value="3M">Other</option>
    </select> </p>   

    <!-----Submit picture of sticker----->
<p> Use the Choose File button to submit a picture of your model           sticker if unsure what number to use: </p>  
<p>
    <input type="file" size="30" /> </p>    
    
    <!-----Text Area----->
<p> For any other comments or if you selected Other please             specify here: </p> 
<p> 
    <textarea name="comments" rows="5" cols="40">
Enter more comments here...
    </textarea> </p>  
    
    <!-----Submit & Reset buttons----->
<p class="submit"> 
    <input type="submit" value="Submit" />
    <input type="reset" value="Clear the form" /> </p>    
    
</form>
</fieldset>

于 2015-09-17T16:04:25.850 回答