文章目录

  • 返回总结
  • 整体效果
  • 组件
    • 人物介绍块
    • 内容介绍块
  • 代码
    • 独属CSS HairLossGuide.css
    • html HairLossGuide.html

返回总结

如何利用Boostrap框架搭建一个还可以的静态网站

整体效果

组件

之前书写的组件不再重复书写

人物介绍块

<div class="thumbnail"><img src="img/HairLossGuide/header_img_1_600x600.jpg" alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">蓝色怪猫</h3><p>琴棋书画无不精通的一位怪猫</p><p>在十几年的猫和老鼠连续剧当中永不脱发</p><p>具有非常丰富的不掉毛发的经验</p><p>是我们的不脱毛专家!</p></div>
</div>

css

.thumbnail_img_size{height: 150px;width: 150px;
}
.font_head{color: red;font-family: "黑体";
}

内容介绍块

             <div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_1_600x600.jpg" alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">蓝色怪猫</h3><p>琴棋书画无不精通的一位怪猫</p><p>在十几年的猫和老鼠连续剧当中永不脱发</p><p>具有非常丰富的不掉毛发的经验</p><p>是我们的不脱毛专家!</p></div></div></div><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_2_150X150.jpg " alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">羊村现任村长</h3><p>絮絮叨叨唐僧再世却一心负责扛起大旗的老村长</p><p>在十几年的喜羊羊和灰太狼连续剧当中疯狂长草</p><p>具有非常丰富的增长毛发的经验</p><p>是我们的长毛专家!</p></div></div></div><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_3_300X300.jpg" alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">美元界代表美元</h3><p>象征的金钱与财富的美元</p><p>在任何地点任何时间都可以让人花钱植发的秘密武器</p><p>具有非常丰富的消费植发的经验</p><p>是我们的植发专家!</p></div></div></div></div>

代码

独属CSS HairLossGuide.css

#HairLossGuide_carousel{height:50%;
}
.thumbnail_img_size{height: 150px;width: 150px;
}

