Спрятать движущийся текст в CSS

Coriolis · January 20, 2015

Есть движущийся текст, двигается из стороны в сторону в коробке, требуется сделать, чтобы текст не было видно, когда он выходит за пределы коробки:

HTML файл:

<html>	<head>		<title>123</title>		<link rel="stylesheet" href="css.css">	</head>		<body>		<div id="banner">				<h1>Акция!<br> 3 по цене 2!</h1>		</div>	</body>	</html>

CSS:

div#banner{	border: 10px solid orange;	border-radius:10px;	width:500px;	height: 300px;	margin: auto;	background-color: brown;} h1{	font-size: 50px;	font-family: Comic Sans MS;	vertical-align: middle;	-webkit-animation: ani 1s infinite alternate;	animation: ani 1s infinite alternate;	white-space: nowrap;}@-webkit-keyframes ani{	from {text-shadow: 0 0 7px rgba(90, 200, 200, 0.7); ; }	to {text-shadow: 0 0 7px rgba(200, 150, 90, 0.7); margin-left: 550px;}}@keyframes ani{	from {text-shadow: 0 0 7px rgba(90, 200, 200, 0.7); ;}	to {text-shadow: 0 0 7px rgba(200, 150, 90, 0.7); margin-left: 550px;}}

raptor-dm · January 21, 2015

Коробке overflow:hidden;

Sign In

Спрятать движущийся текст в CSS

Question

Coriolis

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

raptor-dm

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information