博客园主题

1、CSS 样式

body { 
     background-color: #efefef;
    background-image:url(https://raw.githubusercontent.com/hj1933/img/master/iimg/SainteVictoireCezanneBirthday_ZH-CN8216109812_1920x1080.jpg
); 
     background-repeat: no-repeat; 
     background-attachment: fixed; 
     background-position: center 0; 
     background-size: cover; 
    padding-top:0px;
  }

#header{display:none;}
#test33 ul {
margin: 0;
padding: 0;
list-style-type: none; /*去除li前的标注*/
background-color: #333;
overflow: hidden; /*隐藏溢出的部分，保持一行*/
}


#test33 li {
float: left; /*左浮动*/
}

#test33 .dropdown .dropbtn{
	color: white;
	font-size: 14px;
        text-decoration: none;
}

#test33 li a, .dropbtn {
display: inline-block; /*设置成块*/
color: white;
text-align: center;
text-decoration: none;
padding: 14px 16px;
}


#test33 li a:hover, .dropdown:hover .dropbtn { /*鼠标移上去，改变背景颜色*/
background-color: blue;
}


#test33 .dropdown {
/*display:inline-block将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。*/
display: inline-block;
}


#test33 .dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}


#test33 .dropdown-content a {
display: block;
color: black;
padding: 8px 10px;
text-decoration:none;
}


#test33 .dropdown-content a:hover {
background-color: #a1a1a1;
}


#test33 .dropdown:hover .dropdown-content{
display: block;
}

2、HTML

	


	<p style="text-align: center; font-size: 35px; margin-bottom: 19px; margin-top: 20px; opacity: 0.5">Hubery_Jun</p>

<div id="test33">
    <ul style="margin-left: 0px; margin-right: 0px" class="test11">
     
     

     <div class="dropdown">
      <a href="https://www.cnblogs.com/" class="dropbtn"><span style="opacity: 0.2; font-size: 18px">博客园</span></a>
        <div class="dropdown-content">
        </div>
      </div> 

<div class="dropdown">
      <a href="https://www.cnblogs.com/midworld/" class="dropbtn"><span style="opacity: 0.2; font-size: 18px">我的首页</span></a>
        <div class="dropdown-content">
        </div>
      </div> 
    
       <div class="dropdown">
      <a href="#" class="dropbtn">全部分类</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/category/1327548.html">1.Python基础</a>
        <a class="menu" href="https://www.cnblogs.com/midworld/category/1487990.html">2.python进阶</a>
            <a class="menu" href="https://www.cnblogs.com/midworld/category/1410563.html">3.Django基础</a>
              <a class="menu" href="https://www.cnblogs.com/midworld/category/1487989.html">4.Django项目</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1488017.html">5.REST framework</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1327552.html">6.Linux 基础</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1327550.html">7.前端</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1487981.html">8.数据库</a>
          
          
           <a class="menu" href="https://www.cnblogs.com/midworld/category/1474063.html" target="_Blank">9.算法</a>
           <a class="menu" href="https://www.cnblogs.com/midworld/category/1327555.html" target="_Blank">10.爬虫</a>
           <a class="menu" href="https://www.cnblogs.com/midworld/category/1420892.html">11.日常错误集锦</a>
        </div>
      </div> 


        <div class="dropdown">
      <a href="#" class="dropbtn">Flask基础</a>
       <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/p/11075990.html" target="_Blank">1.Flask 入门（第一篇）</a>
            <a class="menu" href="https://www.cnblogs.com/midworld/p/11075995.html" target="_Blank">2.Flask 入门（第二篇）</a>
              <a class="menu" href="https://www.cnblogs.com/midworld/p/11076008.html" target="_Blank">3.Flask 入门（第三篇）</a>
     
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1488014.html" target="_Blank">更多</a>
        </div>

        </div> 

         <div class="dropdown">
      <a href="#" class="dropbtn">Tornado基础</a>
      
      	 <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/category/1488016.htmll" target="_Blank">1.Tornado基础</a>
     
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1488016.html" target="_Blank">更多</a>
        </div>
        </div> 



      <div class="dropdown">
      <a href="#" class="dropbtn">Python基础</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/p/9917749.html" target="_Blank">1.初识Python</a>
            <a class="menu" href="https://www.cnblogs.com/midworld/p/9917810.html" target="_Blank">2.基本数据类型（一）</a>
              <a class="menu" href="https://www.cnblogs.com/midworld/p/10270047.html" target="_Blank">3.分支循环</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10268355.html" target="_Blank">4.函数</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10271228.html" target="_Blank">5.文件处理</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10471590.html" target="_Blank">6.Python 推导式</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1327548.html" target="_Blank">更多</a>
        </div>
      </div>   





        <div class="dropdown">
      <a href="#" class="dropbtn">Django基础</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/p/10467998.html" target="_Blank">1.第一个 Django 应用</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/11002829.html" target="_Blank">2.Django 之 logging</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10992027.html" target="_Blank">3.Django 之 auth 模块</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10991994.html" target="_Blank">4.Django 之 JsonResponse 对象</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10992000.html" target="_Blank">5.Django 之装饰器实现登录认证</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10992005.html" target="_Blank">6.部署</a>
        
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1410563.html" target="_Blank">更多</a>
        </div>
      </div> 





        <div class="dropdown">
      <a href="#" class="dropbtn">Django项目相关</a>
        <div class="dropdown-content">
          <a class="menu" href="https://www.cnblogs.com/midworld/p/11076046.html" target="_Blank">1.CRM</a>
        <a class="menu" href="https://www.cnblogs.com/midworld/p/11076071.html" target="_Blank">2.堡垒机</a>
    	<a class="menu" href="https://www.cnblogs.com/midworld/p/11076065.html" target="_Blank">3.kingadmin</a>
    	<a class="menu" href="https://www.cnblogs.com/midworld/p/11076074.html" target="_Blank">4.通用权限框架
</a>

          <a class="menu" href="https://www.cnblogs.com/midworld/category/1487989.html" target="_Blank">更多</a>
        </div>
      </div> 
    



         <div class="dropdown">
      <a href="#" class="dropbtn">Python进阶</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/p/10301472.html" target="_Blank">1.面向对象</a>
         <a class="menu" href="https://www.cnblogs.com/midworld/p/10301475.html" target="_Blank">2.面向对象进阶</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/p/10301463.html" target="_Blank">3.装饰器详解</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1487991.html" target="_Blank">4.Python模块</a>
           <a class="menu" href="https://www.cnblogs.com/midworld/category/1487990.html" target="_Blank">更多</a>
         
        </div>
      </div> 
        

        <div class="dropdown">
      <a href="#" class="dropbtn">Python爬虫</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/category/1327555.html" target="_Blank">1.requests 库</a>
           
        </div>
      </div> 

       
         <div class="dropdown">
      <a href="#" class="dropbtn">前端基础</a>
        <div class="dropdown-content">
        <a class="menu" href="https://www.cnblogs.com/midworld/category/1327550.html" target="_Blank">1.HTML</a>
            <a class="menu" href="https://www.cnblogs.com/midworld/category/1327551.html" target="_Blank">2.CSS</a>
              <a class="menu" href="https://www.cnblogs.com/midworld/category/1327549.html" target="_Blank">3.Javascript</a>
          <a class="menu" href="https://www.cnblogs.com/midworld/category/1462105.html" target="_Blank">4.Jquery</a>
        </div>
      </div> 

      


    </ul>
  </div>