javascript - HTML 表单的 CSS vendor 前缀-6ren

javascript - HTML 表单的 CSS vendor 前缀

转载作者：太空宇宙更新时间：2023-11-04 12:15:35

28

4

我正在为 5 种主要浏览器开发一个表单，想了解更多关于 CSS vendor 前缀的信息。表单在 firefox 中看起来不同，我通常会使用 top 和 left CSS 移动 div，但只想调整 firefox。从我读到的 -moz-margin-start: 10em;似乎是一种移动 div 但不起作用的方法。如何使用 css 仅在 firefox 中移动 div？

我这里有一个前缀列表 http://peter.sh/experiments/vendor-prefixed-css-property-overview/并使用 https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-margin-start

附注我读到使用 Grunt 不再需要使用 CSS vendor 前缀，是否值得设置？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>title</title>

    <link rel="stylesheet" type="text/css" href="blueprint/blueprint/screen.css" />
    <link rel="stylesheet" type="text/css" href="blueprint/blueprint/src/typography.css" />
    <link rel="stylesheet" type="text/css" href="style.css" />
    <!--<link rel="stylesheet" type="text/css" href="blueprint/blueprint/ie.css" />-->
    <!--[if IE]>
    <link rel="stylesheet" href="blueprint/ie.css" type="text/css"
    media="screen, projection">
    <![endif]-->

</head>

<body>
    <div class="container showgrid">
                <h2><center>Research Request Form</center></h2>



                <div> 
                    <input type="text" class="span-4" id="listcode">

                </div>
                <div>
                    <input type="text" class="span-4" id="sourceCode">

                </div>
                <div>
                    <input type="text" class="span-7" id="division">

                </div>
                <div class="span-24" id="wrap2">

                    <input type="text" class="span-23" id="projectName">

                </div>
                <div class="span-4">
                    <div class="span-4" id="interestCodes">
                        <p>
                            <input class="span-4" id="interestCodes" style="" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes" style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                            <p style="">&nbsp;Interest Codes</p>
                        </p>
                </div>
                <div>
                        <input class="span-18" id="listCodeAndName"style="" name="Text1" value="List code and Name:">
                </div>
                <div id="detailWrap">
                    <div id="details"> 
                    <p>Marketing Manager:  </p> 
                    <p>Marketing Director: </p> 
                    <p>Date Submitted:  </p> 
                    <p>Ideal Deadline: </p> 
                    <p>Quantity Submitted: </p> 
                  <p><input type="submit" name="submit" value="Send" /></p>                                                                 

                </div>

    </div>
</body>
</html>

body {
    background-color: #99FF99;
    font-family: verdana, sans-serif;
}
#listcode {
    height: 50px;
    margin-left: 22px;
}
.container {
    border:2px solid black;

}
#sourceCode {
    height: 50px;
    margin-left: 58px;
}
#division {
    height: 50px;
    float: right;
    margin-right:18px;
}
#wrap2 {

    display: block; 
    clear: both;

}
#projectName {
    height: 50px;
    margin: 20px 20px 20px 20px;

}
#interestCodes {
    margin-left: 10px;
}
#listCodeAndName{
    -moz-margin-end:10em;
    margin-left: 230px; 
    width: 688px;
    height: 160px;
    position: fixed;
    top: 224px;
    left: 146px;

}

最佳答案

如果我答对了你的问题，那么你的 div 容器不在左上角。这是因为浏览器有其默认的 css 定义，比如 body 元素上的 10px 边距。您可以轻松解决问题:

body {
    margin: 0;
}

或者您最好开始使用 CSS 重置，normalize.css例如。

希望对您有所帮助，我没有走错路。

关于javascript - HTML 表单的 CSS vendor 前缀，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28744321/

28

4

0

文章推荐： javascript - Textarea 在用户输入时扩展其宽度

文章推荐： c++ - Vector 不会存储正确的数据类型(wchar_t 而不是 uint16_t)

文章推荐： java - 如何关闭出现在同一页面上的子弹出窗口

文章推荐： css - 最大文本行数 + 省略号

