图片轮播 内嵌网页
1 <div id="myCarousel1" class="carousel slide" data-ride="carousel" data-interval="6000"> 2 @*<ol class="carousel-indicators"> 3 <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 4 <li data-target="#myCarousel" data-slide-to="1"></li> 5 <li data-target="#myCarousel" data-slide-to="2"></li> 6 <li data-target="#myCarousel" data-slide-to="3"></li> 7 <li data-target="#myCarousel" data-slide-to="4"></li> 8 </ol>*@ 9 <div class="carousel-inner" role="listbox"> 10 <div class="item active"> 11 <img src="~/images/tupian1.png" @*alt="ASP.NET"*@ class="img-responsive" /> 12 @*<div class="carousel-caption" role="option"> 13 <p> 14 Learn how to build ASP.NET apps that can run anywhere. 15 <a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkID=525028&clcid=0x409"> 16 Learn More 17 </a> 18 </p> 19 </div>*@ 20 </div> 21 <div class="item"> 22 <img src="~/images/tupian2.png" @*alt="Visual Studio"*@ class="img-responsive" /> 23 @*<div class="carousel-caption" role="option"> 24 <p> 25 There are powerful new features in Visual Studio for building modern web apps. 26 <a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkID=525030&clcid=0x409"> 27 Learn More 28 </a> 29 </p> 30 </div>*@ 31 </div> 32 <div class="item"> 33 <img src="~/images/tupian3.png" @*alt="Package Management"*@ class="img-responsive" /> 34 @*<div class="carousel-caption" role="option"> 35 <p> 36 Bring in libraries from NuGet, Bower, and npm, and automate tasks using Grunt or Gulp. 37 <a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkID=525029&clcid=0x409"> 38 Learn More 39 </a> 40 </p> 41 </div>*@ 42 </div> 43 <div class="item"> 44 <img src="~/images/tupian4.png" @*alt="Microsoft Azure"*@ class="img-responsive" /> 45 @*<div class="carousel-caption" role="option"> 46 <p> 47 Learn how Microsoft's Azure cloud platform allows you to build, deploy, and scale web apps. 48 <a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkID=525027&clcid=0x409"> 49 Learn More 50 </a> 51 </p> 52 </div>*@ 53 </div> 54 <div class="item"> 55 <img src="~/images/tupian5.png" @*alt="Microsoft Azure"*@ class="img-responsive" /> 56 @*<div class="carousel-caption" role="option"> 57 <p> 58 Learn how Microsoft's Azure cloud platform allows you to build, deploy, and scale web apps. 59 <a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkID=525027&clcid=0x409"> 60 Learn More 61 </a> 62 </p> 63 </div>*@ 64 </div> 65 </div> 66 @*<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev"> 67 <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 68 <span class="sr-only">Previous</span> 69 </a> 70 <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next"> 71 <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 72 <span class="sr-only">Next</span> 73 </a>*@ 74 </div>
内嵌网页自适应高
1 <div class="content"> 2 <iframe src="http://192.168.2.18:9080/wsyt/" id="iframepage" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" onLoad="changeFrameHeight()" style="width:100%;"></iframe> 3 </div> 4 </div> 5 <script type="text/javascript" language="javascript"> 6 7 function changeFrameHeight() { 8 var ifm = document.getElementById("iframepage"); 9 ifm.height = document.documentElement.clientHeight; 10 } 11 window.onresize = function () { 12 changeFrameHeight(); 13 } 14 </script>
