twitter-bootstrap – 如何使整个引导程序缩略图可点击(适用于手
发布时间:2020-12-17 20:39:21 所属栏目:安全 来源:网络整理
导读:使用Bootstrap3,我试图创建一个页面,其中有很少的缩略图导致不同的链接. 我已经想出了如何使用文本和链接制作悬停效果,但现在我很困惑如何将它与移动设备和平板电脑一起使用,因为它们没有悬停. 我想知道如何使整个缩略图可点击? 这样做是不是一个好主意?
使用Bootstrap3,我试图创建一个页面,其中有很少的缩略图导致不同的链接.
我已经想出了如何使用文本和链接制作悬停效果,但现在我很困惑如何将它与移动设备和平板电脑一起使用,因为它们没有悬停. 我想知道如何使整个缩略图可点击? 这是一个bootply链接,你可以看到我的意思 解决方法
在用户可访问性方面,使整个缩略图可点击是一个好主意,事实上,易于制作.
根据你的代码: <div class="col-sm-4"> <div class="thumbnail"> <!-- Place the anchor tag here to cover both your caption and image --> <a href="#" class=""> <div class="caption"> <h4 class="">Thumbnail Headline</h4> <p class="">Lorem ipsum dolor </p> </div> <img src="http://lorempixel.com/400/300/technics/1/" alt="..." class=""> </a> <!-- Anchor tag ends covering both image and caption --> </div> </div> DEMO(前3个缩略图) (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |