HTML+CSS鲜花静态网页设计

news2024/9/24 15:24:56

🎉精彩专栏推荐 💭文末获取联系
✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主
💂 作者主页: 【主页——🚀获取更多优质源码】
🎓 web前端期末大作业： 【📚毕设项目精品实战案例 (1000套) 】
🧡 程序员有趣的告白方式：【💌HTML七夕情人节表白网页制作 (110套) 】
🌎超炫酷的Echarts大屏可视化源码：【🔰 Echarts大屏展示大数据平台可视化(150套) 】
🔖 HTML+CSS+JS实例代码： 【🗂️HTML+CSS+JS实例代码 (炫酷特效网页代码) 继续更新中…】
🎁 免费且实用的WEB前端学习指南： 【📂web前端零基础到高级学习视频教程 120G干货分享】
🥇 关于作者: 💬历任研发工程师，技术组长，教学总监；曾于2016年、2020年两度荣获CSDN年度十大博客之星。 十载寒冰，难凉热血；多年过去，历经变迁，物是人非。 然而，对于技术的探索和追求从未停歇。 💪坚持原创，热衷分享，初心未改，继往开来！

📂文章目录

  • 一、👨‍🎓网站题目
  • 二、✍️网站描述
  • 三、📚网站介绍
  • 四、💠网站演示
  • 五、⚙️ 网站代码
    • 🧱HTML结构代码
    • 💒CSS样式代码
  • 六、🥇 如何让学习不再盲目
  • 七、🎁更多干货

一、👨‍🎓网站题目

🌹 鲜花网页设计 、🌷鲜花商城网页制作、🌼在线花店网站、💐盆栽网、花卉网等网站的设计与制作。

二、✍️网站描述

🏷️HTML鲜花网页设计，采用DIV+CSS布局，共有多个页面，排版整洁，内容丰富，主题鲜明，首页使用CSS排版比较丰富，色彩鲜明有活力。顶部导航及底部区域背景色为100%宽度，主体内容区域宽度

🏅 一套优质的💯网页设计应该包含 (具体可根据个人要求而定)

  1. 页面分为页头、菜单导航栏（最好可下拉）、中间内容板块、页脚四大部分。
  2. 所有页面相互超链接，可到三级页面，有5-10个页面组成。
  3. 页面样式风格统一布局显示正常，不错乱，使用Div+Css技术。
  4. 菜单美观、醒目，二级菜单可正常弹出与跳转。
  5. 要有JS特效，如定时切换和手动切换图片轮播。
  6. 页面中有多媒体元素，如gif、视频、音乐，表单技术的使用。
  7. 页面清爽、美观、大方，不雷同。 。
  8. 不仅要能够把用户要求的内容呈现出来，还要满足布局良好、界面美观、配色优雅、表现形式多样等要求。

三、📚网站介绍

📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。

📓网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。

📘网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。

📒网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；

📙网页编辑方面：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。
其中：
（1）📜html文件包含：其中index.html是首页、其他html为二级页面；
（2）📑 css文件包含：css全部页面样式,文字滚动, 图片放大等；
（3）📄 js文件包含：js实现动态轮播特效, 表单提交, 点击事件等等（个别网页中运用到js代码）。

四、💠网站演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

五、⚙️ 网站代码

🧱HTML结构代码



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>素馨花卉</title>
    <link rel="stylesheet" href="css/suxin.css">
