- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
更新:
我发现 float #name
左边解决了我的问题。奇怪的是它仍然居中。我不明白为什么会这样……但现在可以了。
我有一个使用 AJAX 更新 <p>
的网络应用程序带有一些由脚本生成的文本的元素。当页面最初加载时,<p>
为空 ( <p id="name"></p>
)。它下面还有另外两个元素,都在 <div>
内居中。 , 它们是 <img>
和一个 <p>
分别。
这是 html:
<html>
<head>
<title>Name Generator</title>
<link rel="stylesheet" type="text/css" href="static/main.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="static/name.js"></script>
</head>
<body>
<div>
<p id="name"> </p><br/>
<p id="title">GENERATE YOUR NAME</p>
<img id="button" src="static/generator.png"/>
</div>
</body>
</html>
和 CSS:
body {
/*border: 1px dashed white;*/
position:relative;
width: 960px;
margin: 0 auto;
padding: 0;
text-align:center;
background-image:url('static/background-soundproof.png');
background-repeat:no-repeat;
background-size:cover;
}
div {
/*border: 1px dashed blue;*/
text-align: center;
width: 400px;
height: 600px;
margin: auto;
}
#name {
color:black;
text-shadow:0 0 12px white;
text-transform:capitalize;
font-family: Impact, Sans-Serif;
font-weight:100;
font-size:2.5em;
margin: 0 auto;
position: relative;
top: 60px;
}
#title{
font-family:Courier, sans-serif;
font-size:1.5em;
color:#7D7DBD;
position: relative;
top: 400px;
}
img {
margin: auto;
position: relative;
top:150px;
}
我的问题是,当页面首次加载时,第一个 <p>
是空的,因此,它似乎没有任何维度。当 <img>
单击,<p>
更新了一些文本,这导致它下面的元素向下移动页面大约新更新的高度 <p>
.有没有一种方法可以加载页面,使空元素具有固定的尺寸,并在更新时保持不变。所以它的尺寸基本上不会改变,也不会改变任何东西。
我尝试在 css 中为其指定宽度和高度、填充和边距,但无济于事。我也试过让它最初用 ' '
填充我在某处读到的可能会奏效,但事实并非如此。非常感谢任何帮助。
最佳答案
将此添加到您的 CSS 中
p#name{
min-height: 150px;
}
编辑:
p#name{
display:inline-block;
min-width: 150px;
min-height: 150px;
关于html - 如何阻止空的 html 元素变得无量纲?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21394915/
我已经为使用 JGroups 编写了简单的测试。有两个像这样的简单应用程序 import org.jgroups.*; import org.jgroups.conf.ConfiguratorFact
我有一个通过 ajax 检索的 json 编码数据集。我尝试检索的一些数据点将返回 null 或空。 但是,我不希望将那些 null 或空值显示给最终用户,或传递给其他函数。 我现在正在做的是检查
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: Why does one often see “null != variable” instead of “
嗨在我们公司,他们遵循与空值进行比较的严格规则。当我编码 if(variable!=null) 在代码审查中,我收到了对此的评论,将其更改为 if(null!=variable)。上面的代码对性能有影
我正在尝试使用 native Cordova QR 扫描仪插件编译项目,但是我不断收到此错误。据我了解,这是代码编写方式的问题,它向构造函数发送了错误的值,或者根本就没有找到构造函数。那么我该如何解决
我在装有 Java 1.8 的 Windows 10 上使用 Apache Nutch 1.14。我已按照 https://wiki.apache.org/nutch/NutchTutorial 中提
这个问题已经有答案了: 已关闭11 年前。 Possible Duplicate: what is “=null” and “ IS NULL” Is there any difference bet
Three-EyedRaven 内网渗透初期,我们都希望可以豪无遗漏的尽最大可能打开目标内网攻击面,故,设计该工具的初衷是解决某些工具内网探测速率慢、运行卡死、服务爆破误报率高以及socks流
我想在Scala中像在Java中那样做: public void recv(String from) { recv(from, null); } public void recv(String
我正在尝试从一组图像补丁中创建一个密码本。我已将图像(Caltech 101)分成20 X 20图像块。我想为每个补丁创建一个SIFT描述符。但是对于某些图像补丁,它不返回任何描述符/关键点。我尝试使
我在验证器类中自动连接的两个服务有问题。这些服务工作正常,因为在我的 Controller 中是自动连接的。我有一个 applicationContext.xml 文件和 MyApp-servlet.
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。 已关闭10 年前。 问题必须表现出对要解决的问题的最低程度的了解。告诉我们您尝试过做什么,为什么不起作用,以
大家好,我正在对数据库进行正常的选择,但是 mysql_num_rowsis 为空,我不知道为什么,我有 7 行选择。 如果您发现问题,请告诉我。 真的谢谢。 代码如下: function get_b
我想以以下格式创建一个字符串:id[]=%@&stringdata[]=%@&id[]=%@&stringdata[]=%@&id[]=%@&stringdata[]=%@&等,在for循环中,我得到
我正在尝试使用以下代码将URL转换为字符串: NSURL *urlOfOpenedFile = _service.myURLRequest.URL; NSString *fileThatWasOpen
我正在尝试将NSNumber传递到正在工作的UInt32中。然后,我试图将UInt32填充到NSData对象中。但是,这在这里变得有些时髦... 当我尝试将NSData对象中的内容写成它返回的字符串(
我正在进行身份验证并收到空 cookie。我想存储这个 cookie,但服务器没有返回给我 cookie。但响应代码是 200 ok。 httpConn.setRequestProperty(
我认为 Button bTutorial1 = (Button) findViewById(R.layout.tutorial1); bTutorial1.setOnClickListener
我的 Controller 中有这样的东西: model.attribute("hiringManagerMap",hiringManagerMap); 我正在访问此 hiringManagerMap
我想知道如何以正确的方式清空列表。在 div 中有一个列表然后清空 div 或列表更好吗? 我知道这是一个蹩脚的问题,但请帮助我理解这个 empty() 函数:) 案例)如果我运行这个脚本会发生什么:
我是一名优秀的程序员,十分优秀!