我创建了一个图像悬停,当我悬停覆盖文本图像时,屏幕上出现一些文本,图像是响应式的,我想将文本宽度设置为等于图像宽度,当更改屏幕尺寸时,文本宽度应随图像而变化宽度,请帮助我 i'm using this css lib 如何创建函数来获取图像的宽度并将其设置为文本宽度?
const About = () => {
return (
<div className="bucket">
<div class="row">
<div class="col-sm-8 mainOne">
<figure class="imghvr-shutter-in-horiz">
<h1 className=" text animated bounceInLeft delay-2s">A Front-End Dev...</h1>
<figcaption>
<img
className="responsive"
src="https://netbramha.com/wp-content/uploads/2016/12/senior-front-end-developer-openings-1.gif"/>
</figcaption>
</figure>
</div>
<div class="col-sm-4 mainTwo">
<div className="col">sub one</div>
<div className="col">sub two</div>
</div>
</div>
</div>
)
}
CSS
.responsive {
width: 100%;
height: auto;
}
最佳答案
您可以使用可用的类填充
.responsive{
width: -webkit-fill-available;
}
关于javascript - 当屏幕尺寸变化时如何获取图像宽度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54290598/