</head>
<body>
   <!--素馨首页导航开始-->
   <div class="picture">
   <header class="hua-header">
      <div class="container">
          <div class="header-box">
              <div class="header-logo">
                  <div class="logo">
                      <img src="picture/sx.png" alt="">
                  </div>
              </div>
             <ul class="header-nav">
                <li class="one">
                   <a href="">网站首页</a>
                </li>
                 <li class="header-item">
                   <a href="huayanhuayu.html">花言花语</a>
                </li>
                 <li class="header-item">
                   <a href="suxindongtai.html">素馨动态</a>
                </li>
                
                 <li class="header-item">
                   <a href="suxinhuayi.html">素馨花艺</a>
                </li>
                 <li class="header-item">
                   <a href="liuyan.html">留言建议</a>
                </li>
                 <li class="header-item">
                   <a href="about.html">关于素馨</a>
                </li>
             </ul>

          </div>

      </div>


   </header>
       <div class="left">
           <div class="btn-left"></div>
       </div>
       <div class="right">
           <div class="btn-right"></div>
       </div>
       <div class="dots">
           <div class="dot "></div>
           <div class="dot hover"></div>
       </div>
   </div>
   <!--素馨首页导航结束-->
   <!-- 素馨花艺开始-->
   <div class="flower">
      <div class="flower-container">
          <div class="flower-left"><i class="iconfont icon-xiangzuo"></i></div>
          <div class="flower-right"><i class="iconfont icon-xiangyou3fill"></i></div>
         <h3 class="flower-content">
             素馨花艺
             <a href="" class="btn">More</a>
         </h3>
          <p class="desc">花艺师与您一同分享素馨花卉给您的生活带去的花香世界。</p>
          <div class="tu">
              <div class="chahua">
              <a href="" class="tu1"><img src="picture/sx.jpg" alt=""></a>
              <a href="" class="tu1"><img src="picture/sx2.jpg" alt=""></a>
              <a href="" class="tu1"><img src="picture/sx3.jpg" alt=""></a>
                  <div class="tu-big">
                    <div class="tu-content">
                       <h4>桌花瓶插花</h4>
                        <p>这些争鲜斗艳的花朵如冬日深夜火焰般温暖，浓烈。火红色多头玫瑰、香橙色郁金香与紫罗兰.</p>
                  <div class="btn-block">
                  <a href="" class="detail">
                      <i class="iconfont icon-shipin luyin"></i>
                      查看详情
                  </a>
                  </div>
                    </div>
                      <div class="tu-content">
                          <h4>迷你花束</h4>
                          <p>迷你花束，简洁时尚，选择一束鲜花表达自己的情感，小小花束，大大心意。</p>

                      <div class="btn-block">
                          <a href="" class="detail">
                              <i class="iconfont icon-shipin "></i>
                              查看详情
                          </a>
                      </div>
                      </div>
                      <div class="tu-content">
                          <h4>小彩瓷随心插</h4>
                          <p>小彩瓷随意搭配小菊、康乃馨，即便不需要专业的花艺师，也能做出清新脱俗的感觉。</p>

                          <div class="btn-block">
                              <a href="" class="detail">
                                  <i class="iconfont icon-shipin "></i>
                                  查看详情
                              </a>
                          </div>
                      </div>
                  </div>
              </div>
          </div>

      </div>
   </div>
   <!-- 素馨花艺结束-->
   <!--素馨花语开始-->
   <div class="language">
       <div class="flower-container">
           <h3 class="language-content">
               素馨花语
               <a href="" class="btn">More</a>
           </h3>
           <ul class="language-big">
               <li class="language-item">
                <div class="language-left">
                    <img src="picture/1.jpg" alt="">
                </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               多肉入新家
                           </a>
                       </h4>
                       <p class="dec">多肉必须经过一段时间适应期，也就是安全度过缓苗期，就说明她入盆成功，真正进入新家了。首先我们需要晾根.....</p>
                       <p class="info">
                           <span>2022-07-15</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>900</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/2.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               爱莲说
                           </a>
                       </h4>
                       <p class="dec">六月份的尾巴，气候似乎比往年又燥热了些许。花卉市场的鲜切花生的愈发绚丽多姿，不过最夺目的当属那“出淤.....</p>
                       <p class="info">
                           <span>2022-06-30</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>229</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/3.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">

                               花在冬日

                           </a>
                       </h4>
                       <p class="dec">初雪悄然而至，洋洋洒洒飘了数日，难得天空放晴，这些花儿最让人心心念念了！冬日的花房比起其他季节并没有.....</p>
                       <p class="info">
                           <span>2022-01-08</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>226</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/4.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">

                               最适合教师节的迷你花束

                           </a>
                       </h4>
                       <p class="dec">在诸多的传统节日中，教师节是一个既令人肃然起敬又饱含慈爱深情的节日。自古以来就有“一日为师终身为父”.....</p>
                       <p class="info">
                           <span>2022-09-08</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>230</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/5.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               秋如黑天鹅般优雅的到来
                           </a>
                       </h4>
                       <p class="dec">伴着街头偶尔飘落的黄叶，和着萧瑟的凉风划过脸颊的不忍，秋正如镜头中低吟的黑天鹅般优雅的到来，不声不响.....</p>
                       <p class="info">
                           <span>2022-09-06</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>101</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/6.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               那些配材花的点睛之笔
                           </a>
                       </h4>
                       <p class="dec">在花艺作品的制作中一般都有三个板块融合穿插而成，她们分工明确而又密切合作，她们承认重点花材不可替代的.....</p>
                       <p class="info">
                           <span>2022-08-14</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>111</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/7.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               适合家庭的摆台花
                           </a>
                       </h4>
                       <p class="dec">经常会有人来咨询哪些花卉适宜家庭摆台花，既能彰显花的婀娜多姿、楚楚动人，又便于养护，上班族回到家中看.....</p>
                       <p class="info">
                           <span>2022-07-16</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>204</span>
                       </p>
                   </div>
               </li>
               <li class="language-item">
                   <div class="language-left">
                       <img src="picture/6.jpg" alt="">
                   </div>
                   <div class="language-info">
                       <h4>
                           <a href="">
                               绿萝的养护
                           </a>
                       </h4>
                       <p class="dec">对于花友而言，绿萝可能是养在家中的第一盆绿植。她的新叶是夏日峰回路转的一簇簇清凉，而且大家似乎都看到.....</p>
                       <p class="info">
                           <span>2022-07-13</span>
                           <span class="margin-left"></span>
                           <span class="margin-left"><i class="iconfont icon-yanjing"></i>92</span>
                       </p>
                   </div>
               </li>
           </ul>
       </div>
   </div>
   <!--素馨花语结束-->
   <!--花卉工作室开始-->
   <div class="work">
       <div class="work-content">
           <div class="work-title">
               <h3>素馨花卉工作室</h3>
           </div>
           <div class="work-item">
                   <p class="work-all">郑州素馨花卉有限公司由优秀的花艺、花卉设计师于2022年成立。</p>
                   <p class="item1">经营范围：花卉、工艺品、饰品的销售；礼仪策划；花卉、苗木种植技术咨询。</p>
               <p class="item">前期以鲜花、花束的包装及零售为主，逐渐过渡到花艺培训、家庭园艺等花香生活的指导，以及与花卉相关的文学创作。</p>
               <p class="item">公司致力于将多彩花艺带入寻常人家，让对生活有着更高追求的人们享受温馨素雅的花香世界，力求将这种文化做到极致。</p>
               <p class="item">公司地址：郑州市 中牟县 育才巷 县直一初中家属院 1单元201室</p>
               <p class="item">联系电话：0371-62180519  15890062947</p>
               <p class="item">电子邮箱：office@suxinhuahui.com</p>
               <p class="item2"><img src="picture/sx4.png" alt=""> </p>
           </div>
       </div>
   </div>
   <!--花卉工作室结束-->
   <!--底部开始-->
   <div class="footer-box">
       <div class="footer-title"></div>
       <div class="footer-qq">
           <i class="iconfont icon-weixin wx"></i>
           <i class="iconfont icon-qq qq"></i>
           <i class="iconfont icon-xiaoxixinfengnews2 qq"></i>
       </div>
       <p class="footer-bottom"><a href="">豫ICP备17021305号</a>&nbsp;&nbsp;<a href=""><img src="picture/aa.png" alt="">豫公网安备 41012202000160号</a></p>
       <p>联系电话 0371-62180519  15890062947</p>
       <p>郑州素馨花卉有限公司 版权所有 © 2022-2022</p>
   </div>

   <!--底部结束-->