html HairLossGuide.html

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /><link rel="stylesheet" type="text/css" href="css/style.css" /><link rel="stylesheet" type="text/css" href="css/bootstrap-datetimepicker.css"><link rel="stylesheet" type="text/css" href="css/indexCss1.css" /><link rel="stylesheet" type="text/css" href="css/SmokeNote_Style.css" /><link rel="stylesheet" type="text/css" href="css/CommonStyle.css" /><link rel="stylesheet" type="text/css" href="animate.min.css" /><link rel="stylesheet" type="text/css" href="css/HairLossGuide.css" /><script src="js/jquery-3.4.1.js"></script><script src="js/bootstrap.min.js"></script><script src="js/CommonStyle.js"></script><title></title></head><body><header><div><nav class="navbar navbar-default col-lg-12" id="_header_MainScreen"><div class="container-fluid"><!-- Brand and toggle get grouped for better mobile display --><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><div id="" class="AUTO_center"><a class="navbar-brand" href="#"><img src="img/logo.png"></a></div></div><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li><a href="index.html"  class="font_style_150-withe-txt">主站 <span class="sr-only">(current)</span></a></li><li><a href="SmokeNote.html"  class="font_style_150-withe-txt">戒烟说</a></li><li><a href="HairLossGuide.html"  class="font_style_150-withe-txt">脱发指南</a></li><li><a href="ElectronicCigarettes.html"  class="font_style_150-withe-txt">电子烟评鉴</a></li><li><a href="register.html"  class="font_style_150-withe-txt">加入我们</a></li></ul><form class="navbar-form navbar-left"><div class="form-group"><input type="text" class="form-control" placeholder="Search"></div><button type="submit" class="btn btn-default">百度一下</button></form><ul class="nav navbar-nav navbar-right"><li><a href="#"  class="font_style_150-withe-txt">登入</a></li><!-- <li><a href="#"><img src="img/logo/tg_100x31.png" ></a></li>--></ul></div><!-- /.navbar-collapse --></div><!-- /.container-fluid --></nav></div></header><banner><div class="jumbotron color_MianColor" id="_banner_jumbotron"><div id="_Main_title_logo" class="bounceInRight animated"><img src="img/_Main_Tiele.png"><!-- /.中文网 LOGO --></div></banner><div id="" class="space_div_col12_height50px"></div><marquee behavior="" direction="right"><!-- /.日期 --><p id="timeOrder" class="font_date bounceInLeft animated"></p></marquee><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div id=""><div id="carousel-example-generic" class="carousel slide" data-ride="carousel"><!-- Indicators --><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><!-- Wrapper for slides --><div class="carousel-inner" role="listbox"><div class="item active"><img src="img/HairLossGuide/carousel_img_1_test.jpg" alt="..." class="style_autoIMG"><div class="carousel-caption"><h3 class="font_head">拒绝香烟,抵制诱惑</h3><p>上帝救不了你,而你就是上帝</p></div></div><div class="item"><img src="img/HairLossGuide/carousel_img_2.png" alt="..." class="style_autoIMG"><div class="carousel-caption"><h3 class="font_head">从我做起,掌控人生</h3><p>不能失去生活的每一块阵地,从一根烟开始</p></div></div><div class="item"><img src="img/adversting/adversting_changpai_1750X745%20-%20副本_gaitubao_900X385.png" alt="..." class="style_autoIMG"><div class="carousel-caption"><h3 class="font_head">加入我们,互帮互助</h3><p>希望,未来,活力,家</p></div></div></div><!-- Controls --><a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div></div></div><div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><h2 class="text-center font_head">超级顾问团</h2></div>   <div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><main><div id="" class="container-fluid"><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_1_600x600.jpg" alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">蓝色怪猫</h3><p>琴棋书画无不精通的一位怪猫</p><p>在十几年的猫和老鼠连续剧当中永不脱发</p><p>具有非常丰富的不掉毛发的经验</p><p>是我们的不脱毛专家!</p></div></div></div><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_2_150X150.jpg " alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">羊村现任村长</h3><p>絮絮叨叨唐僧再世却一心负责扛起大旗的老村长</p><p>在十几年的喜羊羊和灰太狼连续剧当中疯狂长草</p><p>具有非常丰富的增长毛发的经验</p><p>是我们的长毛专家!</p></div></div></div><div class="col-lg-4"><div class="thumbnail"><img src="img/HairLossGuide/header_img_3_300X300.jpg" alt="..." class="img-circle thumbnail_img_size"><div class="caption"><h3 class="text-center font_head">美元界代表美元</h3><p>象征的金钱与财富的美元</p><p>在任何地点任何时间都可以让人花钱植发的秘密武器</p><p>具有非常丰富的消费植发的经验</p><p>是我们的植发专家!</p></div></div></div></div><div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><h2 class="text-center font_normal">专家建议时间</h2></div> <div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div id="" class="col-lg-4"><img src="img/HairLossGuide/header_img_1_600x600.jpg" class="style_autoIMG img-thumbnail div_center_byHeight_25percent"></div><div id="" class="col-lg-8"><div id="" class="center-block"><h3  class="text-center">造成脱发的原因有哪些呢?</h3><h4>一,激素原因?</h4><p>内分泌失调也可引起脱发。甲状腺机能亢进或过低、男子雄性激素分泌过多、女性雌性激素分泌过少,都会引起早秃或大量脱发。同时产后脱发是正常现象,尤其是在产后3~4个月更为显著,可持续数月,原因就是怀孕时激素分泌旺盛,掉发减少,产后激素下降,代谢加速,导致脱发,其实就是过去9个月正常发量,产后6个月内恢复正常。</p><h4>二,精神焦虑和生活作息不规律</h4><p>情绪消沉、精神压抑或受到重大精神创伤时,人体的神经系统功能紊乱,头部血液供应不足,因而会在短时间内大量脱发。长期紧张脑力劳动及熬夜,会使头发、头皮毛囊的血液供应相对减少,毛囊因血液供应不足而逐渐萎缩退化导致脱发</p><h4>三,清洁护理不到位或使用刺激性洗发水</h4><p>经常不洗头容易造成毛囊堵塞,容易脱发。经常使用脱脂性强的洗发水,会是头发干燥、头皮坏死而出现脱发。</p><h4>四,营养失衡</h4><p>饮食单调可造成脱发,某些疾病造成的消化吸收机能障碍,可引起营养失衡,使毛发枯黄、易断或脱落等。现在的人忠于减肥,以瘦为美。饮食上营养跟不上,毛发干枯、脆裂,容易掉。</p></div></div></div><div id="" class="col-lg-2"></div></div><!--两个div50px 和一个hr构成的占位--><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><hr /></div><div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div id="" class="col-lg-8"><h3 class="text-center">如何有效生发?</h3><h4>1.生姜水洗头</h4><p>生姜水具有刺激生发,减少脱发的作用,而且还能杀菌去油。
用生姜水洗头前,要将生姜切成大小一样片状,然后加水烧开,煮出一锅浓浓的生姜水。如果你想要加强功效,可以选用榨汁机,直接将生姜榨汁,然后加入你的洗头水中即可。</p><h4>2.适当按摩</h4><p>我们都知道,要想拥有一头好头发,必须先得拥有一个健康的头皮。对头皮进行按摩,能刺激头皮毛细血管,让血液循环更旺盛,以供给大脑更多的氧气和养料。
头皮血液循环改善了,头发的生长发育也将会得到改善,对抑制头发脱落也有非常好地作用。</p><h4>3.多吃含铁的食物</h4><p>中医认为,“肝藏血,发为血之余,血亏则发枯。肾为先天之本,精血之源,其华在发。”头发变白和气血不足有关系,日常饮食可多吃补气血的食物,如猪肝、鸡蛋、海带等富含铁的食物。</p><h4>4.适当运动</h4><p>适当的运动。生命在于运动,适当的运动能够加快新陈代谢,提高营养吸收能力,配合合理饮食,有利于头发养护。!</p><h4>5.保证睡眠时间</h4><p>肾为先天之本,精血之源,其华在发,想要肾好,就要休息好,想要休息好,就要睡眠好,所以每天的睡眠时间尽可能保证在7~8个小时左右。</p></div><div id="" class="col-lg-4"><div id="" class="center-block"><img src="img/HairLossGuide/header_img_2_550X500.jpg" class="style_autoIMG img-thumbnail div_center_byHeight_25percent"></div></div></div><div id="" class="col-lg-2"></div></div><!--两个div50px 和一个hr构成的占位--><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><hr /></div><div id="" class="col-lg-2"></div></div><div id="" class="space_div_col12_height50px"></div><div id="" class="row"><div id="" class="col-lg-2"></div><div id="" class="col-lg-8"><div id="" class="col-lg-4"><img src="img/HairLossGuide/header_img_3_300X300.jpg" class="style_autoIMG img-thumbnail div_center_byHeight_25percent"></div><div id="" class="col-lg-8"><div id="" class="center-block"><h3 class="text-center">植发防坑指南</h3><h4>1、通过正规网站辨别医生的资质</h4><p>植发主刀医生需要具备两个资质:医师资格证、医师执业证,这些都是可以在国家卫生健康委员会官网:http://www.nhc.gov.cn/ 进行医生资质查询的。我以
@徐鲁医生为例,通过执业医院和名字就可以查询到医生的信息,如下图。</p><h4>2、锁定植发医生年龄</h4><p>在很多人的认知中,认为有经验的专家就一定是七老八十,并且年龄越大就越有经验!但在植发行业恰恰相反,植发是一个重实操的项目,并且还是一个体力活。植发手术我就拿最平常的3000单位算,最少也需要三四个小时才能做完,你真的指望一位六七十岁的专家弯着腰咬着牙,集中注意力三四个小时,拼命不让自己手抖为你植发?你确定当时你的心里不打鼓?</p><br/><p>告诉大家,植发医生的最佳年龄是在30~40岁,也就是青壮年时期,并且有了比较长的临床经验的医生才是最适合的。以我们医院的医生机制为例,必须在临床外科注册满三年,并有学习培训1年以上才可独立操作植发,我们的 @徐鲁  医生,他的临床经验就非常丰富,至今从业十余年了,并且也为很多知友植发过。</p><h4>3、确保整个植发过程中,亲自为你植发的医生始终是同一个人</h4><p>在任何地点任何时间都可以让人花钱植发的秘密武器</p></div></div></div><div id="" class="col-lg-2"></div></div></div></main><div id="" class="space_div_col12_height50px"></div><tfoot><!-- 页脚 --><div id="footer_Info" class="color_footer" align="center"><div class="row"><div class="col-lg-6 col-md-6 col-sm-12" text-align="left"><p><a href="">备案信息:渝ICP备</a></p><p class="font_style_150-withe-txt">使用chrome,火狐等最新主流浏览器获得更好的浏览效果</p><p class="font_style_150-withe-txt">网站建议或者意见请发送邮件:</p>s<p class="font_style_150-withe-txt">© NOSmoke 2020. All rights reserved.</p></div><div class="col-lg-6 col-md-6 col-sm-12"><p class="font_style_150-withe-txt">扫码关注公众号'老烟鬼教你戒烟'!</p><p class="font_style_150-withe-txt">加入戒烟群,重获新生!</p><img src="img/MainPage_FootQRCode.png" style="height: 150px; width:150px;"></div></div></div></tfoot></body>
</html>

