实现图片在网页中居中，并在盒子内居中，有触动就会冒出的边栏，还有在有背景的header中设置悬浮菜单（通过表格形式）

最新推荐文章于 2021-06-09 21:24:06 发布

哈哈哈666888

最新推荐文章于 2021-06-09 21:24:06 发布

阅读量273

点赞数

本文链接：https://blog.csdn.net/qq_41036283/article/details/91346605

版权

在这里插入图片描述

		<tr>
				<td>

                         <div class="menuTitle">
                         	这个
                         </div>  				
                         <div class="menuItem">

                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                       
					</div>
				<td>
					<div class="menu">
                         <div class="menuTitle">
                         	这个
                         </div>  				
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                        <!-- <div style="clear: both;"></div>清除浮动，两边都不-->
					</div>
				</td>
				<td>
					<div class="menu">
                         <div class="menuTitle">
                         	这个
                         </div>  				
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <div class="menuItem">
                         	打开
                         </div>
                         <!--<div style="clear: both;"></div>-->
					</div>
				</td>
			</tr>
		</table>
	</header>
	 
	<div class="sidebar">
            hahaha
    </div>
	<div class="content">
		<div class="block">
			<img  src="Mountain.jpg"alt="" >
		</div>
		<div class="block">
			<img  src="Mountain.jpg"alt="" >
		</div>
		<div style="clear: left;">
			
		</div>
		<div class="block">
			<img  src="Mountain.jpg"alt="">
		</div>
		<div class="block">
			<img  src="Mountain.jpg"alt="">
		</div>
	</div>
	 <div class="toolbox">
        <ul>
            <li ><img src="bookBtnBrown.png" alt="">这是一个菜单</li><!--因为是在列表中顺序着一行一行地排下来，所以无需加定位不会发生重叠，只要空间够宽-->
            <li><img  src="bookBtnGreen.png" alt="">这是一个菜单</li>
            <li><img  src="bookBtnRed.png" alt="">这是一个菜单</li>
        </ul>
    </div>
  <div class="footer">
    	草鱼出品，悔恨一生
  </div>
</body>