elasticsearch - Elasticsearch 错误-[前缀]查询不支持[前缀]
发布以下查询时，出现错误响应 {"error":{"root_cause":[{"type":"parsing_exception","reason":"[prefix] query does not
django - 找不到平台无关的库 <前缀> 考虑将 $PYTHONHOME 设置为 <前缀>[ :]
我对 Python 和 Django 真的很陌生......我想做的是: 在 Mac OS 10.6.8 上安装 Python 2.7 安装 pip 安装 Django 安装 virtualenvwr
前缀，中缀，后缀表达式
前缀表达式前缀表达式又称波兰式，前缀表达式的运算符位于操作数之前。例如： ( 3 + 4 ) × 5 − 6 (3+4)×5-6(3+4)×5−6 对应的前缀表达式就是 - × + 3 4 5 6
unicode - 英特尔C编译器和L”前缀
如何在Intel C编译器中定义俄语字符串？在MSVS 2008中，我这样做： _wsetlocale(LC_ALL, L"Russian"); wprintf(L"текст"); 而且有效。在
makefile - 在Makefile中设置环境变量时@前缀
这是我到目前为止所得到的: SPECS = $(shell find spec -iname "*_spec.js") spec: @NODE_ENV=test \ @NODE_PAT
clojure - 前缀::是什么意思
我看到了下面的前缀::它代表什么？ :abc 是一个关键字，但是 ::abc 是什么？谢谢，穆尔塔扎最佳答案假设当前命名空间是my.app。然后， ::x 是 :my.app/x 的阅读器简写，
javascript - 如何从嵌入中排除 `+` 前缀
我为我的 discord 创建了一个建议功能，用户可以说 +suggest(建议)，它会自动发布到另一个 channel 。有些事情我需要帮助: 将“建议由用户制作”放入标题中，而不是在单独的行中。
c -++(前缀)返回左值吗？
#include int main() { int a=1; printf("%d",(++a)++); return 0; } 此代码出现错误 error: invalid lvalue in
Java:前缀 - 后缀问题
我在使用前缀和后缀运算符对数字执行减法时遇到了一个小问题。这是我的程序: public class postfixprefix { public static void main (Strin
html - 前缀 - 这是什么意思
当我在 Android native 浏览器中运行 HTML5 兼容性测试时，它会看到 IndexedDB 支持标记为“Prefixed”，而在 Chrome 和其他浏览器中则标记为“Yes”。我知道
c++ - 运算符重载--(前缀)
我试过重载运算符--前缀，但我有错误，有人帮忙吗？ #include #include "Circulo.h" using namespace std; int main() { //par
javascript - 如何在每一行前面加上 `>` 前缀
我正在尝试在我正在制作的这个论坛上创建一个引用功能，当我按下引用时，我只需用 Markdown 填充 textarea ，但唯一的事情是我需要在每行的 markdown 前面加上 > 前缀，这样它就是
c++ - 带线程的运算符++(前缀)
friend 之间打赌。sum 变量定义为全局变量。我们有 2 个线程在循环 1..100 上运行并在每个循环中将 sum 递增 1。打印什么？“和=”？ int sum = 0; void fun
c++ - 前缀/后缀增量
这个问题在这里已经有了答案: 关闭 10 年前。 Possible Duplicate: Post Increment and Pre Increment concept? 谁能明确解释前缀增量与后
c++ - 有没有办法避免在模板基类成员前面加上 `this` 前缀？
从模板类继承时，我需要在派生类中访问的所有基类成员前面加上this: template struct X{ int foo; void bar(); }; template struct
c++ - 为什么通过函数指针调用成员函数时需要 "this"前缀？
据我所知，在 C++ 中，在同一类的函数成员中调用另一个成员函数不需要“this”前缀，因为它是隐式的。但是，在使用函数指针的特定情况下，编译器需要它。仅当我通过 func 指针为调用包含“this”
c++ - 我们是否需要在嵌套类型的成员参数前加上 "::"前缀？
例如，考虑以下名称冲突的地方 nest1 : template class nest1 {}; class cls { public: template class nest1 {};
c++ - 指针算术递增后缀/前缀
我无法理解下面一段特定代码的逻辑。 int i[] = { 21, 4, -17, 45 }; int* i_ptr = i; std::cout << (*i_ptr)++ << std::endl
php - 数据库搜索减去 "The"前缀
有人能给我指出正确的方向吗，我目前有一个可搜索的数据库，但遇到了按标题搜索的问题。如果标题以“The”开头，那么显然标题将位于“T”部分，避免搜索“The”的好方法是什么？我应该连接两个字段来显示标
ios - 前缀 - 配置有问题
我在 2 小时前创建了一个新项目。以与我的旧(不同)项目相同的方式配置它，一切正常。在我的 podfile 中我有: pod 'CocoaLumberjack', '2.0.0-rc2' 如果我在

首页

博学

6Ren·AI

商城

javascript - HTML 表单的 CSS vendor 前缀