body {
	text-align: center;
}

.container {
	width: 400px;
	height: 300px;
	overflow: hidden;
	border: thin solid black; 
	display:inline-block;
}

.photo {
	width: 1200px;	/* 一张图片400px，共三张 */
/*****************************************/
	animation: switch 8s ease-out infinite;
/*****************************************/
}

.photo>img {
	float: left;
	width: 400px;
	height: 300px;
}

@keyframes switch {
	0%, 20% {
		margin-left: 0;
	}
	27%, 47% {
		margin-left: -400px;
	}
	54%, 74% {
		margin-left: -800px;
	}
	80%, 100% {
		margin-left: 0px;
	}
}