以下是一些常见的网站元素或部件的示例代码:
- 按钮
<button>点击按钮</button>
- 导航栏
<nav>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">联系我们</a></li>
</ul>
</nav>
- Jumbotron
<div class="jumbotron">
<h1>欢迎来到我们的网站</h1>
<p>这是一个漂亮的Jumbotron,用于展示重要信息。</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">了解更多</a></p>
</div>
- 轮播图
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- 轮播图指示标 -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- 轮播图片 -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="image1.jpg" alt="图片1">
</div>
<div class="item">
<img src="image2.jpg" alt="图片2">
</div>
<div class="item">
<img src="image3.jpg" alt="图片3">
</div>
</div>
<!-- 左右滑动按钮 -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">上一个</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">下一个</span>
</a>
</div>
- 标签页
<ul class="nav nav-tabs">
<li class="active"><a href="#">主页</a></li>
<li><a href="#">比较</a></li>
<li><a href="#">设置</a></