hil*_*llz 8 html css alignment
我想在一行中创建4个textareas,每个都有自己的标题,这是我想要做的例证:

我试过这个:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<div style="float:left;">
<p>
title1<br />
<textarea cols="15" rows="15">
textarea1
</textarea><br />
title2<br />
<textarea cols="15" rows="15">textarea2</textarea>
</p>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
相反,它在2行中创建2个textareas,我想在一行中有4个textareas,并且每个textarea都有一个标题.我怎么做?
为了使其更加完美,为每个 div 添加一个公共类并应用 css,如下所示:
网页
<div class="inline-div">
<p align="center">Title 1</p>
<textarea cols="15" rows="15" class="inline-txtarea"></textarea>
</div>
<div class="inline-div">
<p align="center">Title 2</p>
<textarea cols="15" rows="15" class="inline-txtarea"></textarea>
</div>
<div class="inline-div">
<p align="center">Title 3</p>
<textarea cols="15" rows="15" class="inline-txtarea"></textarea>
</div>
<div class="inline-div">
<p align="center">Title 4</p>
<textarea cols="15" rows="15" class="inline-txtarea"></textarea>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
.inline-div {
display:inline-block;
}
.inline-txtarea {
resize: none;
border : 2px solid red;
height:125px;
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
7036 次 |
| 最近记录: |