Bootstrap Snippet OUGC-Announcement Bars using HTML 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
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
    <div class="row">
    <center>
        <br />
        <div class="ougc_annbars_black"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_white"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_red"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_blue"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_green"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_brown"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_pink"><strong>Lorem İmpsum!</strong></div>
        <br />
        <div class="ougc_annbars_orange"><strong>Lorem İmpsum!</strong></div>
       <br />     
       </center>
    </div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

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
29
30
31
32
33
34
35
36
37
.ougc_annbars_black {
    border:1px solid #000000;
    background: #393939;
    background: -moz-linear-gradient(top, #393939 0%, #000000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#393939), color-stop(100%,#000000));
    background: -webkit-linear-gradient(top, #393939 0%,#000000 100%);
    background: -o-linear-gradient(top, #393939 0%,#000000 100%);
    background: -ms-linear-gradient(top, #393939 0%,#000000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#393939', endColorstr='#000000',GradientType=0 );
    background: linear-gradient(top, #393939 0%,#000000 100%);
    color: white;
    width: 100%;
}
.ougc_annbars_white {
    color:#000;
    border:1px solid #eeeeee;
    background: #fcfcfc;
    background: -moz-linear-gradient(top, #fcfcfc 0%, #eeeeee 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#eeeeee));
    background: -webkit-linear-gradient(top, #fcfcfc 0%,#eeeeee 100%);
    background: -o-linear-gradient(top, #fcfcfc 0%,#eeeeee 100%);
    background: -ms-linear-gradient(top, #fcfcfc 0%,#eeeeee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#eeeeee',GradientType=0 );
    background: linear-gradient(top, #fcfcfc 0%,#eeeeee 100%);
    width: 100%;
}
.ougc_annbars_red {
    border:1px solid #ff2929;
    background: #ff3d3d;
    background: -moz-linear-gradient(top, #ff3d3d 0%, #ff2929 100%);
    background: -webk
    border:1px solid #b00 !important;it-gradient(linear, left top, left bottom, color-stop(0%,#ff3d3d), color-stop(100%,#ff2929));
    background: -webkit-linear-gradient(top, #ff3d3d 0%,#ff2929 100%);
    background: -o-linear-gradient(top, #ff3d3d 0%,#ff2929 100%);
    background: -ms-linear-gradient(top, #ff3d3d 0%,#ff2929 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3d3d', endColorstr='#ff2929',GradientType=0 );
    background: linear-gradient(top, #ff3d3d 0%,#ff2929 100%);
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"OUGC-Announcement Bars"
Bootstrap 3.3.0 Snippet by wm06

Related: See More

Questions / Comments:

"OUGC-Announcement Bars" Bootstrap 3.3.0 Snippet by wm06

Related: See More

Questions / Comments:

"OUGC-Announcement Bars"
Bootstrap 3.3.0 Snippet by wm06