</body>
</html>

💒CSS样式代码




/*清除浏览器默认样式*/
* {
    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
}
a{
    text-decoration: none;
}
/*sx首页导航开始*/
.hua-header{
    width: 100%;
    height:79px;
    background:rgba(0,0,0,0.5);
    position: fixed;
    top:0;
    z-index: 999;
}
.container{
    width: 1170px;
    height: 79px;
   /* background: red;*/
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
.header-box{
    width: 1170px;
    height: 79px;
  /*  background: pink;*/
    margin-right: -15px;
    margin-left: -15px;

}
.header-logo{
    width: 150px;
    height: 79px;
    float: left;
    /*background: #ff6700;*/
}
.logo{
    width: 150px;
    height: 50px;
    position: absolute;
    top:0;
    bottom: 0;
    margin: auto 0;
}
.logo img{
    width: 150px;
    height: 50px;
}
.logo img:hover{
   cursor: pointer;
}
.header-nav{
    width: 602px;
    height: 79px;
    float: right;
    overflow: visible!important;
 /*   background: green;*/
}
.header-item{
    padding-top: 0px;
    padding-bottom: 0px;
    height: 79px;
    line-height: 79px;
    float: left;
    padding-right: 22px;
}
.header-item a{
    color:#fff;
}
.header-item a:hover{
    cursor: pointer;
    color:#16B0DE;
}
.one{
    padding-top: 0px;
    padding-bottom: 0px;
    height: 79px;
    line-height: 79px;
    float: left;
    padding-right: 22px;

}
.one a{
    color:#16B0DE;
}
.one a:hover{
    cursor: pointer;
}
.picture{
    width: 100%;
    height: 758.81px;
    position: relative;
    background-image: url("../image/t1.jpg");
}
.picture1{
    width: 100%;
    height: 351.3px;
    position: relative;
    background-image: url("http://www.ylcp.shop/files/files/1654311962308/img/g1.jpg");
}
.dots{
    width:100px;
    height:10px;
    position:absolute;
    right:580px;
    bottom:20px;
}
.dot{
    width:10px;
    height:10px;
    background: rgba(255,255,255,0.3);
    border-radius:50%;
    margin: 0 5px;
    float:left;
}
.hover{
    background: rgba(0,0,0,0.3);
}
.left{
    width: 202px;
    height: 759px;
    float: left;
}
.left:hover{
    background: rgba(0, 0, 0, 0.06);
}
.btn-left{
    width: 41px;
    height: 69px;
    position:absolute;
    left:150px;
    top:345px;
    background-image: url(../image/icon-slides.png);
    background-position: 83px 0;
    display: none;
}
.right{
    width: 202px;
    height: 759px;
    float: right;
}
.right:hover{
    background: rgba(0, 0, 0, 0.06);
}
.btn-right{
    width: 41px;
    height: 69px;
    position:absolute;
    right:150px;
    top:345px;
    background-image: url(../image/icon-slides.png);
    background-position: 42px 0;
    display: none;
}
.left:hover .btn-left{
    display: initial;
}
.right:hover .btn-right{
    display: initial;
}
/*sx首页导航结束*/
/*sx花艺开始*/
.flower{
    padding: 70px 0px;
   /* background: #fff;*/
    position: relative;
}
.flower-container{
    width: 1170px;
    height: 604px;
   /* background: pink;*/
    margin: 0 auto;
}
.flower-content{
    font-size: 36px;
    margin-top: 0px;
    text-align: center;
    font-weight: 300;
    margin-bottom: 20px;
}
.btn{
    background-color: #16b0dc;
    border-color: #16b0dc;
    padding: 5px 13px;
    margin-top: -6px;
    margin-left: 15px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 2px;
    color: #fff;
    position: relative;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
}
.desc{
    font-size: 16px;
    font-weight: 300;
    text-align: center;
    width: 80%;
    color: #5e7387;
    margin: 0px auto;
}
.tu{
    width: 1140px;
    height: 476px;
    /*background: red;*/
    margin-top: 40px;
}
.chahua{
    width: 1020px;
    height: 476px;
   /* background: #2196f3;*/
    margin: 0 auto;
}
.tu1{
    width: 320px;
    height: 320px;
    margin-left: 12px;
}
.tu1 img{
    width: 320px;
    height: 320px;
    border-radius: 50%;
}
.tu-big{
    width: 1020px;
    height: 76px;
    /* background: #2196f3;*/
    margin: 0 auto;
}

.tu-content{
    width: 320px;
    height: 76px;
    /*background: black;*/
    text-align: center;
    float: left;
    margin-right: 20px;
}
.tu-content h4{
    color: #37474f;
    font-size: 18px;
    margin-bottom: 10px;
}
.tu-content p{
    font-size: 14px;
    color: #757575;
    margin-left: 5px;
    text-align: left;
}
.btn-block{
    width: 300px;
    height: 36px;
    font-size: 14px;
    border-radius: 3px;
    margin-top: 22px;
    background: #f96868;
    border-color: #f96868;
    text-align: center;
    line-height: 36px;
    float: left;
}
.btn-block a{
    cursor: pointer;
    color: #fff;
}
.flower-left{
    float: left;
    position: absolute;
    left: 90px;
    top: 338px;

}
.btn-block:hover{
    cursor: pointer;
}
.btn-block i{
    color:#9c2115;
}
.flower-left i{
    color: #b0b0b0;
    font-size: 28px;
}
.flower-right{
    float: left;
    position: absolute;
    right: 90px;
    top: 338px;

}
.flower-right i{
    color: #b0b0b0;
    font-size: 28px;
}
/*sx花艺结束*/
/*素馨花语开始*/
.language{
    width: 100%;
    height: 707px;
    /*margin-top: -50px;*/
    background: #f5f5f5;
    position: relative;
}
.language-content{
   /* font-size: 36px;
    top:20px;
    left:550px;
    text-align: center;
    font-weight: 300;
    position: absolute;*/
    font-size: 36px;
    margin-top: 0px;
    text-align: center;
    font-weight: 300;
    margin-bottom: 20px;
}
.language-big{
    width: 1170px;
    height: 504px;
    position: absolute;
    top:70px;
   /* background: #ff6700;*/
}
.language-item{
    width: 555px;
    height: 96px;
    /*background: red;*/
    float: left;
    margin-right: 30px;
    margin-top: 30px;
}
.language-left{
    width: 180px;
    height: 96px;
}
.language-left img{
    width: 160px;
    height: 96px;
}
.language-info{
    width: 375px;
    height: 96px;
   /* background: black;*/
    float: right;
    margin-top: -96px;
    overflow: hidden;
}
.language-info a{
    color: #2a333c;
}
.language-info a:hover{
    color: #16b0dc;
    text-decoration:underline;
}
.dec{
    font-weight: 300;
    font-size: 14px;
    color: #76838f;
    margin: 10px 0 11px;
    margin-bottom: 5px;
}
.info{
    font-weight: 300;
    margin: 10px 0 11px;
    font-size: 14px;
    color: #76838f;
}
.margin-left{
    margin-left: 10px;
}
/*素馨花语结束*/
/*花卉工作室开始*/
.work{
    width: 100%;
    height: 905px;
    margin-top: 60px;
    /*background: #2196f3;*/
    border-bottom: 1px solid #b0b0b0;
}
.work-content{
    width: 1170px;
    height: 765px;
   /* background: #ff6700;*/
    margin: 0 auto;
}
.work-title{
    width: 1140px;
    height: 43px;
    margin: 0 auto;
    /*background: pink;*/
}
.work-title h3{
    font-size: 36px;
    font-weight: 300;
    margin-top: 0;
    text-align: center;
}
.work-item{
    width: 1140px;
    height: 672px;
    margin: 0 auto;
    /*background: green;*/
}
.work-all{
    margin-top: 70px;
    text-align: center;
    font-weight: 300;
    color: #222;
    font-size: 18px;
}
.item1{
    margin-top: 30px;
    text-align: center;
    font-weight: 300;
    font-size: 18px;
    color: #222;
}
.item{
    margin-top: 10px;
    text-align: center;
    font-weight: 300;
    font-size: 18px;
    color: #222;
}
.work-item img{
    width: 530px;
    height: 340px;
}
.item2{
    margin-top: 30px;
    text-align: center;
    font-weight: 300;
    font-size: 18px;
    color: #222;
    margin-bottom: 30px;
}
/*花卉工作室结束*/
/*底部开始*/
/*底部开始*/
.footer-box{
    width: 100%;
    height: 182px;
    padding-bottom: 20px;
    background: #f5f5f5;
    border-top: 1px solid #f0f2f5;
    color: #aaaaaa;
    text-align: center;
}
.footer-title{
    width: 100%;
    height: 20px;
    background: #fff;
    border-top: 1px solid #f0f2f5;
}
.footer-qq{
    width: 100%;
    height: 56px;
    text-align: center;
    padding-top:20px;
}
.footer-qq i{
    font-size: 30px;
    margin-right: 10px;
}
.wx{
    color: green;
}
.qq{
    color: #3cafff;
}
.footer-bottom{
    width: 100%;
    }
.footer-bottom a{
    color: #62a8ea;
    font-size: 15px;
    margin-right: 10px;
    cursor: pointer;
}
.footer-bottom a:hover{
    color: #89bceb;
    text-decoration: underline;
}
.footer-bottom img{
    font-size: 15px;
}
.footer-box p{
    color: #aaaaaa;
    font-size: 15px;
    margin-right: 10px;
    margin-top: 5px;
}
/*底部结束*/

六、🥇 如何让学习不再盲目

21年程序员总结给编程菜鸟的16条忠告

  1. 入门期间不要盲目看太多书，找一本网上或身边有经验程序员推荐的教材，先系统的学习。
  2. 多看帮助文档，帮助文档就像一个游戏的玩法说明通关秘籍，该看就看别太自信。
  3. 菜鸟容易被对象、属性、方法等词汇迷惑？那是你连最基础知识都还没掌握。
  4. 不要忽视没一个看起来不起眼的问题，经常总结做到举一反三。
  5. 没积累足够知识和经验前，你是开发不出一个完整项目的。
  6. 把最新技术挂在嘴边，还不如把过时技术牢记心中。
  7. 活到老学到老，只有一招半式是闯不了江湖的。
  8. 看得懂的书，仔细看；看不懂的书，硬着头皮也要看完。
  9. 书读百遍其义自见，别指望读一遍就能掌握。
  10. 请把教程里的例子亲手实践下，即使案例中有完整源码。
  11. 把在教程中看到的有意义的例子扩充；并将其切实的运用到自己的工作中。
  12. 不要漏掉教程中任何一个习题——请全部做完并做好笔记。
  13. 水平是在不断的实践中完善和发展的，你与大牛差的只是经验的积累。
  14. 每学到一个难点的时候，尝试对朋友或网上分享你的心得,让别人都能看得懂说明你真的掌握。
  15. 做好保存源文件的习惯，这些都是你的知识积累。
  16. 遇到问题不要张口就问，要学会自己找答案，比如google、百度和w3cschool上都有很多编程相关资料，你只要输入关键字就能找到你的答案。

七、🎁更多干货

1.如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “👍点赞” “✍️评论” “💙收藏” 一键三连哦！

2.💗【👇🏻👇🏻👇🏻关注我| 💬获取更多源码 | 优质文章】 带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者，一起探讨 前端 Node 知识，互相学习」！

3.

以上内容技术相关问题💌欢迎一起交流学习👇🏻👇🏻👇🏻💬

在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/56914.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

Win11的两个实用技巧系列之如何关闭文字热门搜索、任务栏上的应用

Win11的两个实用技巧系列之如何关闭文字热门搜索、任务栏上的应用

目录 in10和Win11 22H2如何关闭文字热门搜索? Win11 22H2关闭文字热门搜索 Win10 22H2关闭文字热门搜索 Win11中如何不用鼠标打开已固定在任务栏上的应用 鼠标的操作方式如下&#xff1a; 点击拿去 in10和Win11 22H2如何关闭文字热门搜索? 不管是Win10还是Win11&#…
阅读更多...
R语言GARCH-DCC模型和DCC（MVT）建模估计

R语言GARCH-DCC模型和DCC（MVT）建模估计

这个简短的演示说明了使用r软件包的DCC模型及其方法的使用&#xff0c;尤其是在存在MVT分布形状参数的情况下进行2级DCC估计的另一种方法。 最近我们被客户要求撰写关于GARCH-DCC的研究报告&#xff0c;包括一些图形和统计输出。 相关视频&#xff1a;时间序列分析&#xff…
阅读更多...
[附源码]计算机毕业设计springboot小型银行管理系统

[附源码]计算机毕业设计springboot小型银行管理系统

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat7.0 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; SSM mybatis Maven Vue 等等组成&#xff0c;B/S模式 M…
阅读更多...
用HTML、CSS技术设计的个人网页与实现制作（web前端期末大作业）

用HTML、CSS技术设计的个人网页与实现制作（web前端期末大作业）

&#x1f389;精彩专栏推荐&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业…
阅读更多...
“极致成本向左，本质安全向右”-谈谈锂电池储能系统的发展趋势

“极致成本向左，本质安全向右”-谈谈锂电池储能系统的发展趋势

极致成本 or 本质安全？ 1 快速增长的电化学储能电站 根据CNESA全球储能项目库的不完全统计，截至 2021 年底，全球已投运电力储能项目累计装机规模 209.4GW， 同比增长 9%。其中，抽水蓄能的累计装机规模占比首次低于 90%，比去年同期下降4.1个百分点；新型储能的累计装机规模…
阅读更多...
Windows性能监视器使用说明

Windows性能监视器使用说明

如何使用性能计数器 进入性能计数器 方式一&#xff1a; 命令行 perfmon 方式二&#xff1a;图形化操作 控制面板→系统与安全→管理工具→性能监视器 创建计数器收集器 创建收集器 在采集数据前&#xff0c;需要做好相应的收集器创建。 监视工具性能监视器&#xf…
阅读更多...
Global Mapper将0-255的色彩映射表导出为RGB波段

Global Mapper将0-255的色彩映射表导出为RGB波段

当我们拿到0-255的色彩映射表栅格文件的时候&#xff0c;可能不太好用&#xff0c;需要导出为RGB波段或者其他波段形式的&#xff0c;在Global Mapper中可以做到。 打开0-255色彩映射表的栅格文件&#xff0c;在Arcmap中可以看到是这样的&#xff1a; 在Global Mapper中操作…
阅读更多...
android灰色滤镜布局

android灰色滤镜布局

android灰色滤镜布局 h5网页灰色滤镜 只要给 html 加下列css 样式就可以了 html {filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale1);-webkit-filter: grayscale(100%); }Android组件灰色滤镜 ColorMartrix类&#xff0c;这个类对外提供了很多 API&#x…
阅读更多...
重点问题！CPU利用率过高排查思路｜原创

