要实现PC端网站的自适应，可通过以下方式进行修改：
1. 使用CSS媒体查询：使用@media规则，根据不同的屏幕宽度设置不同的样式。可以针对不同的屏幕宽度范围，设置不同的布局、字体大小、边距等。通过这种方式，可以在不同的设备上展示不同的样式。
示例代码：
“`
@media (max-width: 767px) {
.container {
width: 100%;
}
}
@media (min-width: 768px) {
.container {
width: 960px;
margin: auto;
}
}
“`
2. 使用响应式框架：使用已有的响应式框架，如Bootstrap、Foundation等。这些框架已经封装好了响应式的样式和布局，只需要在页面中引入相关的CSS文件，并按照框架提供的文档和规范来使用相应的类名和组件，就可以快速实现PC端网站的自适应。
3. 使用弹性布局：使用CSS3的弹性布局（Flexbox）来实现自适应。通过设置容器的弹性布局属性，可以自动调整子元素的位置和大小，使其适应不同屏幕尺寸。
示例代码：
“`css
.container {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.container > div {
flex: 1 0 200px;
margin: 10px;
}
“`
4. 使用 Javascript：通过Javascript动态计算和调整元素的样式和布局，来实现自适应。可以监听窗口大小的变化事件，根据不同的窗口宽度，动态修改元素的样式。
示例代码：
“`javascript
window.addEventListener(‘resize’, function() {
if (window.innerWidth <= 767) {
// 当窗口宽度小于等于 767 像素时的处理逻辑
document.querySelector(‘.container’).style.width = ‘100%’;
} else {
// 当窗口宽度大于 767 像素时的处理逻辑
document.querySelector(‘.container’).style.width = ‘960px’;
document.querySelector(‘.container’).style.margin = ‘auto’;
}
});
“`
以上是一些常用的实现PC端网站自适应的方法，具体选择哪种方式，可以根据自己的需求和情况来决定。
未经允许不得转载：跨屏互联 » 如何通过改变按钮样式和交互方式来实现PC端网站的自适应？
