两个div之间的垂直线？
两个div之间的垂直线可以通过CSS样式来实现。以下是一种常见的方法：
- 使用border属性：给其中一个div添加一个右边框，可以通过设置border-right属性来实现垂直线效果。例如：
- 使用border属性：给其中一个div添加一个右边框，可以通过设置border-right属性来实现垂直线效果。例如：
- 这样div1就会在其右侧显示一条1像素宽的黑色垂直线。
- 使用伪元素：可以使用::before或::after伪元素来创建一个垂直线，并将其位置设置在两个div之间。例如：
- 使用伪元素：可以使用::before或::after伪元素来创建一个垂直线，并将其位置设置在两个div之间。例如：
- 这样div1后面会生成一个1像素宽的黑色垂直线。
以上是两种常见的方法，具体使用哪种方法取决于需求和布局情况。另外，如果需要在垂直线上添加其他样式，可以根据具体情况进行调整。
注意：腾讯云作为一家云计算服务提供商，主要提供了云计算、人工智能、物联网、区块链等方面的解决方案和产品，但本回答不涉及具体的腾讯云产品推荐和链接。
相关·内容
6回答
在页脚部分，我有一个3 div(带有链接)水平地相邻(float:left;)。
每个div都有不同数量的链接。例如,
Div1 Div2 Div3
| Contact | Feedback | Support Center
| Delivery | Bonus Points | Order Notes
| Team | Newsletter
| Service
这里，Div1只有两个链接，左边的垂直线是短的
浏览 0提问于2013-11-06得票数 0
回答已采纳
3回答
我在定位垂直线时遇到了问题。这是一个项目：https://prnt.sc/wp2vh4 div class="col span-1-of-2" 来分隔这两个列表，但是-在它们之间的“中心”有一条灰色的垂直线。当我设置第一个div的边框为右边时，它也在右边。怎样才能使这条线更居中呢？ 有两个元素是阻塞的-它应该是与之相关的东西吗？但我不想“破坏”专栏系统。
浏览 40提问于2021-01-15得票数 0
请帮我解决这个问题：
我有一个用X轴作为最近三个月的图形，Y轴作为花费的金额。
我使用了两个散点图，一个用于绘制数量上的变化，第二个是在屏幕上的手指上移动的垂直线。
我已经实现了垂直线在拖动上移动的特性。
我需要得到我的垂直线和线图相交的值，并在底部显示这些值。请让我知道如何在拖线过程中检索值。我已经实现了从下面的位置中提到的Github读取代码的垂直行。
浏览 0提问于2015-06-16得票数 1
我想在两个divs之间画一条垂直线，我知道，水平线有hr，竖线没有。不需要使用border就能成功吗？
<style>
#wrapper_1 {
background-color:pink;
height:100px;
float:left;
width: 100px;
}
#wrapper_2 {
background-color:brown;
height:100px;
width: 100px;
float:right;
}
</style>
<div id="wrapper_1&#
浏览 3提问于2016-03-16得票数 14
回答已采纳
4回答
当我尝试构建一个比通常更复杂的布局时，我有时会与div混淆。
我做了一个简单的例子，说明我目前的问题是什么：
编辑:更新的jsFIDDLE抱歉，有点混乱，但我只是想让它开始工作。正如你所看到的，我在其中一条垂直线上强制了一个高度(但没关系。那条线应该是固定高度的)。我遇到问题的垂直线是“下载图片”和“下载视频”之间的垂直线。
<div id="wrapper">
<div id="first"></div>
<div id="second"></div>
<
浏览 9提问于2013-08-14得票数 0
回答已采纳
一页里有两张线图。我正在用高级图表来绘制图表。
我想移动一条垂直线与鼠标移动，并想找出每一个图形的数据点，在垂直线相交的图形。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
&
浏览 3提问于2013-12-13得票数 0
回答已采纳
3回答
我希望两个div是“浮动-左”和“浮动-右”与“显示:内联块”。
我做这件事没问题。但是现在，我需要在它们之间插入一条垂直线，然后做这个，两个div的对齐就出错了。
有人能帮我吗？
浏览 3提问于2014-02-23得票数 2
回答已采纳
如何在div的中间放置一条垂直线？也许我应该把两个div放在div里面，一个放在左边，另一个放在右边？我有一个DIV标签，我需要把一个ascx放在左边(它会不时地与另一个ascx交换)，然后在左边放一个静态ascx。我该怎么做，有什么建议吗？也许我已经回答了我自己的问题。
任何指针都是很棒的
浏览 0提问于2009-07-24得票数 52
看看第三个示例 (在添加自定义文本和注释的部分)。如果放大图表，可以看到该示例在date '2007-12-01'上插入了一条垂直行。如果日期是一个交易日(如'2007-11-29')，人们就会看到垂直线穿过当天中间的烛台。
我想在两个日期之间画一条垂直线(例如在11月29日和11月30日之间--在上面例子中v线之前的两个烛台)。我怎么能这么做？
浏览 4提问于2017-07-06得票数 4
回答已采纳
正如图像中提到的，我有两个div向上和向下放置。我想在这两个div之间画一条垂直连接线。我用管道字体来做这件事。但是，它看起来不雅致。有人能帮我在div之间画一条优雅的垂直线吗？
浏览 4提问于2022-02-09得票数 -1
1回答
我想创建一个登录表单，在他的右侧有一条垂直线。这两个文件都包含在div中，下面是代码
<div id="logindAndRegistra">
<div id="sezionesx">
<div class="scritta" id="loginHeader">Login</div><br />
<div class="scritta">Username <input id="usernam
浏览 0提问于2013-04-08得票数 0
回答已采纳
我需要一些帮助来解决HTML中的问题。
我在两个字段之间创建了垂直线，但在垂直线和第二个字段之间有前导空格。如何使用带有CSS的HTML根据文本来减小这些间距和行高？
下面是CSS的代码
.row.vertical-divider {
overflow: hidden;
}
.row.vertical-divider > div[class^="col-"] {
padding-bottom: 3px;
border-right: 1px solid #000;
}
.row.vertical-divider div[class^="col-"
浏览 19提问于2017-03-15得票数 0
回答已采纳
3回答
我有一个大容器，里面有两个div，我想用垂直线分隔这些内部div，我把我尝试过的东西写下来，在另一个例子中，CSS代码工作正常，但在本例中不能工作。HTML
<div class="rowFrame">
<div class="col-sm-6">
<h3>Info:</h3>
<p>About</p>
<p>About</p>
</div>
<div class="
浏览 5提问于2015-03-14得票数 1
回答已采纳
3回答
我在一个独特的容器div中有两个盒子和一条垂直的div线(下面的代码和小提琴)。
我使用CSS网格在容器中定位元素
我想要完成的是使用垂直线根据垂直线的位置水平调整两个框的大小。
我很抱歉，如果这个问题是无意义的，我是网络开发的新手，以前只使用过Python，已经尝试过google和stackoverflow搜索，但所有的解决方案似乎都过于复杂，通常需要额外的库，我正在寻找更简单的东西和JS。
HTML：
<div class="wrapper">
<div class="box a">A</div>
<div
浏览 7提问于2017-10-25得票数 48
2回答
我正在尝试用bootstrap设置一条垂直线，中间有按钮。
使用Bootstrap简单的垂直线：
<div class="row">
<div class="col-md-6" style="padding-right:20px; border-right: 1px solid #ccc; " >
Area 1
</div>
<div>
Area 2
</div&g
浏览 0提问于2015-10-13得票数 0
1回答
第二y轴和垂直线
、、、
我正在使用以下代码创建小提琴曲：
import seaborn as sns
ax = sns.violinplot(data=df[['SoundProduction','SoundForecast','diff']])
ax.set_ylabel("Sound power level [dB(A)]")
它给了我一个折叠式的结果：
有没有办法在第二个y轴上绘制diff，使所有三个系列都清晰可见？
另外，有没有办法在两个系列之间绘制一条垂直线？在这种情况下，一旦在两个不同的轴上绘制了SoundForecast和dif
浏览 0提问于2018-11-01得票数 1
回答已采纳
1回答
我正在使用Sublime Text 2。我想获得垂直线，以帮助我理解我的<div>在哪里结束。我有附件截图，请通过它。
请告诉我如何启用从<div>到</div>的垂直线。
浏览 3提问于2014-09-30得票数 0
如何使用css来调整垂直线的大小？我需要我的垂直线来匹配框架的大小。垂直线必须在中间，必须将框架分成两个相等的尺寸。或者有没有其他方法输出垂直线？下面是我的html和css代码：
body {
background-color: rgb(40, 40, 40);
}
.card {
text-align: center;
padding-left: 20%;
padding-right: 20%;
background-color: rgb(40, 40, 40);
}
#myPug {
width: 300px;
height: 300px;
bord
浏览 1提问于2018-02-20得票数 0
回答已采纳
1回答
我有一些显示项目列表的代码，这些项目的左侧有一条垂直线。垂直线由下面div定义中包含的snippet1-sections类触发。
如果我想让垂直线显示在平板电脑和台式机上，而不是手机上，那么在不重复手机版本的整个项目列表的情况下设置垂直线的最佳方法是什么？我可以在css中这样做吗？
<div class="row-fluid snippet1-sections">
My list of items...
</div>
css：
.snippet1-sections{
background:url('../../graphics/
浏览 2提问于2015-03-16得票数 0
1回答
我希望在div class="col-md-4“和div class="col-md-8”之间的垂直线上的某些地方有厚点。
下面是我尝试过的
<div class="col-md-4" style="border-right:1px solid #333;">
<h1>1987</h1><p>lorem ipsom .........</p>
<h1>1990</h1><p>lorem ipsom .........</p>
<h1&
浏览 2提问于2019-04-22得票数 0
回答已采纳
6回答
在谷歌搜索和查看Stack很长一段时间后，我只找到了一些方法来确定一个点是否落在连接两个点的那条线上。不幸的是，这不是我需要的。
请参阅此问题末尾的图像。我为这张糟糕的照片提前道歉，但它抓住了要点(明白了吗？)穿过。
我需要创建两条垂直线来连接x点和y点，它们需要与x点和y点的垂直线相交，然后我需要判断z点是否出现在这两条线之间。
任何帮助都是非常感谢的。耽误您时间，实在对不起!
浏览 0提问于2015-04-25得票数 3
2回答
我们在SVG中有一个带背景的按钮，在Chrome的右边有一条垂直线-但只有在桌面(Chrome版本90.0.4430.93)，而不是Firefox。我在试着去掉垂直线。如何删除垂直线？ 网站为https://en.speedymatch.com/，截图： ? HTML是： <div class="form-group"> <div class=""> <input type="submit"
name="submit"
value="Create an account&#
浏览 81提问于2021-05-09得票数 0
回答已采纳
0回答
离子项目列表中的垂直线
、、、、
我使用Ionic和html，并尝试在ion-list中的ion-item内放置一条垂直线。我想要这样的东西(‘all-day’后面的彩色线条)：
我尝试过这样的东西：
<ion-list>
<ion-item *ngFor=let item of items>
<div class="verticalLine"></div>
<div class="line-break">{{ item.longStringFromTSFile }}</div>
</ion-i
浏览 2提问于2018-07-15得票数 2
1回答
我在两个div之间的垂直线有问题。
我的代码：
.one, .two{
width: 100%;
display:block;
height:200px;
}
如果我把边境线往右或左放，那也帮不了我解决问题。
有什么想法吗？
谢谢。
浏览 4提问于2014-11-07得票数 1
回答已采纳
我认为这可能是一个古老的问题，但我很难找到答案。我有一个父div和两个子div，使用display:inline block (用于表格结构。
我想在两个子div之间有一条垂直线，所以我添加了另一个子div作为div。
它的工作方式是-如果任何子div有更多的内容，那么在父div中应该有垂直滚动条。
现在我遇到的问题是--当我在parent中得到一个滚动条时，div没有接触到parent div的下边框。有一个差距。我需要它一直被触摸到底部。
HTML
.container {
border:1px solid red;
display:block;
width:200px;
浏览 0提问于2015-04-09得票数 0
2回答
我想在DIV中画一条垂直线。
然后我想在垂直线上分层img。(图为我想要的结果)
因为我的源代码是这样的。
<div style="background-color:gray;width:1px;height:100%;"></div>
<img src="circle.png">
<img src="triangle.png">
我如何分层这些元素？
浏览 1提问于2019-11-02得票数 0
回答已采纳
4回答
嘿，伙计们，我想知道如何找到相对于表面法线的垂直线。
例如，假设我有(0,0,1)，那么预期的输出将是(1,0,0)和(0,1,0)。实现这一目标的最佳途径是什么？
我意识到我将使用交叉乘积，但这需要两个向量，如何得到我的第一条垂直线？
谢谢!
浏览 0提问于2010-09-20得票数 4
回答已采纳
1回答
我在页面中央放置了一条垂直线。但是我希望这条线与垂直线div所在的容器是满的。当我使用height: 100%时，在垂直线条div上，线条只能达到我的显示器分辨率的高度。这是线路的CSS：
.line {
border-left: 6px solid #3C948B;
margin-left: -3px;
height: 100%;
position: absolute;
left: 50%;
z-index:-5;}
浏览 0提问于2018-09-14得票数 0
我们需要在单元格的中间显示一条垂直的虚线，垂直线的高度应该根据行数增长，参考红框2的垂直线在附加的图片中，我们还需要显示两条垂直线之间的连接箭头，参考红框1的水平箭头。
我们尝试在垂直线上使用角度材质分割器，但效果并不理想。我们尝试创建一个没有角度材料的普通HTML表格，并将CSS应用于表格，tr，td，这也不能像预期的那样工作。我们尝试了以下方法：
.verticalLine {
border-left: thick solid #ff0000;
}
<div class="verticalLine"></div>
例如:2
<m
浏览 1提问于2019-10-29得票数 0
1回答
我有两个点PointA和点B，用红点表示。 ? 当直线水平时，我可以计算由绿点表示的垂直点(顶部垂直线，底部垂直线)。 当直线有坡度时，我如何计算垂直线。 ?
浏览 19提问于2020-09-16得票数 0
回答已采纳
如何使用动态jasper接口添加垂直线。
我需要显示一条垂直线作为列分隔符，如何使用动态jasper API来实现这一点？
浏览 9提问于2015-05-05得票数 0
3回答
我正试图创建一条垂直线，将两个div与字OR分隔在行的中间。我想要垂直线跨越整个高度，而不是他们现在是每1 1px。css需要响应，表单字段的高度根据选择的不同而改变，所以我不能使用固定的高度。
<section>
<div class="row">
<div class="col-md-5">FORM FIELDS LEFT</div>
<div class="col-md-2">
<div class="col-
浏览 3提问于2015-04-01得票数 1
回答已采纳
不幸的是，我不知道正确的术语，但每个人都看到了这个功能:有两个div容器并排在一起，中间有一条垂直线；通过向左拖动这条线，左边div的宽度缩小，而右边div的宽度随着句柄的位置增加，反之亦然。我怎样才能用javascript，甚至更好的jQuery来实现这一点呢？
作为来自另一个上下文的说明，这里有两个用户界面的屏幕截图：
浏览 1提问于2015-03-12得票数 1
3回答
我需要能够用一条垂直线来分隔这两列：
<div class="container">
<div class="row">
<div class="col-md-6">
<p>some text here </p>
</div>
<div class="col-md-6">
<p>some more text here</p>
</div>
</
浏览 0提问于2015-01-08得票数 6
回答已采纳
我有一些非常简单的HTML/CSS来创建垂直线：
.verticalLine {
height: 100%;
border-left: 1px solid black;
}
.root {
height: 100%;
width: 100%;
}
<div class="root">
<div class="verticalLine"></div>
<div>
虽然这可以在Chrome中使用，但在Safari中根本不能渲染。如果您将内容放入div中，它将呈现该行，但仅呈现您放置在d
浏览 6提问于2020-11-05得票数 0
1回答
我有两个Windows窗体工具条，其中包含窗体上的一些控件。然而，出于某种奇怪的原因，它们在右侧包含一条垂直线。我找不到任何属性来删除它们，我也找不到任何其他关于如何在网上删除它们的信息。
有人能帮上忙吗？提前谢谢。
浏览 9提问于2012-08-09得票数 3
回答已采纳
我有两个UIScrollView实例，我想在它们之间画一条垂直线(不是100%的高度，更像是80%)。我如何才能做到这一点？
浏览 0提问于2011-01-14得票数 0
回答已采纳
大家好..。
我是reactjs的新手。
我试着使用bootstrap在行中制作卡片，但它只产生了垂直线。
我尝试在div中使用row，但由于映射关系，它显示在垂直线上，而不是水平方向上。
我是reactjs的新手。
我试着使用bootstrap在行中制作卡片，但它只产生了垂直线。
我尝试在div中使用row，但由于映射关系，它以垂直线显示，而不是水平显示
下面是我用card.jsx编写的代码
import "./Card.scss"
function Card(props)
{
return (
<div>
<div
浏览 40提问于2021-05-30得票数 0
3回答
我正在尝试两个divs之间的垂直线。但我不希望它和divs的高度相同。我需要从顶部和底部各切10%。
.container {
display: table;
border: 1px solid blue;
}
.line {
padding-right: 20px;
border-right: 1px solid #cfc7c0;
}
.first {
display: table-cell;
width: 30%;
}
.second {
display: table-cell;
width: 30%;
padding-left: 10px;
}
&
浏览 2提问于2014-10-24得票数 4
回答已采纳
4回答
我有以下HTML结构
<div id='parent'>
<div id='child-1'>Some text goes here</div>
<div id='child-2'>Different text goes here</div>
<div class='clear'></div>
</div>
我还有以下CSS
#parent {
width: 800px;
position: re
浏览 6提问于2013-08-04得票数 9
回答已采纳
2回答
我有一个包含许多行的文本区，我想添加一个滚动条并只显示前3行，如何做到这一点?？
有人能帮我吗?我整晚都在试着让它工作，但它没有显示垂直线，它只显示了两个箭头，不能滚动。
这就是我想要做的
<div style="width:=100%;height:50%; overflow:scroll; overflow-x:hidden;">
<?php print "$blabdisplaylist"; ?>
</div>
浏览 0提问于2013-05-11得票数 0
回答已采纳
我想要创建一种时间线(水平线: div)，其中有些数据来自我的数据库，有一个创建日期。我想把一种标记(垂直线)与这个日期自动在时间线上。
问题是，这个时间线是一个div，具有固定大小(响应速度，但大小以%为单位)，因此当时间线上有新数据时，其他时间线必须调整大小。例如，如果我有三个日期:2009-2010 -2045，当然，2010年到2045年之间的空间要比2009年和2010年多……
你有什么建议/算法去做吗？
提前致谢
浏览 5提问于2013-08-07得票数 0
回答已采纳
0回答
一个奇怪的渲染小错误
、、、
当我渲染我的CSS标签时，有两个小的“bug”。如果我按第三个制表符，那么左边的垂直线就消失了。在手册中的示例中，这并没有发生，当我按下"third“时，行就在那里。我想知道代码会出什么问题。
$(function () {
$('.menu .item').tab();
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css" rel="stylesheet" />
<script sr
浏览 7提问于2016-07-09得票数 1
回答已采纳
1回答
xcode资产切片中线的含义？
、、、、
官方文件：
3条垂直线：-左线显示左不可拉伸区域-右线显示右不可拉伸区域，但不明白中间垂直线实际上是做什么的。你能解释一下它是怎么工作的吗？
浏览 4提问于2018-01-10得票数 5
回答已采纳
是否有更好的方法来确定与垂直线相交的两个线段的顺序？顺序是根据交点的y坐标.简单的方法是计算交点并进行比较。
浏览 4提问于2012-06-11得票数 0
3回答
我的页面上有一些方形的div，就像按钮一样。在不旋转整个正方形的情况下，怎样才能使垂直线倾斜一点呢？
我希望使一个方块看起来像图1(绿色)，而不是图2(红色)
这是可能的通过css还是我应该使用图像？
html:
<div id="square"></div>
css:
#square {
width:50px;
height:50px;
display:block;
background-color:red;
overflow:hidden
}
浏览 6提问于2014-08-22得票数 0
回答已采纳
1回答
如果我有一条垂直线(它的x是0)和两个向量连接在一起形成一个线段，它是否可以“投影”在垂直线上的线段？
例如：
📷
如果我只有向量1和矢量2，会不会找到向量3沿垂直线的位置？
浏览 0提问于2018-10-16得票数 1
回答已采纳
1回答
在带有aero主题的Windows 7中，Windows资源管理器不会在详细信息视图中显示垂直线。
但是任务管理器显示了这些行。
有没有办法隐藏Win32应用编程接口的ListView中的垂直线？
浏览 16提问于2017-01-15得票数 1
2回答
所以我的问题是，我的li中的每个a标记都有一些垂直线。当我放入border-bottom时，这行代码并没有填满所有的像素；它缺少看起来像一两个像素的东西。
<div id="Nav_Bar">
<nav>
<ul>
<li id="Forside">
<a class="active <?php selected("index") ?>" href="../index.php&#
浏览 1提问于2015-12-27得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