重点问题！CPU利用率过高排查思路｜原创

本文讲解了重点面试问题CPU利用率高如何排查和解决。点击上方“后端开发技术”&#xff0c;选择“设为星标” &#xff0c;优质资源及时送达CPU利用率高怎么办&#xff1f;如何排查和解决这是一个常见的面试问题&#xff0c;也是线上常遇到的问题之一。遇到线上服务器异常告警&…
阅读更多...
【Win10】如何关闭Windows10自动更新

【Win10】如何关闭Windows10自动更新

如何关闭Windows10自动更新 零、问题 Windows10老是自动更新&#xff0c;有时候第二天起来又得重新打开软件&#xff0c;真麻烦&#xff0c;Win10自动更新的时候还有点卡。 如何关闭&#xff1f; 经过上网查询&#xff0c;发现完全关闭难度比较大&#xff0c;但是我们可以选…
阅读更多...
HTML学生个人网站作业设计 明星易烊千玺介绍(HTML+CSS) web前端开发技术 web课程设计 网页规划与设计

HTML学生个人网站作业设计 明星易烊千玺介绍(HTML+CSS) web前端开发技术 web课程设计 网页规划与设计

&#x1f389;精彩专栏推荐&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业…
阅读更多...
【信管2.5】项目可研（一）立项和可行性研究

