用CSS覆盖GP默认图片对齐需提高选择器权重（如.site-content img.aligncenter），补display: block配合margin: 0 auto；text-align仅对行内级图片有效；alignnone需加height: auto防溢出；移动端须配@media断点。
怎么用CSS覆盖GP默认图片对齐样式
generatepress默认把<img>塞进.entry-content里时，会加一层aligncenter/alignright类，并附带内联margin和display控制。你想改对齐，直接写img.aligncenter往往无效——因为gp用!important锁了部分声明，或者优先级更高。
- 优先在Customizer → Additional CSS里写，避免插件冲突
- 必须提高选择器权重：比如用
.site-content img.aligncenter，比GP原生的img.aligncenter更具体 - 遇到
margin: 0 auto不生效？补上display: block——浮动或行内图不认auto居中 - 别碰
float，GP 4.0+已转向Flex/Grid布局，float反而触发怪异盒模型
为什么text-align: center对图片没反应
很多人给<p>或<div>加text-align: center，发现图片纹丝不动。这是因为text-align只影响**行内级内容**的对齐，而GP常把图片转成display: inline-block或block，脱离了文本流。
- 如果图片是
display: inline-block（常见于编辑器插入后），text-align: center对父容器有效 - 如果图片被GP自动加了
display: block（比如设置了宽高或响应式class），就得直接控制图片自身：margin: 0 auto; display: block - 检查Computed Styles：右键图片→Inspect→看
display实际值，再决定用父容器还是子元素规则
alignnone类导致图片撑出容器怎么办
WordPress编辑器选“无对齐”会加alignnone，GP对此类默认设max-width: 100%但**不设height: auto**，图片原始尺寸大时容易横向溢出，尤其在窄屏或flex容器里。
- 补一句
img.alignnone { height: auto; }，防止失真拉伸 - 加
img.alignnone { width: 100%; }强制响应式，但注意：这会覆盖原图宽高比，慎用于头图 - 如果只在文章正文生效，限定范围：
.entry-content img.alignnone，避免影响导航栏或小图标 - GP Pro用户注意：
Container Width设置会影响alignnone的计算基准，调完记得刷新缓存
移动端图片对齐错乱的隐藏原因
桌面看着好好的alignright，手机一刷就贴左或换行错位——大概率是GP的@media断点里重置了float或margin，而你写的CSS没跟上断点。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 不要只写桌面规则，至少补一个
@media (max-width: 768px)块，重置margin和display - GP用
flex-wrap: wrap处理图文混排，alignright在小屏下可能被flex容器的justify-content覆盖 - 用
!important临时救急可以，但得同步加注释说明，否则下次更新GP主题容易失效 - 最稳做法：放弃
alignleft/alignright，改用wp-block-image区块+自定义class，可控性更高
真正麻烦的不是写几行CSS，而是GP内部多层嵌套的max-width、margin、display组合，以及不同版本对alignnone的处理差异。改之前先看浏览器DevTools里哪条样式被划掉了，比猜快得多。
立即学习“前端免费学习笔记（深入）”；
