이미지와 마찬가지로 내 콘텐츠는 세로 모드뿐 아니라 가로 모드에서도 잘 작동합니다 (이미지에 강조 표시되어 있음). 콘텐츠가 겹칩니다. 콘텐츠가 모든 사람에게 정상적으로 보이게하는 방법 장치 화면에? 내 설명이 길지만 설명이 짧으면 오버랩이 발생하지 않는 경우에만 발생합니다. 어떻게 hte 열 사이에 일정한 마진을 유지합니까? 1작은 화면에서 내용이 겹치다 부트 스트랩
코드 당신 ] 감사합니다
HTML
<!DOCTYPE html>
<div class="container">
<div class="row">
<div class=" col-lg-6 col-md-12 col-sm-12 form-group">
<a href=""><h2>Dtu Feed</h2>
<img src="Images/dtufeed.png" alt="DTU FEED" height="50%"
width="100%">
<p>Social Network platform designed specially for all DTU
students.Containing Dynamically added events by students/society
themselves , a map of college ,various groups like book club,a platform
for voting on general concerns,a separate profiles for all by signing up
through fb,google+ or email and all the extra stuff like notes etc !</p>
</a>
</div>
<div class=" col-lg-6 col-md-12 col-sm-12 form-group">
<a href="http://yat.pythonanywhere.com/"><h2>Blog</h2>
<img src="Images/blog.png" alt="BLOG" height="50%" width="100%">
<p>Created a blog website with features of creating and logging in
a profile,posting and commenting !</p></a>
</div>
<div class=" col-lg-6 col-md-12 col-sm-12 form-group">
<a href="Todo/index.html"><h2>To Do List</h2>
<img src="Images/todo.png" alt="To do list" height="50%"
width="100%">
<p>General to-do list with animations upon hovering deleting and
adding!</p></a>
</div>
<div class=" col-lg-6 col-md-12 col-sm-12 form-group">
<a href="PlayTap/circles.html"><h2>PlayTap</h2>
<img src="Images/playtap.png" alt="PlayTap" height="50%"
width="100%">
<p>Press Keyboard keys to create animaions and sounds !</p></a>
</div>
</div>
</div>
CSS를 사용
body{
padding-top: 5%;
font-family: 'Roboto Slab', serif;
}
h2{
text-transform: uppercase;
font-size: 1.2em;
}
내가 bootstrap4
을 사용하고 있습니다
미디어 쿼리를 사용해보십시오. –