Demo entry 6256611

123

   

Submitted by anonymous on Oct 15, 2016 at 04:57
Language: HTML. Code size: 4.3 kB.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
		*{
			padding: 0px;;
			margin: 0px;
		}
		@font-face {font-family: 'iconfont';
		    src: url('iconfont.eot'); /* IE9*/
		    src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		    url('iconfont.woff') format('woff'), /* chrome、firefox */
		    url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
		    url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
		}	
		.iconfont{
		    font-family:"iconfont" !important;
		    font-size:16px;font-style:normal;
		    -webkit-font-smoothing: antialiased;
		    -webkit-text-stroke-width: 0.2px;
		    -moz-osx-font-smoothing: grayscale;
		}
		
		.container{
			/*overflow: hidden;
			zoom: 1;*/
			background-color: gray;
			display: -webkit-flex;
			display: flex;
			flex-direction: row;
			justify-content: space-around;
			align-items: center;
		}
			.div1{
				width: 200px;
				height: 200px;
				background: pink;
				float: left;
				flex-basis: 30%;
				
			}
			.div2{
				width: 100px;
				height: 250px;
				background: gold;
				float: left;
				flex-basis: 30%;
				
			}
			/*.container:after{
				display: block;
				clear: both;
				content:""
			}*/
			.div3{
				/*width: 10px;
				height: 10px;
				border-radius: 50%;
				border:1px solid red;*/
				float: left;
			width: 50px;
			height: 50px;
			background: green;
			order:-1;
			/*flex-grow: 1;*/
			flex-basis: 30%;
			
			}
			
			.position{
				background:lightblue;
				position: relative;
			}
			.position div{
				width: 200px;
				height: 200px;
				border:1px solid black;
			}
			.position div:nth-child(1){
				background:yellow;
				position: relative;
				
			}
			.position div:nth-child(2){
				background:darkgreen;
				position: absolute;
				left: 300px;
			}
			.position div:nth-child(3){
				background:gold;
				position: fixed;
				
			}
			.icon{
				display: flex;
				justify-content: space-around;
				align-items: center;
			}
			i:nth-child(1){
				font-size: 40px;
			}
			
		</style>
	</head>
	<body>
		<!--//缩略词,当鼠标移到wo上时,会显示tittle的值-->
		<abbr title="我是完整表述">wo</abbr>
		<acronym title="hello world">HW</acronym>
		<address>
		  <a href="mailto:service@w3school.com.cn">用户服务信箱</a><br />
		  上海赢科投资有限公司<br />
		  金桥开发区 789 号<br />
		</address>
		
		<!--//文本输入方向-->
		<!--<bdo dir="rtl">
			Here is some Hebrew text
		</bdo>-->
		<div class="container">
		<div class="div1">div1</div>
		<div class="div2">
			<div>div2 shdihdsni</div></div>
		<div class="div3"></div>
		<span>z我是span</span>
		</div>
		
		<!--<div class="position">
			<div class="relative"></div>
			<div class="absolute"></div>
			<div class="fixed"></div>
			<div class="test">
				我是测试块
			</div>
		</div>-->
		<div class="icon">
			<i class="icon iconfont">&#xe63e;</i>
			<i class="icon iconfont">&#xe7cf;</i>
			<i class="icon iconfont">&#xe687;</i>
			<i class="icon iconfont">&#xe665;</i>
			<i class="icon iconfont">&#xe666;</i>
		</div>
		<!--<script>
			 function getViewport(){
			    if (document.compatMode == "BackCompat"){
			      return {
			        width: document.body.clientWidth,
			        height: document.body.clientHeight
			      }
			    } else {
			      return {
			        width: document.documentElement.clientWidth,
			        height: document.documentElement.clientHeight
			      }
			    }
			  }
			console.log(getViewport());
			
			 function getPagearea(){
			    if (document.compatMode == "BackCompat"){
			      return {
			        width: Math.max(document.body.scrollWidth,
			                document.body.clientWidth),
			        height: Math.max(document.body.scrollHeight,
			                document.body.clientHeight)
			      }
			    } else {
			      return {
			        width: Math.max(document.documentElement.scrollWidth,
			                document.documentElement.clientWidth),
			        height: Math.max(document.documentElement.scrollHeight,
			                document.documentElement.clientHeight)
			      }
			    }
			  }
			console.log(getPagearea());
		</script>-->
		
	</body>
</html>

This snippet took 0.00 seconds to highlight.

Back to the Entry List or Home.

Delete this entry (admin only).