网页适应手机端和PC端的方法有：

1. 响应式网页设计（Responsive Web Design）：使用CSS媒体查询、弹性布局和流式网格等技术，根据屏幕大小和设备特性自适应调整网页布局和样式。

2. 动态网页布局（Dynamic Web Layout）：根据用户设备的屏幕尺寸和分辨率，自动调整网页布局和元素的大小和位置。

3. 利用CSS框架和预处理器（CSS framework & Preprocessor）：例如Bootstrap、Foundation等，这些框架提供了响应式网页设计所需的CSS样式和组件，简化了开发过程。

4. 使用CSS媒体查询（CSS Media Queries）：根据屏幕宽度、设备类型等特性，应用不同的CSS样式，并实现布局的转换和优化。

5. 移动优先设计（Mobile-First Design）：针对移动设备优先进行设计和开发，然后逐步增加适应PC端的样式和布局。

6. 使用流体布局（Fluid Layout）：通过设置元素宽度使用百分比而不是像素来实现自适应布局。

7. 图片适应性处理（Responsive Images）：通过使用CSS属性和HTML标签，使图像根据设备屏幕大小和像素密度适应性地加载和显示。

8. 设备检测和重定向（Device Detection & Redirection）：通过使用Javascript或服务器端技术，检测用户设备类型并根据设备类型重定向到适当的网页版本。

总之，通过以上方法，可以实现网页在手机端和PC端的自适应和优化。