[Web]如何利用Boostrap框架搭建一个还可以的静态网站(五_子页_脱发指南)相关推荐

  1. [Web]如何利用Boostrap框架搭建一个还可以的静态网站(六_子页)

    文章目录 返回总结 整体效果 组件 vedio题目 vedio博主介绍 vedio vedio用户留言 电子烟评测块 辩论块 代码 html ElectronicCigarettes.html 返回总 ...

  2. [Web]如何利用Boostrap框架搭建一个还可以的静态网站(四_子页_戒烟小说)

    文章目录 返回总结 整体效果 思路 组件 轮播图 排行榜 轮播广告语 广告 空行 小说块 代码 独属css SmokeNote_Style.css html SmokeNote.html 返回总结 如 ...

  3. [Web]如何利用Boostrap框架搭建一个还可以的静态网站(三_主页)

    文章目录 返回总结 整体效果 思路 各个组件代码 导航栏 LOGO 滚动时间 标题线 图词模块 页脚 代码 独属css文件 indexCss1.css html代码 index.html 返回总结 如 ...

  4. 通过python利用Django框架搭建一个属于自己的免费网站(已更新)

    大家好,我是天空之城,今天给大家带来,通过python利用Django框架搭建一个属于自己的免费网站. 以下是网上找到的免费教程,https://djangogirlstaipei.gitbooks. ...

  5. 用VuePress来搭建一个极简的静态网站

    VuePress学习 全局安装前我们需要Git和node这两个软件,关于怎么安装可以我之前hexo的视频教程 假如这两个都没有安装好,那么下面就不需要看了哈,栈友们 全局安装 首先我们先全局安装一下 ...

  6. github项目怎么运行_利用 GitHub 从零开始搭建一个博客

    "NightTeam",一个值得加星标的公众号. 趁着周末,搭建了一下 NightTeam 的官方博客和官方主页,耗时数个小时,两个站点终于完工了. 由于 NightTeam 的域 ...

  7. 快速的利用 Express 框架实现一个 Rustfull 接口的后端 Server

    快速的利用 Express 框架实现一个 Rustfull 接口的后端 Server 附:基于 Nodejs 的服务器后端的框架用的比较多的是 Koa : github/kaojs/koa 但本文这里 ...

  8. 如何利用laragon框架制作一个简单的应用?

    如何利用laragon框架制作一个简单的应用? 一.搭建环境 1. 安装Laragon 1.1 打开安装包用的语言 选择自己习惯用的语言 1.2 选择安装地址 1.3 选择Next,开始install ...

  9. 利用 GitHub 从零开始搭建一个博客

    "NightTeam",一个值得加星标的公众号. 趁着周末,搭建了一下 NightTeam 的官方博客和官方主页,耗时数个小时,两个站点终于完工了. 由于 NightTeam 的域 ...

