如何将文本放置在图像轮播旁边
如何将文本放置在图像轮播旁边
提问于 2020-04-27 05:03:28
大家好，我试图使半页图像旋转木马和右边的图像旋转木马，我试图把一个段落与文字。以下是我的代码
旋转木马
<section id="domov">
<div id="Slider" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#Slider" data-slide-to="0" class="active"></li>
<li data-target="#Slider" data-slide-to="1"></li>
<li data-target="#Slider" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="Slike/SpaceHippie3.jpg" alt="SpaceHippie">
</div>
<div class="item">
<img src="slike/SpaceHippie4.jpg" alt="SpaceHippie">
</div>
<div class="item">
<img src="slike/SpaceHippie5.jpg" alt="SpaceHippie">
</div>
<h1 id="Text1">TEST</h1>
</div>
</div>
</section>CSS
#domov{
width: 48%;
padding-left: 50px;
display: flex;
position: sticky;
float: left;
}
#text1{
float: right;
}回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-27 05:12:36
你的代码应该是这样的：
<section id="domov">
<div id="Slider" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#Slider" data-slide-to="0" class="active"></li>
<li data-target="#Slider" data-slide-to="1"></li>
<li data-target="#Slider" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="Slike/SpaceHippie3.jpg" alt="SpaceHippie">
</div>
<div class="item">
<img src="slike/SpaceHippie4.jpg" alt="SpaceHippie">
</div>
<div class="item">
<img src="slike/SpaceHippie5.jpg" alt="SpaceHippie">
</div>
</div>
</div>
<h1 id="Text1">TEST</h1>
</section>
<style>
#domov{
width: 100%;
display: flex;
position: sticky;
}
#Slider {
width: 50%;
/* custom styling for your carousel */
}
#text1{
width: 50%;
text-align: center;
}
</style>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61448061
复制相关文章
相似问题
腾讯云开发者
