Html 实验的响应式屏幕尺寸

我希望我在这里提供了足够的细节.

我目前正试图在Labjs上设计一个实验，我想知道是否有一种方法可以让网站对屏幕大小做出更好的响应，使用的是超文本标记语言(HTML)还是css？我的意思是，我可以使用CSS/HTML根据用户屏幕的大小来调整刺激的大小吗？

我当前的CSS代码是这样的:

/* Please define your custom styles here */


cons_left {
  margin-left: 10%;
  margin-right: 10%;
} 

.pickparent {
  position: relative;
  top: 0;
  left: 0;
 // border: 3px solid black;
} 

.pickpicker {
  position: relative;
  top: 0;
  left: 0;
//  border: 3px solid red;
} 

.pickimage {
  filter: grayscale(100%);
  position: absolute;
  margin: auto;
  z-index: 2;
 // border: 3px solid red;
} 

#location_percentage, #color_percentage {
  font-size: 70px;
  text-align: center;
  display: block;
  margin: 0 auto;
}

.feedback, .percentage {
  font-size: 70px;
  text-align: center;
}

.feedback {
  font-size: 70px;
  margin-top: 450px;
  display: block;
  line-height: 70px;
}

.feedback:first-line {
  font-size: 70px;
  margin-top: 100px;
  display: block;
  line-height: 120px;
}

.percentage {
  margin-top: 20px;
  margin-bottom: 20px;
}

#next-button {
    display: none;
    align-items: center;
  }

.message {
  font-size: 50px;
  text-align: center;
  position: absolute
  margin: 20%
}

我曾try 更改css的各种属性以使其具有响应性，但到目前为止还没有成功.我还try 实现了一个zoom 任务，用户必须将矩形的大小调整为卡片的大小，但我在这里也找不到解决方案.

谢谢你的帮助!