Semantic UI 之 图片 image
第一步：创建项目
添加JQuery和Semantic UI包、创建image.html页面：
第二步：image.html页面
<html lang="en"><head><meta charset="UTF-8"><title>按钮title><link rel="stylesheet" href="semantic-ui/semantic.min.css"><script type="text/javascript" src="js/jquery3.3.1.js">script><script type="text/javascript" src="semantic-ui/semantic.min.js">script>head><body><img src="imgs/lyl.jpg" class="ui image" alt="默认"><br><img src="imgs/lyl.jpg" class="ui fluid image" alt="占满整个屏幕的图片"><br><img src="imgs/lyl.jpg" class="ui avatar image" alt="大头相">梁云亮的大头相<br><img src="imgs/lyl.jpg" class="ui rounded image" alt="圆角"><br><img src="imgs/lyl.jpg" class="ui circular image" alt="圆形图"><br><img src="imgs/lyl.jpg" alt="迷你图" class="ui tiny image"><br><img src="imgs/lyl.jpg" alt="小图" class="ui small image"><br><img src="imgs/lyl.jpg" alt="大图" class="ui large image"><br><img src="imgs/lyl.jpg" alt="隐藏" class="ui hidden image"><br><img src="imgs/lyl.jpg" alt="禁用" class="ui disabled small image"><br><a href="#" class="ui tiny image"><img src="imgs/lyl.jpg" alt="带超连接的图片">a><br><img src="imgs/lyl.jpg" class="ui top aligned tiny image" alt="顶部对齐"><span>顶部对齐span><br><img src="imgs/lyl.jpg" class="ui middle aligned tiny image" alt="居中对齐"><span>居中对齐span><br><img src="imgs/lyl.jpg" class="ui bottom aligned tiny image" alt="底部对齐"><span>底部对齐span><br>body>
html>
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！