如何单独调整网页宽度以优化阅读体验？

嘿，我懂你这种烦恼！浏览器缩放确实会把整个页面一起放大缩小，碰到那种拉得特别宽的网页，文字一行太长读起来眼睛真的累。想调成类似Stack Exchange那样舒适的宽度？试试下面这几个实用方法：

• 用自定义样式扩展（长期解决）
  推荐用Stylus这类浏览器扩展（各大主流浏览器都支持安装），它能帮你给指定网页甚至所有网页设置专属的CSS样式。安装好后，新建一个样式，输入这段代码：

  body, .container, .content {
      max-width: 800px !important; /* 你可以根据自己的屏幕调整数值，Stack Exchange的宽度大概就是这个范围 */
      margin: 0 auto !important; /* 让内容自动居中 */
      padding: 0 20px !important; /* 留点左右边距，阅读时更轻松 */
  }
  

  保存后，网页内容就会自动限制在你设置的宽度内，文字自然换行，阅读体验和Stack Exchange差不多。如果只想针对某几个网站生效，设置样式的适用范围就行。

• 临时用开发者工具调整（应急方案）
  要是你只是偶尔碰到某个网页需要调整，不想装扩展，那就用浏览器自带的开发者工具应急：

  1. 右键网页空白处，选择「检查」（或者直接按F12快捷键）
  2. 在Elements面板里找到网页的主容器元素（一般是body、.container这类类名的元素）
  3. 在右侧的Styles面板里添加max-width: 800px; margin: 0 auto;，实时就能看到页面宽度变化。关闭开发者工具后页面就会恢复原样，适合临时救急。

• 切换到浏览器阅读模式（最省心操作）
  很多主流浏览器（Chrome、Firefox、Edge）都自带阅读模式，点击地址栏里的书本图标（如果没显示，去浏览器设置里开启就行），切换后浏览器会自动帮你过滤广告和多余元素，把文字调整到舒适的宽度和排版，和Stack Exchange的阅读感高度相似，操作超简单！

备注：内容来源于stack exchange，提问作者Clemens Bartholdy