如何在React中以全屏尺寸填充图像?
我看了很多博客和代码,但所有这些都不适合我。
请帮帮我。
谢谢!
答案 0 :(得分:0)
对于React-Native,您需要使用 flex 属性。
var ImageCtner = React.createClass({
render: function() {
var url = '/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';
return (
<div className='full-page-image'>
<img src={url} />
</div>
);
}
});
//render you component here...
=================以下是网页====================
实际上 React 只是简单地渲染您的组件并为您提供其他好处,例如易于组合您的组件。 它不会改变基本概念网页的工作方式。
你可以这样做,
.full-page-image {
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
}
.full-page-image img {
width: 100%;
height: 100%;
}
然后在你的样式文件中,你可以写下你的风格。
{{1}}
希望这可以解决您的问题,并随时提出任何问题。 :)