嗫?暁雲?
问题描述
我想使用 Struts 2 设计一个在同一行显示用户 ID 和密码的网页.
I want to design a webpage that display the user id and password in same line using Struts 2.
不使用theme='simple'如何管理?
How to manage it without using theme='simple'?
<%@taglib uri="/struts-tags" prefix="s" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%><html>
<head>
</head>
<body>
<s:form action="Register.action">
<s:textfield name="uid" label="User Name"/>
<s:password name="pass" label="Password"/>
</s:form>
</div>
以上源码:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form id="Register" action="Register.action" method="post">
<table class="wwFormTable">
<tr>
<td class="tdLabel">
<label for="Register_uid" class="label">User Name:</label>
</td>
<td>
<input type="text" name="uid" value="" id="Register_uid"/>
</td>
</tr>
<tr>
<td class="tdLabel">
<label for="Register_pass" class="label">Password:</label>
</td>
<td>
<input type="password" name="pass" id="Register_pass"/>
</td>
</tr>
</table>
</form>
</body>
</html>
推荐答案
默认情况下 Struts2 使用 xhtml 主题，它用表格布局包装输入字段.表格布局利用其元素的独特定位，使用行和列.不能在同一行显示两行.
By default Struts2 is using xhtml theme, that wraps input fields with the table layout. A table layout utilizes unique positioning of its elements, using rows and columns. You can't display two rows on the same line.
另一方面，有一个主题 css_xhtml 正在使用
On the other hand there's a theme css_xhtml that is using
基于 CSS 的标准两列布局，用于 HTML Struts 标签(表单、文本字段、选择等)
Standard two-column CSS-based layout, using for the HTML Struts Tags (form, textfield, select, etc)
您可以更改元素的样式以显示内联.如果为 textfilds 生成 divs，您可以使用样式 dysplay: inline-block
you can change the style of elements to display inline. If divs are generated for textfilds them you can use a style dysplay: inline-block
内联块值
很长一段时间以来，可以创建一个填充浏览器宽度并很好地包裹的盒子网格(当浏览器调整大小)，通过使用 float 属性.然而，display 属性的 inline-block 值使得这个更容易.
However, the inline-block value of the display property makes this even easier.
inline-block 元素类似于 inline 元素，但它们可以有一个宽度和高度.
inline-block elements are like inline elements but they can have a width and a height.
代码:
<style>
.floating-box {
display: inline-block;
}
</style>
<s:form action="Register.action" theme="css_xhtml">
<s:textfield name="uid" label="User Name" cssClass="floating-box"/>
<s:password name="pass" label="Password" cssClass="floating-box"/>
</s:form>
