Learn Marquee tag with it's attributes in html

Marquee is one of the important tags introduced in HTML to support scrolling texts and images within a web page. In this tutorial, you will be learning about the Marquee tag and its different attributes for developing a web page.

HTML <marquee> tag

Html <marquee> tag is used to scroll text or image horizontally across or vertically down your web page.

Syntax:

The marquee element comes in pairs. It means means that the tag has opening and closing elements.

<marquee> CS Tutorials Blogs </marquee>

Output:

CS Tutorials Blogs

It has various attributes like direction, behavior, width, height, bgcolor. Let's see all of these one by one with example.

direction attribute:

By default direction of scrolling is left means content will scroll toward left. You can set it's value to left, right, up or down.

<marquee direction="right"> CS Tutorials Blogs - scrolling right </marquee>

Output:

CS Tutorials Blogs - scrolling right

<marquee direction="up"> CS Tutorials Blogs -scrolling up </marquee>

Output:

CS Tutorials Blogs - scrolling up

<marquee direction="down">
CS Tutorials Blogs -scrolling down </marquee>

Output:

CS Tutorials Blogs - scrolling down

bgcolor attribute:

this attribute is used to set the background color of marquee.

<marquee bgcolor="#b4a7d6">
CS Tutorials Blogs - with bgcolor set to light purple </marquee>

Output:

CS Tutorials Blogs - with bgcolor set to light purple

behavior attribute:

you can use this set marquee text movement behavior like scroll, slide and alternate. default value is scroll.

<marquee behavior="Alternate">
CS Tutorials Blogs - behavior set to alternate </marquee>

Output:

CS Tutorials Blogs - behavior set to alternate

scrollamount attribute:

Use this attribute to control the speed of movement. It takes value in milliseconds. 1000 milliseconds are equal to 1 second.

<marquee scrollamount="1">Slow Scrolling</marquee> <marquee scrollamount="12">Little Fast Scrolling</marquee> <marquee scrollamount="20">Fast Scrolling</marquee> <marquee scrollamount="50">Very Fast Scrolling</marquee>

Output:

Slow Scrolling
Little Fast Scrolling
Fast Scrolling
Very Fast Scrolling

For live demo, go though below Youtube video:


Comments

Post a Comment

Popular Posts

How to Import and Export Delimited Files, like CSV, in PowerShell

Image
In this tutorial, we will see how we can use PowerShell to import and export CSV file's data. Managing CSV Files using Import/Export-CSV in PowerShell We have two important cmdlets import-csv/export-csv which are widely used while working with CSV. Before moving to how to manage these type of files, First look at what is CSV file: A Comma Separated Values ( CSV ) file is a plain text file that contains a list of data. These files are often used for exchanging data between different applications. For example, databases and contact managers often support CSV files. A CSV file has a fairly simple structure. It’s a list of data separated by commas as you can see in below screenshot. We have file "email.csv" having email address and name separated by comma. You can use notepad/excel to open thses file. Now lets move back to our main topic, how to manage csv files with PowerShell.  Reading CSV Files with Import-Csv Importing of csv file is pretty straight forward. First move to
Read more

PowerShell Arithmetic Operators

Image
In this tutorial we will see about PowerShell Arithmetic Operators and how PowerShell is dealing with them. Arithmetic operators are used to perform numeric calculations. As well as numeric calculations, the addition operator may also be used with strings, arrays, and hashtables. Multiplication operator may also be used with strings and arrays. Below is the list of PowerShell arithmetic operators. Operator Description Example + Adds numeric values 4 + 6 concatenates a string, arrays, and hash tables “CS” + “Tutorials” – Subtracts numeric values 4 – 2 Makes a number negative -98 * Multiple numeric values 4 * 2 copy string, arrays to the specified number of times “!” * 4 / Divides numeric values 4 / 2 % Gives remainder after division 7 % 3 For live demo, watch below video. I have demonstrated the use of PowerShell arithmetic operators by  creating calculator. Along with operators, Switch statement and While loop also used.  
Read more

How to generate a GUID in PowerShell

Image
 If you ever need a unique id in your script, you can create GUID (globally unique identifier) In PowerShell 4.0 and earlier you can use [guid] class with its static method. In PowerShell 5.0 and later, you can use New-Guid cmdlet: You can use Get-Member to know its object type. You can also store GUID into a variable like below If you want to get GUID as string, use ToString  method or Guid  property. Both return output of string type, you can verify this using Get-Member .
Read more