为以下 HTML 代码设置无序列表样式的最佳方式是什么:
<ul class="photo-grid">
<li class="photo">
<a href="#" class="photo-link">
<img src="photo1_150x200.jpg" class="photo-img" />
<span class="photo-title">this is my girl</span>
</a>
</li>
<li class="photo">
<a href="#" class="photo-link">
<img src="photo2_150x200.png" class="photo-img" />
<span class="photo-title">this_is_photo_for_anonymous_people</span>
</a>
</li>
</ul>
我要执行以下步骤:
最佳答案
HTML:
<div id="one">
First
</div>
<div id="two">
Two
</div>
<ul class="photo-grid">
<li class="photo">
<a href="#" class="photo-link">
<img src="photo1_150x200.jpg" class="photo-img" />
<span class="photo-title">this is my girl</span>
</a>
</li>
<li class="photo">
<a href="#" class="photo-link">
<img src="photo2_150x200.png" class="photo-img" />
<span class="photo-title">this_is_photo_for_anonymous_people</span>
</a>
</li>
</ul>
CSS:
li {
display: block;
border: 2px solid black;
}
#one {
position: fixed;
height: 23px;
width: 35px;
border: 3px solid black;
}
#two {
position: fixed;
margin-top: 27px;
height: 23px;
width: 35px;
border: 3px solid black;
}
你想要这样的 table 吗?
如果是这样,您可以根据需要手动将所有内容正确地放置到位!
关于html - 无序列表的样式如何像表格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27754880/