html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!-- By Salah Eddine -->
<!-- 13/01/2018 -->
<!DOCTYPE html>
<html>
<head>
<title>marquee with CSS</title>
</head>
<body>
<!-- Simple Marquee Right (ltr) -->
<div class="header">Simple Marquee Right (ltr)</div>
<div>
<span class="span1">TEXT</span>
</div>
<!-- Simple Marquee Left (rtl) -->
<div class="header">Simple Marquee Left (rtl)</div>
<div>
<span class="span2">TEXT</span>
</div>
<!-- Simple Marquee Up (btt) -->
<div class="header">Simple Marquee Up (btt)</div>
<div class="ctr">
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
/*Global Style
***********************/
*{
padding:0;
margin:0;
}
body{
background: hsl(0,0%,95%);
}
/*Header Style
***********************/
.header{
background-color: hsl(0,90%,60%);
text-align:center;
margin:10px auto;
width:200px;
padding:4px;
border-radius:5px;
font-weight:bold;
color: hsl(0,90%,10%);
}
/*Container Style
***********************/
div:not(.header){
width:100vw;
height:10vh;
Enter to Rename, Shift+Enter to Preview
js
js
1
//no js
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run