Question

My html page is something like…

<a href="#" id="play_1">play1</a>
<a href="#" id="play_2">play2</a>
<a href="#" id="play_1">play3</a>
<a href="#" id="play_2">play4</a>
<a href="#" id="file_1">file1</a>
<a href="#" id="file_2">file2</a>

I want to define CSS common for play_”#” and file_”#”. How can i define CSS?

Answer 1

Add a class to the tags

<a href="#" class="play" id="play_1">play1</a>
<a href="#" class="play" id="play_2">play2</a>
<a href="#" class="play" id="play_1">play3</a> <!-- double ID -->
<a href="#" class="play" id="play_2">play4</a> <!-- double ID -->
<a href="#" class="file" id="file_1">file1</a>
<a href="#" class="file" id="file_2">file2</a>

Because you have double id’s, either remove the ID’s at all or make them unique

<a href="#" class="play" id="play_1">play1</a>
<a href="#" class="play" id="play_2">play2</a>
<a href="#" class="play" id="play_3">play3</a> 
<a href="#" class="play" id="play_4">play4</a>
<a href="#" class="file" id="file_1">file1</a>
<a href="#" class="file" id="file_2">file2</a>

In css use

.play {
  /* add your common play styles here */
}
.file {
  /* add your common file styles here */
}