【信管2.5】项目可研（一）立项和可行性研究

项目可研&#xff08;一&#xff09;立项和可行性研究对于一个项目来说&#xff0c;最开始的步骤就是这个项目的立项过程。在这个过程中&#xff0c;我们要做的工作主要就是可行性研究。也就是说&#xff0c;这个项目值不值得我们来做&#xff0c;就需要对项目所涉及的领域、投…
阅读更多...
fcpx插件：Stupid Raisins Grid Pop(网格弹出布局模板)

fcpx插件：Stupid Raisins Grid Pop(网格弹出布局模板)

Stupid RAIsins Grid Pop是一款fcpx插件&#xff0c;可以在Final Cut Pro中快速布局任何网格弹出内容。为您轻松排队&#xff0c;均匀分配和安排任何物品&#xff01; 快速轻松地对齐fcpx中的所有内容&#xff01; Grid Pop是在Final Cut Pro X中进行布局&#xff0c;对齐和分布…
阅读更多...
【RTS】安海波老师：SIP与RTC融合分享笔记

【RTS】安海波老师：SIP与RTC融合分享笔记

2020年已经应用。至今，呼叫中心与RTC结合，已经有了新探索。呼叫中心和RTC领域实践 ： SIP与RTC融合 如何应用。五部分 贝壳联络中心 2018年分拆周三的财报：基于FS开源平台 <
阅读更多...
(AVL)平衡二叉树

