Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
353 views
in Technique[技术] by (71.8m points)

html - How Can I Override Style Info from a CSS Class in the Body of a Page?

So I'm working on a project that accepts HTMLs as inputs and returns them as outputs. All of the HTMLs I get as inputs have all of their text in divs and style sheets that dictate the style for each div based on the class attribute.

To better visualize things, and to see how my project is coming along, I would love to output the input HTMLs color coded to specifications I give them. It's really easy for me to modify the body of the HTML, but difficult to deal with the style sheet. All I'm looking for is something simple to override the color property of the style sheet. It can be hacky, as this is just internal code for temporary use. I just want something simple that works. Is there an easy way to override aspects of CSS classes in the body of a file?

[EDIT] I want to provide an example to better explain what I'm looking for. An example of the style sheets I have at the top of my page (that I want to override) is:

.style21{vertical-align:top;font-size:13px;font-family:Helvetica;color:#000000;}

An example of a div whose color I'd like to change is:

<div style="position:absolute;top:432;left:422;color:#ff0000;"><span class="style21">relating to</span></div>

My problem is that I can't override the color specified in the css. As you can see in the above example, I'm trying to do it in the specific style within the div, but that isn't working. [/EDIT]

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Either use the style attribute to add CSS inline on your divs, e.g.:

<div style="color:red"> ... </div>

... or create your own style sheet and reference it after the existing stylesheet then your style sheet should take precedence.

... or add a <style> element in the <head> of your HTML with the CSS you need, this will take precedence over an external style sheet.

You can also add !important after your style values to override other styles on the same element.

Update

Use one of my suggestions above and target the span of class style21, rather than the containing div. The style you are applying on the containing div will not be inherited by the span as it's color is set in the style sheet.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...