我的网站在电脑屏幕上显示正确,但在智能手机上却不正确。
正如你所看到的,主标题(植物)被削减和和三个按钮没有居中。
我的代码:
<div class="col-12">
<div class="row">
<div class="col-12">
<h1 class="mg-md h1-welcome-to-style tc-black">Bienvenue à la</h1>
<h1 class="mg-md h1-bloc-0-style tc-black"><span style="font-size: 2rem !important;">FACULTÉ DE PHARMACIE DE L'ULB</span></h1>
<h1 class="mg-sm tc-black h1-3-style"><span style="font-size: 70px !important;">PHYTOTHÉRAPIE</span></h1>
<h2 class="mg-md tc-black h2-1-style"></h2>
</div>
</div>
并且对于3个块:
<div class="phyto-container" onclick="location.href='{{$route}}';">
<div class="phyto-front" style="background-image: url({{$bgImage}})">
<div class="phyto-inner">
<p>{{ $titleFront }}</p>
</div>
</div>
<div class="phyto-back">
<div class="phyto-inner">
<div>
@foreach($paragraphs as $p)
<p style="font-size: 1.1rem;margin-top:-10px !important; margin-left:-1px !important;">{{ $p }}</p>
@endforeach
</div>
</div>
</div>
网站的URL为https://overlap.ulb.be/public/
提前感谢您的帮助。
3条答案
按热度按时间u5i3ibmn1#
您是否尝试过右边距:10 px;在标题上?
63lcw9qa2#
在您的style.css中添加以下内容:
并将其添加到ID:
刷新页面或清除缓存以查看更改。
zpqajqem3#
你需要让你的网站响应,你可以使用框架,列,行,容器,或媒体屏幕。