请教一下这题，有人知道怎么做到图片放在字的上方吗？小弟试了好久，没招了QQ
<section class='sale-item'>
<p>“TQC+ 电脑绘图设计认证 Illustrator CS6”，系为TQC+ 视传设计领
域之电脑绘图设计认证能力鉴定，以实务操作方式进行认证，评核符合企业需求的新时代
专业设计人才。亦为考核“平面设计专业人员”与“Flash动画设计专业人员”必备专业
技能之一。</p>
<img src='images/AEY028900S.jpg'
alt='TQC+ 电脑绘图设计认证 Illustrator CS6'>
</section>
‧方法要使用CSS
#deals {
display: flex;
}
.sale-item {
word-wrap: break-word;
word-break: break-all;
width:200px;
margin:10px;
padding:5px;
background-color:#b7b1b1;
border-radius:10px;
}
.sale-item > img {
display: block;
margin:0 auto;
box-shadow:3px 2px 5px #808080;
}
※ 引述《hans5300609 (屏商院资工系xD)》之铭言：
: 主办单位：
: 台北市电脑商业同业公会
: 鸿海精密工业股份有限公司
: 协办单位：财团法人电脑技能基金会(TQC)
: http://www.tqcplus.org.tw/ict50/method.aspx
: 选秀试题：
: “HTML5技能指标WPDSS (Webpage Program Design Skill Standards)”进行选秀评量。
: 规范内容与范例试题下载：http://www.tqcplus.org.tw/ict50/examSample.aspx
: 鸿海找TQC办这个到底是找人才还是打广告呢?
: 还是说跟鸿海加入4G电信业有关??
: 上面还有没答案的范例试题
: 不过大部分我都不会(掩面
: 顺便问一下ICT产业是什么?

下面css是给死的还是可以自己打？可以自己打的话，p跟img的position都设absolute然后一个设img设top:0，p设bottom:0应该可以但section应该要设死高

img设 transform:translate(0px,-25px) 就会压在字上了

float the img

其实这题是用flex box，只要img设定order:-1就可以了解答by讲师 (学校请人来准备考这个...但应该无用)DOFI Lab 罗老师 这样www

absolute虽然可以移动，但图移上去后，下方空间不会缩试出来了.sale-item设display:flex;flex-direction:column.sale-item > img设 order:-1;