84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
chrome 下好用就行,图片高宽固定,文字内容不固定。
怎样实现图片和文字垂直居中?怎样实现文字所有区域都有link?
光阴似箭催人老,日月如移越少年。
http://jsfiddle.net/SQS5k/7/
想要更多方案?
最近是有多少人要做垂直居中还不肯好好搜一下已有的问题……
https://dl.dropboxusercontent.com/u/17958375/work/text-vertical-align-by-img.html
<article> <p class="left"> <img src="http://ubmcmm.baidustatic.com/media/v1/0f000nYQaO_UI6DhjPksj6.png" /> </p> <p class="right"> <a href="http://blog.segmentfault.com/joyqi/1190000000407476"> <p>SegmentFault 2014年招聘第一季:</p> <p>后端开发工程师</p> </a> </p> </article> <article> <p class="left"> <img src="http://ubmcmm.baidustatic.com/media/v1/0f000nYQaO_UI6DhjPksj6.png" /> </p> <p class="right"> <a href="http://blog.segmentfault.com/joyqi/1190000000407476"> <p>SegmentFault 2014年招聘第一季:</p> <p>后端开发工程师</p> </a> </p> </article> <article> <p class="left"> <img src="http://ubmcmm.baidustatic.com/media/v1/0f000nYQaO_UI6DhjPksj6.png" /> </p> <p class="right"> <a href="http://blog.segmentfault.com/joyqi/1190000000407476"> <p>SegmentFault 2014年招聘第一季:</p> <p>后端开发工程师</p> </a> </p> </article> <style type="text/css"> article{display:block;} .left{float:left;} .right{width:800px;text-align:center;} .right:hover {background:red;cursor:pointer;} .right a{display:block;} </style> <script> window.onload = function() { var d = document, arts = d.querySelectorAll('article'); for(var i=arts.length-1; i>=0; i--) { var h = arts[i].querySelector('.left').clientHeight, r = arts[i].querySelector('.right'), a = r.querySelector('a'); r.style.height = h + 'px'; a.style.padding = (h - a.clientHeight)/2 + 'px 0'; r.onclick = function() {this.querySelector('a').click();} } } </script>
给代码给你是给你思路,不去思考一味的求代码是不会有进步的。
这里有蛮多收集的可以看看哦~http://www.cnblogs.com/rubylouvre/archive/2010/07/08/1774025.html
css文件: text-align:center
chenglin博客
http://jsfiddle.net/SQS5k/7/
想要更多方案?
最近是有多少人要做垂直居中还不肯好好搜一下已有的问题……
https://dl.dropboxusercontent.com/u/17958375/work/text-vertical-align-by-img.html
给代码给你是给你思路,不去思考一味的求代码是不会有进步的。
这里有蛮多收集的可以看看哦~
http://www.cnblogs.com/rubylouvre/archive/2010/07/08/1774025.html
css文件: text-align:center
chenglin博客