我正在学习HTML和CSS，现在我愿意学习如何使其具有响应能力。我已经尝试过了，在chrome中，你可以在多个设备中进行测试，这是可行的，但当我扩展/建模浏览器时，它会变得奇怪。
.back {
background-color: turquoise
}
.center {
width: 100%;
height: auto;
max-height: 25vw;
max-width: 100vw;
object-fit: cover;
padding-top: 1em;
}
.perfil {
position: relative;
height: auto;
margin: -8.5em 0em 0.5em 1.25em;
float: left;
}
.text {
float: right;
padding-top: 6em;
padding-left: 1em;
}
.nd {
text-align: left;
}
.avatar {
height: auto;
}
#name {
float: left;
font-family: sans-serif;
padding-top: 0.4em;
font-size: 3em;
font-weight: bold;
}
#par {
text-align: center;
font-family: Cambria;
color: black;
font-size: x-large;
padding-top: 5em;
}
#link {
font-size: x-large;
padding-left: 28em;
margin-top: 40em;
padding-right: 5em;
white-space: nowrap;
}<head>
<title> Profile </title>
<link href="style.css" rel="stylesheet">
</head>
<body class = "back">
<div>
<img src = "images/d8cztm9-a4047ab4-db23-4e70-9c6f-757d5d2b0d36.png" alt = "Lelouchao" class="center" >
</div>
<div class = "perfil">
<img src = "images/119191.png" alt = "avatar" class = "avatar">
<div class = "text">
<p id ="name"> Lelouch Vi Britania </p>
</div>
</div>
<a href="https://code-geass.fandom.com/pt-br/wiki/Lelouch_vi_Britannia" target="_blank" id = "link" >Link Interesses</a>
<div>
<p id="par"> Lelouch Lamperouge (ルルーシュ・ランペルージ, Rurūshu Ranperūji?)
é o protagonista e anti-herói da série de anime da Sunrise, <span style = "text-decoration: overline;" >Code Geass: Lelouch of the Rebellion. </span> Seu sobrenome é um pseudônimo; seu nome real é <span style = "font-weight: bold">Lelouch vi Britannia</span> (ルルーシュ・ヴィ・ブリタニア, Rurūshu vi Buritania?),
11° príncipe do Santo Império Britanniano e filho do 98° imperador da Britannia, Charles zi Britannia. Lelouch é o líder da Ordem dos Cavaleiros Negros, onde ele expõe sua identidade como <strike>Zero </strike>
e tem como objetivos vingar-se de seu pai pela misteriosa morte de sua mãe, do seu exílio no Japão e recriar um mundo melhor para sua irmã Nunnally. Seu seiyū japonês é Jun Fukuyama, e sua versão criança é dublada por Sayaka Ohara.
Lelouch foi projetado pelo grupo de artistas da CLAMP que ajudaram a criar um personagem atraente devido ao seu estilo e apelo visual. <span class = "nd"><br><br>Ele tem sido reconhecido como um dos personagens mais populares do Japão e desde a sua estreia em Code Geass tem aparecido no topo de diversas pesquisas. As publicações de anime e mangá viram Lelouch como um personagem interessante, embora ele queira destruir um império usando métodos cruéis, ele ainda possui um lado humano que entra em conflito com seus ideais o que o faz um personagem simpático. Jun Fukuyama tem sido elogiado e reconhecido por seu trabalho na interpretação de Lelouch. </span>
Jun Fukuyama tem sido elogiado e reconhecido por seu trabalho na interpretação de Lelouch.
</p>
</div>
</body>化身图像为250x250像素，横幅图像为900x300像素。
非常感谢您的时间和帮助！
您必须使用媒体查询来控制屏幕大小行为，我建议您使用Flexbox