ch11-进度条和媒体对象组件.ppt

第11章进度条和媒体对象组件Well组件进度条（progress）组件媒体对象组件教学内容Well组件一、Well组件：这个组件可以实现简单的嵌入效果。1.嵌入效果divclass=well well组件的效果/div2.有lg和sm两种可选值divclass=wellwell-lg well组件的效果/div进度条（progress）组件二、进度条（progress）组件：进度条组件为当前工作流程或动作提供同步反馈。1.基本进度条divclass=progress divclass=progress-barstyle=width:30%; 30% /div/div2.最低值进度条divclass=progress divclass=progress-barstyle=width:0%;min-width:30px; 0% /div/div?3.不同样式的进度条divclass=progress divclass=progress-barprogress-bar-successstyle=width:30%; 30% /div/div4.条纹状（striped）divclass=progress divclass=progress-barprogress-bar-successprogress-bar-stripedstyle=width:30%; 30% /div/div5.动画效果，只有条纹状支持divclass=progress divclass=progress-barprogress-bar-successprogress-bar-stripedactivestyle=width:30%; 30% /div/div媒体对象组件三、媒体对象组件：媒体对象可以包含图片、视频或音频等媒体，以达到对象和文本组合显示的样式效果。1.基本实例divclass=media divclass=media-leftmedia-middle imgsrc=img/hippo2.jpgclass=media-object/ /div divclass=media-body h3class=media-heading河马/h3 p河马（学名：Hippopotamusamphibius）是淡水物种中的最大型杂食性哺乳类动物，体型巨大，体长4米，肩高1.5米，体重约3吨，躯体粗圆，四肢短，脚有4趾，头硕大，眼、耳较小，嘴特别大，尾较小，下犬齿巨大，长50-60厘米，重2.5千克，皮较厚，约40-50毫米，除吻部、尾、耳有稀疏的毛外，全身皮肤裸露，呈紫褐色.胃三室，不反刍。生活于非洲热带水草丰盛地区，常由10余只组成群体，有时也能结成上百只的大群，单独的河马多是由群中被逐出的成年雄兽；白天几乎全在水中，食水草，日食量100千克以上，水草缺少时，便在夜间上岸觅食植物或农作物；性温顺，惧冷喜暖，善游泳，可沿着河底潜行5～10分钟；在交配季节，雄性间时有争斗，妊娠期约8个月，每胎1仔。哺乳期1年，4-5岁性成熟，寿命30-40年。分布于非洲。 /p /div /div2.媒体对象在右边divclass=media divclass=media-body h3class=media-heading河马/h3 p河马（学名：Hippopotamusamphibius）是淡水物种中的最大型杂食性哺乳类动物，体型巨大，体长4米，肩高1.5米，体重约3吨，躯体粗圆，四肢短，脚有4趾，头硕大，眼、耳较小，嘴特别大，尾较小，下犬齿巨大，长50-60厘米，重2.5千克，皮较厚，约40-50毫米，除吻部、尾、耳有稀疏的毛外，全身皮肤裸露，呈紫褐色.胃三室，不反刍。生活于非洲热带水草丰盛地区，常由10余只组成群体，有时也能结成上百只的大群，单独的河马多是由群中被逐出的成年雄兽；白天几乎全在水中，食水草，日食量100千克以上，水草缺少时，便在夜间上岸觅食植物或农作物；性温顺，惧冷喜暖，善游泳，可沿着河底潜行5～10分钟；在交配季节，雄性间时有争斗，妊娠期约8个月，每胎1仔。哺乳期1年，4-5岁性成熟，寿命30-40年。分布于非洲。 /p /div divclass=media-rightmedia-middle imgsrc=img/hippo2.jpgclass=media-object/ /div /div Well组件进度条（pro