Jade file
======
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
div(id="topBar")
h1(id="title") title
form(id ="loginForm",name="input", action="html_form_action.asp", method="get", align="right")
table
tr
td
key(for = "username") Username
td
input(id="username",type="text", name="user")
td
key(for="password") Password
td
input(id="password",type="password", name="pswd")
input(type="submit", value="Login")
div(id="content")
h1(id="slogan") Slogan
CSS File
=========
body {
margin: 0;
background-color: lightgrey;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
p {
font-family: sans-serif;
}
#topBar{
top: 0;
left: 0;
position: absolute;
width: 100%;
background-color: darkcyan;
color: white;
}
#title{
margin-bottom: 2%;
margin-right: 2%;
margin-left: 5%;
margin-top: 2%;
float: left;
display: inline;
}
#loginForm {
float: right;
position: relative;
margin-bottom: 2%;
margin-right: 2%;
margin-left: 5%;
margin-top: 2%;
display: table;
font-family: cursive;
}
#content{
display: inline-block;
}
h1{
font-family: cursive;
}
a {
color: #00B7FF;
}
嘿,我是Jade和节点js的初学者。我试图建立一个简单的登录页面。但我的div标签重叠请求帮助。我尝试溢出:隐藏和其他东西,但没有发生任何事情。我想垂直放置这两个div标签。
答案 0 :(得分:1)
我有类似的问题。显示:div上的内联块被另一个重叠解决了我的问题。