最新文章

  1. arXiv爆款:想了解Attention就看它!
  2. 敢问路在何方——项目经理成长手记
  3. 汇编-使用VS2008查看反汇编语言
  4. 用钱生钱,从掌握金钱的规律开始
  5. MySQL基础总结(一)
  6. 数据结构之选择排序:堆排序
  7. 快速搭建 SpringCloud 微服务开发环境的脚手架
  8. 下班后比你多学2个小时的人,在看这几个公众号
  9. USB HID 协议
  10. CCF201604试题
  11. Java基础(彩票小程序)
  12. Vue之echarts圆饼图详解
  13. 全球创见者共话企业韧性 金蝶“数字员工”惊艳亮相
  14. [CF 417D]Cunning Gena:状压DP
  15. pgAdmin4 汉化
  16. 分糖问题和插板法:10个相同糖果分给3个小朋友,有几种分法?
  17. [笔记]物化视图和普通视图
  18. 机器翻译与编码-解码模型 Machine Translation and Encoder-Decoder Models
  19. JAVA sleep函数如何用_转载:java中Thread.sleep()函数使用
  20. JavaScript中的强制多态 | Lynda教程 中文字幕

热门文章

  1. python课堂笔记课后练习(高琪400集第一季)
  2. 2020第十二届中国最佳酒店大奖榜单发布
  3. 2020年中国网络经济年度洞察报告
  4. AC-DC非隔离开关电源芯片5V12V500mA
  5. 基于STM32水温炉温温度控制系统电路设计-分享
  6. java文件下载时文件类型_Java基础之文件下载实现自定义名称和格式类型-java下载文件...
  7. zookeeper 使用场景
  8. 学习软件测试基础测试第十三天
  9. html document转换,HTML DOM Document
  10. 高危预警!移动设备安全面临的5大新型威胁