CSS佈局常用程式碼
阿新 • • 發佈:2018-12-04
想要的樣式:
.tel_li{ display: flex; justify-content: left; align-items: center; height:50px; background: #ffffff; border-bottom: 1px solid #eeeeee; } .tel_img { width: 23px; margin-right: 10px; } .tel_go{ width: 11px; margin-left: auto; } .tel_font{ font-size:15px; font-family:PingFangSC-Regular; color: #666666; }
html
<li class="tel_li" onclick="CallMe(${hospital.hospitalTel})">
<img class="tel_img" src="http://images0.zaijiawan.com/wechat/hospitalGroupList/[email protected]!ori">
<p class="tel_font">${hospital.hospitalTel}</p>
<img class="tel_go" src="http://images0.zaijiawan.com/wechat/hospital/ [email protected]!ori">
</li>
順便貼上一鍵打電話的程式碼~
function CallMe(phoneNum) {
window.location.href="tel:"+phoneNum;
}
最核心的程式碼就是:
display: flex;
justify-content: left;
align-items: center;