(AVL)平衡二叉树

还是照旧&#xff0c;本篇主要讲一下代码实现&#xff0c;AVL相关的定义什么的这里不多赘述。 AVL树就是为了解决bst树出现了“线性”的问题&#xff0c;而发明的。什么是线性的就是一棵bst树全都只有左子树或者全都只有右子树&#xff0c;能想象来吧。 目录 LL型调整(左旋) …
阅读更多...
HTML5期末考核大作业、HTML个人主页界面设计源码

HTML5期末考核大作业、HTML个人主页界面设计源码

&#x1f389;精彩专栏推荐&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业…
阅读更多...
uniapp 中 vuex 的使用

uniapp 中 vuex 的使用

1. uniapp 中 vuex 的介绍 2. uniapp 中 vuex 的使用 3. require.context 介绍 4. vuex 模块分离 5. vuex 模块分离 - 代码优化 1. uniapp 中 vuex 的介绍 uniapp 内置了 vuex&#xff0c;不需像 vue 脚手架那样里通过 npm 安装了&#xff0c;我们只需要引用就行了 2. un…
阅读更多...
会员接口治理的探索与实践

会员接口治理的探索与实践

随着爱奇艺会员破亿&#xff0c;会员服务从小而快的单一业务系统升级为了按领域划分的微服务模式&#xff0c;满足了业务的高速发展和服务的高流量调用&#xff0c;但是微服务的拆分&#xff0c;系统间的交互越来越多&#xff0c;在需求开发时&#xff0c;协作成本随之增加&…
阅读更多...
[激光原理与应用-30]：典型激光器 -2- 气体激光器 （连续激光器）

[激光原理与应用-30]：典型激光器 -2- 气体激光器 （连续激光器）

目录 第1章 概览 1.1 什么气体激光器 1.2 主要激励方式 1.3 发展历程 1.4 组成 1.5 特点 第2章 气体激光器分类 2.1 原子气体激光器 2.2 离子气体激光器 2.3 分子气体激光器 2.4 准分子激光器 第1章 概览 1.1 什么气体激光器 气体激光器利用气体作为工作物质产生激…
阅读更多...
AlphaFold2源码解析(6)--模型之特征表征

AlphaFold2源码解析(6)--模型之特征表征

AlphaFold2源码解析(6)–模型之特征表征 整体推理说明&#xff1a; Embedding只是在推理使用&#xff0c;影响非常小&#xff08;sup-Inference篇章&#xff09; 特征表征表示的入口模型如下&#xff1a; evoformer_module EmbeddingsAndEvoformer(self.config.embeddings_…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023