有没有办法在没有CSS的情况下并排对齐两个HTML元素？多么?
在没有CSS的情况下，并排对齐两个HTML元素是有办法的。可以使用HTML表格或者使用HTML的行内元素和块级元素的特性来实现。
- 使用HTML表格：可以将两个元素放在不同的表格单元格中，并设置表格的边框为0，这样就可以实现并排对齐。示例代码如下：
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>元素1</td>
<td>元素2</td>
</tr>
</table>- 使用行内元素和块级元素：行内元素默认是不占据整行的，可以将两个元素设置为行内元素，然后使用块级元素包裹它们，通过设置块级元素的宽度来实现并排对齐。示例代码如下：
<div style="width: 100%;">
<span style="display: inline-block;">元素1</span>
<span style="display: inline-block;">元素2</span>
</div>这样就可以在没有CSS的情况下实现并排对齐两个HTML元素。
请注意，以上方法只是在没有CSS的情况下的一种临时解决方案。在实际开发中，建议使用CSS来控制元素的样式和布局，以获得更好的灵活性和可维护性。
相关·内容
下面是两个相同的div：
HTML
<div id="left"></div>
<div id="right"></div>
CSS
#left, #right
{
width: 100px;
height: 40px;
border: 1px solid gray;
display: inline-block;
}
这些渲染只是罚款，作为两个相同的盒子并排(小提琴：)。
但是在一个div中有文本，而另一个中没有文本，它们就错对齐了！(小提琴：)
这..。
<div
浏览 4提问于2014-02-24得票数 4
回答已采纳
我有一个聚合物定制元素，这是一个页面。我正在使用铁-柔性布局元素来提供柔性盒类。我的网页内容区域包含三个纸卡元素，排列如下：
<div class="layout vertical center">
<div class="layout horizontal wrap">
<paper-card class="daily layout vertical">...</paper-card>
<paper-card class="extras layout vertic
浏览 0提问于2016-01-22得票数 1
回答已采纳
有没有可能在不使用css的情况下在html中并排创建两个div？
我找不到任何解决方案，并以某种方式相信，这是不可能的纯html。
我没有机会使用css，因此唯一的解决方案只有html是必需的。
浏览 0提问于2020-10-18得票数 0
给定网页上两个并排的框-一个包含标题和一个段落，另一个只包含一个段落-我如何使用纯HTML/CSS对齐段落的顶部？也就是说，不使用空头(例如<h2> </h2>)或JavaScript？
下面是一个说明这个难题的小提琴手：
为无头段落估算合适的margin-top (如上面的jsfiddle所示)似乎是徒劳的练习，因为不同的浏览器在字体大小上总是有细微的变化。没有办法让他们完美地对齐。举个例子:在Chrome中，上面的jsfiddle是完全对齐的，但在Firefox中却是3 3px：
这是在无头框的标记中创建丑陋的空标题的唯一方法吗？这是我在
浏览 7提问于2013-12-16得票数 1
回答已采纳
3回答
我有一个并排有2张图片的div。标签之间有一个空格分隔。因此，两个图像之间有一个空间。有没有办法使用css来隐藏div中的空格(或文本)？
浏览 0提问于2010-03-20得票数 2
回答已采纳
如何让两个div标签与CSS水平对齐？
我有两个div标签。一个包含文本，另一个包含图像。它们都是并排的，我希望第一个div中的文本与图像的底部对齐。图像在文本的右侧。
或者应该是这样的。当我使用各种CSS选项时，事情开始跳跃。
浏览 37提问于2010-05-28得票数 0
什么是最简单的方法来对齐滑块与其右边的滑块的值？而不使用外部库。就用HTML5？为此我需要使用CSS吗？多么?
updateTextInput('0');
function updateTextInput(val) {
document.getElementById('amount').value = val; //update current slider value
// do other action here
}
<input type="range" id="rangeInput" name="
浏览 1提问于2018-02-23得票数 3
回答已采纳
5回答
我正在尝试并排对齐两个div。这两个div都包含在另一个div中。
这是我写的HTML和CSS代码，它出错了。
HTML：
<div id="content">
<div id="main"></div>
<div id="sidebar"></div>
</div>
CSS：
#content {
width: 1000px;
}
#sidebar {
width: 200px;
float: left;
浏览 0提问于2013-05-15得票数 0
有没有办法强制div并排出现在页面上，而不是一个接一个地出现。
假设我有像这样的主div，它有许多子div。
<div id='main'>
<div>my content 1 </div>
<div>my content 2 </div>
<div>my content 3 </div>
<div>my content 4 </div>
<div>my content 5 </div>
<div>my content 6 </
浏览 0提问于2011-12-21得票数 1
回答已采纳
我想显示两个具有宽度和高度并排的<div>元素.我将inline-block应用于<div>s，但左侧元素的位置很奇怪：
HTML：
<body>
<div id="myDivTag">content</div>
<div id="map-canvas">for google map API</div>
</body>
CSS：
#myDivTag, #map-canvas {
display: inline-block;
h
浏览 4提问于2016-01-11得票数 5
回答已采纳
2回答
对齐列表中的图像
、、
我希望我的两个图像是并排的，所以我使用一个列表将它们放在一个或另一个旁边，尽管我不确定如何将这些图像移动到页面的中间，同时保持它们并排！另外，我应该使用列表或div来并排获取图像吗？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jacques Andre</title>
<link rel="stylesheet" type="text/css" href="
浏览 0提问于2018-02-12得票数 0
回答已采纳
9回答
我感兴趣的是看到一个很好的diff算法，可能是在Javascript中，用于呈现两个HTML页面的并排比较。我们的想法是，diff将显示所呈现的HTML的差异。
为了清楚起见，我希望能够看到渲染输出的并排差异。因此，如果我删除一个段落，并排视图将知道如何正确地间隔。
@Josh就是这样。尽管它可能会将删除的文本显示为红色或其他什么。这个想法是，如果我使用WYSIWYG编辑器编辑我的HTML内容，我不想切换到HTML来做差异。我想用两个WYSIWYG编辑器并排来做。或者至少在终端用户友好的问题上并排显示不同之处。
浏览 44提问于2008-08-28得票数 88
回答已采纳
2回答
离子4:
我有一个图片和标签在标签上，我希望两者都出现在中间，并排出现。
HTML:
<ion-item lines="none" [color]="'#F1F9FF'" class='all'>
<ion-img [class]="'vehicle-img'"
[src]="'./assets/icons/enem.png'">
</ion-img>
浏览 0提问于2019-03-12得票数 0
我到处寻找这个问题的解决方案，但我没有找到任何有效的方法。这是一个有点粗俗，所以我道歉，但我的CSS有点生疏。
所有我想做的是有两个div元素并排水平对齐，这将占用窗口的高度和宽度的100%。左侧的div将具有固定的宽度值，右侧的div将占用剩余空间。
解决方案可能真的很简单，我确信我遗漏了CSS的一个基本概念，这是导致这个问题的原因，所以如果你能帮我解决这个问题，也许你能告诉我一些文献来帮助我理解我做错了什么，我会非常感激的。
html代码：
<div id="leftSideBar">Left Sidebar</div>
<div id=&#
浏览 3提问于2013-07-22得票数 3
回答已采纳
1回答
有没有办法在用TCPDF生成的PDF文档中并排显示两个HTML表？
我尝试了内联CSS，但float: left和display: inline-block都不起作用。
我使用的是版本6.2.12。
浏览 3提问于2016-08-29得票数 0
我尝试了html元素和CSS的各种组合，但都无济于事。如何完成以下任务？
我有两个并排的DIVs，我想根据它们内容的宽度自动调整大小(为此使用了"display: inline-block“)。然后，我希望每个DIV的内容都与DIV的顶部对齐(默认情况下，内容是底部对齐的)。内容是许多标签(跨度)和文本(数据库数据)。另外，这两个DIV应该停留在页面左侧的另一个DIV的右侧，即菜单。
MENU AUTO ANOTHER
FIXED WIDTH COLUMN (DIV)
WIDTH DIV ALS
浏览 0提问于2012-05-05得票数 2
回答已采纳
1回答
我有一个使用视频标签和画布标签的HTML文件。我怎么才能让他们站在我这边的CSS呢？当前的示例代码添加了
如何将Video标签和Canvas标签并排对齐，如下图所示
当前屏幕设计：
预期的屏幕设计
浏览 5提问于2014-10-26得票数 0
2回答
即使调整了窗口大小，我也会尝试将HTML元素靠右对齐。我尝试过使用CSS
#goRight
{
align:right;
}
以及float:right: , text-align:right，但问题是，当我水平减小窗口的大小时，元素会被剪切出来并最终消失，这不是我想要的。有没有办法使元素保持在活动查看屏幕的右侧对齐？
<div id="address" class="tab">
Filter by:
<hr />
<div class="label"
浏览 3提问于2012-03-02得票数 1
回答已采纳
3回答
我有两个HTML表，这将是理想的并排放置在屏幕上。宽屏显示器可以解决这个问题，但在大多数老式显示器上，桌子太宽了，不能并排摆放。因此，我想使用css (如果可能的话，甚至只使用HTML )来并排放置表格，只有在分辨率足够高的情况下。
这通常会自动处理图像，但是有没有一种方法可以用在表格上呢？
浏览 0提问于2008-12-31得票数 0
回答已采纳
5回答
我想用CSS左对齐一个表格，就像标准超文本标记语言中的align=left一样，但我知道这不是一个好的形式。有没有办法做到这一点？如果没有，有没有办法在不使用表格的情况下格式化内容旁边的左对齐的链接列表？
浏览 0提问于2009-07-16得票数 11
回答已采纳
当两个条形图(一个水平的，一个垂直的)使用alt.hconcat并排显示时，即使图表的高度相等，标题也不对齐。有没有办法使标题对齐？
# Makes test dataframe
test = pd.DataFrame({"group":["a","b","c"],"value1":[4,5,6], "value2":[10,12,14]}).reset_index()
# Sets up vertical bar chart
chart1 = alt.Chart(test).mark_bar()
浏览 2提问于2019-11-10得票数 5
回答已采纳
我做了一个按钮，把它放在一个div，中间对齐div和按钮，但是按钮从它的最左边对齐，这使它看起来远离中心。有没有办法使它从它的实际中心对齐？
.btndiv{
width: 80%;
height: 500px;
margin: 0 auto;
text-align: center;
}
.testbutton{
position: absolute;
bottom: 0px;
width: 30%;
height: 50px;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet
浏览 2提问于2018-10-31得票数 1
回答已采纳
1回答
我试图通过使用内联块来并排放置两个div。出于某种原因，我在其中一个div看到了一个很大的空空间。
我在做了一支笔
有问题的div是带有..input区域的div。如果我从. is中删除display:inline-block，空空间就会消失，但是这样我就无法将这两个div并排放置。
在不使用float的情况下，有没有解决这个问题的方法？
浏览 2提问于2014-03-13得票数 1
回答已采纳
我正在尝试制作一个有两个并排的框的网页，里面填满了内容(文本/图像等)。这是我代码的一部分
HTML：
<p><b>Text Here</b></p>
<div id="col1">
test
</div>
<div id="col2">
</div>
CSS：
#col1 {
margin-right: 25px;
}
#col2 {
margin-left: 25px;
}
#col1, #col2 {
background
浏览 1提问于2013-05-16得票数 0
回答已采纳
3回答
在我的HTML文档中，我有一条消息和一个单选框。我想要这两个并排展示。消息左对齐，上对齐；单选框右对齐，上对齐。我尝试对容器使用CSS "display:inline“，但不起作用。代码如下：
HTML：
<div id="test-div">
<p>Current time: <span id="current-time"></span></p>
<fieldset id="fieldset-options">
<legend>My Opt
浏览 2提问于2012-11-10得票数 0
回答已采纳
3回答
我有两个div和两个H4头，它们需要在一行中。试图与文本对齐-对齐和浮动左，但它不工作。
根据我的理解，可以通过对元素使用浮动来实现并排对齐，但在我的情况下不是这样。也无法将它们集中起来。目前，我认为用30%的保证金是一个不恰当的解决办法。下面的图片显示了它目前的样子，以及我如何试图使它看起来。
<div class="k-legend-title">
<div class="k-stat-title-color-box" style="background-color: #3DA1ED;"></div>
&
浏览 5提问于2016-03-29得票数 2
回答已采纳
1回答
我试图使用flexbox创建一个三行布局，这是响应性的(可以有三行的多列)。
第二行(深蓝色框)应该自动增长，以便容纳内部的li数量。
底部行应该始终与页面底部对齐，以便在两列之间对齐未使用的惩罚(可能有更多的列，但两列似乎是一个很好的示例)。
我尝试过各种各样的东西，
将底部div设置为absolute和bottom: 0只会使其显示在第二行的顶部。
将align-self设置为结束和基线--它似乎没有做任何事情，所以很有可能我使用了它
我遇到的麻烦是将“未提供服务的罚款”分区与父分区的底部对齐。
任何帮助都将不胜感激--如果可能的话，我会尝试在不使用JS的情况下这
浏览 7提问于2015-01-18得票数 1
回答已采纳
1回答
我试着做一个有两行的按钮。我正在使用下面的html
<input type="button" value="line1 line2"/>
但在IE中，我得到了以下结果
有没有办法使用html或css来修复对齐？
浏览 1提问于2013-03-04得票数 1
回答已采纳
我刚在Github上更新了my profile readme，但我有个问题。我需要将两个元素垂直对齐，但是，当我尝试使用CSS时，我才发现it's impossible to use style attr on Github's Markdown files。那么，如何在没有CSS的情况下并排、垂直地对齐两个元素呢？我的代码： <details>
<summary>Minhas Estátisticas no Github</summary>
<p align="center">
浏览 12提问于2021-01-04得票数 0
回答已采纳
我有两个并排的div。两者具有相同的大小和display: inline-block。两者之间唯一的区别是，第一个有一些文本，而第二个是空白的。
HTML：
<div>1</div>
<div></div>
CSS：
div {
display: inline-block;
border: 1px solid black;
width: 50px;
height: 50px;
}
第一个div比第二个div低。
我知道所有可能的修复，比如向第二个div添加一些文本或 。当然，添加vertical-
浏览 2提问于2013-06-20得票数 5
回答已采纳
我的css不好，不能快速解决这个问题。
我有以下html，css代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
浏览 1提问于2011-08-19得票数 1
回答已采纳
1回答
如何创建网页来比较两个图像，最好只使用(X)HTML和CSS，而不使用JavaScript和DHTML / AJAX？
最简单的解决方案是将两幅图像并排放在一起，要么触摸，要么几乎触摸和居中，或者每一张都在自己的一半页面中居中。鲁棒解的问题是可降解的部件。
所讨论的两个图像不需要具有相同的大小，例如，一个可以调整另一个图像的大小；一个问题是是否使用HTML属性将它们缩放到相同的视觉大小，以及如果两个图像的宽度不相等，是否将其居中或对齐到页面的中心：
|_______|_______| |___xx___|
(以整体为中心)
|_______|_______| |____xx__|
(与页面中心
浏览 4提问于2009-05-09得票数 1
6回答
我有一个包含两个并排的div的div (#wrapper)。
我希望右div垂直对齐。我尝试了在我的主包装器上垂直对齐: wrapper，但它不起作用。它快把我逼疯了！
希望有人能帮上忙。
HTML：
<div id="wrapper">
<div id="left-div">
<ul>
<li>One</li>
<li>Two</li>
</ul>
</div>
<div id="r
浏览 0提问于2012-02-24得票数 92
回答已采纳
我有一个文本区域，在firefox上完全靠左对齐，但在chrome上，增加了一点空格。我不知道为什么它在那里，但我尝试了很多方法来摆脱这个空间，但就是做不到。
Chrome会将文本区域向右推2个像素。有没有人知道我做错了什么，或者有没有办法把它和chrome对齐？
下面是我的代码：
HTML：
<html>
<head>
<link rel="stylesheet" type="text/css" href="testdiv.css" />
</head>
<body>
<div
浏览 0提问于2013-01-26得票数 0
回答已采纳
1回答
我正在做一个Wordpress网站，将有英文和阿拉伯语的歌曲歌词并排。
示例页面：
您可以看到英文是左对齐的，阿拉伯是右对齐的。我在Wordpress CMS中手动完成了这一操作，方法是将右对齐HTML标记添加到html表中的每一行。
有没有办法设置站点范围的CSS自动右对齐站点上所有表格的右侧列？
我当前用来右对齐右列的代码是：
<td style="text-align: right;">
浏览 0提问于2019-08-08得票数 0
1回答
编辑器模板对齐两个组件
、、、、
我有一个使用Telerik网格的网格编辑器模板，在一个网格单元中我有两个kendo组件。我怎样才能让他们对齐相邻，也就是并排。
我尝试了一些css，并将它们放置在div和对齐浮点中，但是它们呈现在不同的范围内，并且不确定如何使它们并排，有什么想法吗？
目前，搜索按钮在自动完成文本框下面。
@model object
@*@Html.Kendo().AutoComplete().Name("LocationSearch").Placeholder("Type in your search item . . ").Filter("startswith
浏览 2提问于2015-01-16得票数 0
回答已采纳
1回答
我有一个像这样的html结构：
<div class="campain">
<div class="campainText">
<a href="#"><h2>Ny app til iPhone og iPad</h2></a>
<a href="#"><h2>Tips og vinn</h2></a>
</div>
<div class=
浏览 2提问于2011-10-14得票数 8
回答已采纳
3回答
我正在尝试创建一个可滚动的div，应该可以并排显示3个div。下面是我的html代码，下面代码的问题是它没有并排显示3个div而是一个接一个地显示。
<div id="myDIV2" class="mygrid-wrapper-div">
<h1>This is scrollable div </h1>
<div class="row row-list">
<div class="col-xs-4">
浏览 0提问于2018-01-08得票数 0
在Chrome Dev Tools的"Edit as HTML“中有自动对齐html的选项吗？我之所以问这个问题，是因为我想例如用额外的<div>包装代码
当我右击div with class title并选择"Edit as HTML“时，将会出现：
有没有什么办法来处理这些乱七八糟的东西并对齐这些标签呢？
浏览 0提问于2017-09-27得票数 1
2回答
我有一个.container和3个元素。容器是全宽的，它的子项靠左对齐。我想把所有的东西都放在中心。
这是一个布局
.container
.element1
.element2
.element3
这就是我想要的
.container {
.invisible-wrapper-with-css {
.element[1-3] {
}
}
}
我不想添加任何html。
有没有办法把.element[1-3]当作一个项目，或者有没有办法--只用CSS --把它们包装起来，这样我就可以给.element[1-3]子类的包装器一个margin: auto？
浏览 0提问于2016-06-08得票数 0
3回答
我有以下代码：
<html>
<head>
<style type="text/css">
#test img {vertical-align: middle;}
div#test {
border: 1px solid green;
height: 150px;
line-height: 150px;
text-align: center;
color: white
}
</style>
</head>
<body>
<div id="test">t<img cl
浏览 1提问于2010-09-26得票数 2
回答已采纳
1回答
import { categories } from './data/categories'
import { useState } from 'react'
import {Card} from 'antd' import './App.css';
import image1 from './assets/images/Resim.png';
const { Meta } = Card;
const CategoryCard = () => {
const [ca
浏览 4提问于2022-03-24得票数 1
我希望在SQL Reporting Services报表(表+矩阵)中并排显示两个表，以提供一个完整表的错觉。
问题是，一个表的行中的数据可能比另一个表的行中的数据多，因此行的高度可能不同。
有没有办法匹配/连接两个表中的行的高度。
浏览 0提问于2010-01-15得票数 2
2回答
我有以下HTML/CSS文档：
HTML：
<div class="test" >
<a>a</a>
<div></div>
<a >a</a>
</div>
CSS：
.test {
border: 2px solid;
font-size: 0;
}
.test > * {
text-align: center;
font-size: 20px;
border: 1px solid;
height:
浏览 1提问于2015-02-20得票数 3
回答已采纳
2回答
我想要做的非常简单:我希望我的leaflet控件在行中并排对齐，而不是按列垂直对齐(就像leaflet自动做的那样)。
下面是一些简短的示例代码：
library(shiny)
library(leaflet)
shinyApp(
ui <- fluidPage(
leafletOutput("map", width = "100%"),
tags$head(tags$style(HTML(".leaflet-control-layers-overlays {width: 190px;}")))
),
浏览 2提问于2017-03-03得票数 3
3回答
我有一个与标题高度相关的问题。
HTML：
<header>
<h1>
Hello World!
</h1>
</header>
CSS：
header {
background-image: url("../images/header.png");
background-size: cover;
height: 100%;
text-align: center;
color: white;
}
在这种情况下，页眉高度适合文本高度。有没
浏览 3提问于2015-05-31得票数 2
我有一个文本+图像并排，我想要一个功能，用户可以点击图像，使其放大。我是HTML/CSS的新手，所以我想知道如何才能做到这一点。谢谢!(演示-> )
有没有办法使用纯HTML/CSS而不使用javascript来做到这一点？
我找到的那些建议我使用javascript，比如：
<script type="text/javascript">
function showImage(imgName) {
document.getElementById('largeImg').src = imgName;
浏览 0提问于2015-04-15得票数 0
7回答
你能用CSS做圆帽下划线(如上图)吗？多么?
有没有办法用border-bottom做到这一点呢？border-radius会产生这样的时尚效果：
浏览 0提问于2013-06-11得票数 18
回答已采纳
所以我试着在没有垂直间隙的情况下并排对齐一些图像。每个图像的宽度是页面的20% (每行5个)，图像之间的高度不同。
有没有办法将它们垂直对齐(这样每个图像都直接位于它上面的图像的正下方，没有间隙，因为高度是随机的，所以一行中的所有图像都从上面高度最大的照片的结束处开始)？
照片的css
.photo {width:20%; height:auto;
margin: 0;
padding: 0;
float:left;
}
照片
<img src="" alt="imag
浏览 2提问于2017-06-14得票数 0
我无法将两个Div并排对齐，就像表格中的两列一样？有时它们会正确对齐，但有时右边的Div会显示在左边的Div下面，如果我刷新页面，div会返回到原来的位置。
如何配置它们，使div始终并排出现？
谢谢
浏览 0提问于2009-08-10得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
