Community
Learn
Tools Library
AI Tools
Leisure
search
English
Home > List of blog posts > php中文网PC端最新课程部分模拟
Blogger Information
Blog 18
fans 0
comment 3
visits 12746
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
php中文网PC端最新课程部分模拟
P粉019280626
Original
421 people have browsed it
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>php中文网PC端课程</title>
  8.     <link rel="stylesheet" href="/cs/phpcn-css.css">
  9. </head>
  10. <body>
  11. <!-- 抬头  -->
  12. <div>
  13.     <div class="kechengtou1">
  14. <h3>最新课程</h3>
  15. <a href="https://www.php.cn/course/sort_new.html">更多</a>
  16. </div>
  18. <!-- 正文 -->
  19. <div class="container"><!--  -->
  20.     <ul class="zhengwen2">
  21.         <li class="zhengwen3">
  22.             <a href="https://www.php.cn/course/1519.html">
  23.                 <img src="/zuoye/image/63e202276944f543.jpg"  style="width:224px; height: 130px;"/> </a>
  24.                  <div class="chuji"> 
  25.                  <span>中级</span>
  26.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  27.                  </div>
  28.                  <div class="xuexiyushoucang">
  29.                 <span>1595次学习</span>
  30.                 <span>收藏</span>
  31.                 </div>
  32.         </li>
  33.     </ul>
  35.     <ul class="zhengwen2">
  36.         <li class="zhengwen3">
  37.             <a href="https://www.php.cn/course/1519.html">
  38.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  39.                 style="width:224px; height: 130px;"/> </a>
  40.                  <div class="chuji"> 
  41.                  <span>中级</span>
  42.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  43.                  </div>
  44.                  <div class="xuexiyushoucang">
  45.                 <span>1595次学习</span>
  46.                 <span>收藏</span>
  47.             </div>
  48.         </li>
  49.     </ul>
  51.     <ul class="zhengwen2">
  52.         <li class="zhengwen3">
  53.             <a href="https://www.php.cn/course/1519.html">
  54.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  55.                 style="width:224px; height: 130px;"/> </a>
  56.                  <div class="chuji"> 
  57.                  <span>中级</span>
  58.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  59.                  </div>
  60.                  <div class="xuexiyushoucang">
  61.                 <span>1595次学习</span>
  62.                 <span>收藏</span>
  63.             </div>
  64.         </li>
  65.     </ul>
  67.     <ul class="zhengwen2">
  68.         <li class="zhengwen3">
  69.             <a href="https://www.php.cn/course/1519.html">
  70.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  71.                 style="width:224px; height: 130px;"/> </a>
  72.                  <div class="chuji"> 
  73.                  <span>中级</span>
  74.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  75.                  </div>
  76.                  <div class="xuexiyushoucang">
  77.                 <span>1595次学习</span>
  78.                 <span>收藏</span>
  79.             </div>
  80.         </li>
  81.     </ul>
  83.     <ul class="zhengwen2">
  84.         <li class="zhengwen3">
  85.             <a href="https://www.php.cn/course/1519.html">
  86.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  87.                 style="width:224px; height: 130px;"/> </a>
  88.                  <div class="chuji"> 
  89.                  <span>中级</span>
  90.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  91.                  </div>
  92.                  <div class="xuexiyushoucang">
  93.                 <span>1595次学习</span>
  94.                 <span>收藏</span>
  95.             </div>
  96.         </li>
  97.     </ul>
  99.     <ul class="zhengwen2">
  100.         <li class="zhengwen3">
  101.             <a href="https://www.php.cn/course/1519.html">
  102.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  103.                 style="width:224px; height: 130px;"/> </a>
  104.                  <div class="chuji"> 
  105.                  <span>中级</span>
  106.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  107.                  </div>
  108.                  <div class="xuexiyushoucang">
  109.                 <span>1595次学习</span>
  110.                 <span>收藏</span>
  111.             </div>
  112.         </li>
  113.     </ul>
  115.     <ul class="zhengwen2">
  116.         <li class="zhengwen3">
  117.             <a href="https://www.php.cn/course/1519.html">
  118.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  119.                 style="width:224px; height: 130px;"/> </a>
  120.                  <div class="chuji"> 
  121.                  <span>中级</span>
  122.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  123.                  </div>
  124.                  <div class="xuexiyushoucang">
  125.                 <span>1595次学习</span>
  126.                 <span>收藏</span>
  127.             </div>
  128.         </li>
  129.     </ul>
  130.     <ul class="zhengwen2">
  131.         <li class="zhengwen3">
  132.             <a href="https://www.php.cn/course/1519.html">
  133.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  134.                 style="width:224px; height: 130px;"/> </a>
  135.                  <div class="chuji"> 
  136.                  <span>中级</span>
  137.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  138.                  </div>
  139.                  <div class="xuexiyushoucang">
  140.                 <span>1595次学习</span>
  141.                 <span>收藏</span>
  142.             </div>
  143.         </li>
  144.     </ul>
  145.     <ul class="zhengwen2">
  146.         <li class="zhengwen3">
  147.             <a href="https://www.php.cn/course/1519.html">
  148.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  149.                 style="width:224px; height: 130px;"/> </a>
  150.                  <div class="chuji"> 
  151.                  <span>中级</span>
  152.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  153.                  </div>
  154.                  <div class="xuexiyushoucang">
  155.                 <span>1595次学习</span>
  156.                 <span>收藏</span>
  157.             </div>
  158.         </li>
  159.     </ul>
  161.     <ul class="zhengwen2">
  162.         <li class="zhengwen3">
  163.             <a href="https://www.php.cn/course/1519.html">
  164.                 <img src="/zuoye/image/63e202276944f543.jpg" 
  165.                 style="width:224px; height: 130px;"/> </a>
  166.                  <div class="chuji"> 
  167.                  <span>中级</span>
  168.                  <a href="">Laravel 8 课程精讲（台湾同胞版）</a>
  169.                  </div>
  170.                  <div class="xuexiyushoucang">
  171.                 <span>1595次学习</span>
  172.                 <span>收藏</span>
  173.             </div>
  174.         </li>
  175.     </ul>
  177. </div>
  180. </div>
  181. </body>
  182. </html>

