Lapson Wong Lapson Wong - 4 months ago 4x
jQuery Question

How to avoid HTML element being matched by CSS and reset it?

I am newbie in HTML and CSS. Below is the code for testing. Assume the html link to external CSS as shown below:

ul {
overflow: hidden; color: #fff; padding: 0;

li{ margin-left: -10px; }

My HTML file is shown as below:

<!DOCTYPE html>
<link rel="stylesheet" type="text/css" href="mystyle.css">


<li>I want to reset this style</li>
<li>I want to reset this style</li>
<li>I want to reset this style</li>


Assume that I don't have access to to the CSS file, I want to reset the style of the second unorder list in HTML. I don't know the content of CSS. How can I do it inline HTML, CSS or by jquery? Any code example would be highly appreciated. Thank you.


If you have zero access to the css, then you won't (necessarily) know which properties to reset.

That said, you can always use inline styles like this:

  <li style="color: green; background: #eee;">Green one</li>

Basically any HTML element can have a style attribute, and regular CSS goes in there.

UPDATE: If you can add your own tags to the source, you could add resets in there as well.

  ul + ul li {
    /* resets in here */