CSS

  1. *{
  2.     margin:0;
  3.     padding:0;
  4.     box-sizing: border-box;
  5. }
  7. .html{
  8.     display:flex;
  9.     background-color:slategrey;
  10. }
  12. .h3{
  13.     color:black;
  14.     }
  16. .kechengtou1 {
  17.     width:75rem;
  18.     display:flex;
  19.      place-content:space-between;
  20.     }
  23. /* .kechengtou1 span{
  24.     display:flex;
  25. } */
  28. .container{
  29.     width:75rem;
  30.     /* margin:30px;
  31.  */
  32.     display:grid;
  33.   /*   list-style: none; */
  35.     /* 显式网格 */
  36. grid-template-columns: repeat(5,1fr);
  37. grid-template-rows: repeat(2,1fr);
  39. gap: 20px ;
  40. }
  42. .container .zhengwen2 {
  43.     display:inline;
  44. }
  46. .container .zhengwen2 .zhengwen3{
  47.     list-style: none;
  48.     width:224px;
  49.     height:188px;
  50. }
  53. .container .zhengwen2 .chuji{
  54.     height:40px;
  55. }
  57. .container .zhengwen2 .zhengwen3 .xuexiyushoucang{
  58.         height: 35px;
  59. }

Correcting teacher：PHPzPHPz

Correction status：qualified

Teacher's comments：总体来说，效果还行，还是有优化的空间，继续加油；还有在提交的时候记得在状态这一栏选择“作业”进行提交
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
1 comments
P粉019280626 2023-02-17 17:42:10
在做的过程中，遇到 很多问题。也有老师和同学们的帮助。这个还需要进一步优化调整。
1 floor
Author's latest blog post