3

I use Delphi 2010 . I am using twebbrowser to load up HTML source and view it. Now I want to click on an area (background, links, etc) in the web browser and get the styling in the CSS file that styles the HTML.

For example: I click on the H3 region and I want to be taken to the h3{ color: white; } in the CSS. Any help at all is much appreciated; this is hard for me to figure out.

Improve this question
2
  • Welcome to Stack Overflow. Have you identified the distinct steps you'll need to do for this supposed "editing" feature? (For instance, do you know how to recognize "the H3 region"? Can you detect clicks there? Do you have a list of all the CSS rules for the document? Do you know how to find out which ones apply to a given region that got clicked on?) Which part are you having trouble with? Asking a more specific question (or actually any question at all, in this case) will get you better answers. Just requesting "any help at all" isn't really the sort of thing Stack Overflow is designed for. Commented Mar 17, 2010 at 5:29
  • 1
    If the only thing you are interested in is viewing the property of html-elements, I suggest you install Firefox with the Web Developer addon. You can then view the corresponding CSS information with View Style information (Ctrl+Shift+Y) Commented Mar 17, 2010 at 9:35

1 Answer 1

Reset to default
2

You will have to handle the parsing of the source yourself to make this work. Because the CSS entry can be in another file or even files, this can be tricky. I would start by looking at the DIHtmlParser component which can help greatly here. You will have to parse the main document, and each identified CSS file to locate the proper file/position to jump too. I would also look at tEmbeddedWB as an alternative over TWebBrowser as it supplies much more control over the embedded browser as well as TRichEditWB which works well for viewing syntax highlighted HTML source.

Edit: You still have to parse the CSS and HTML to build an index of each tag and its CSS location. When your editing the HTML, you have to parse the tag your cursor is currently on or in, compare that to the index you parsed earlier, to display the CSS attributes in effect. Keep in mind that CSS cascades and nests, so your index will most likely be a tree, and your tag will be relative in that tree.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Thanks for your comments. I have looked at DlHtmlParser, and I have tEmbeddedWB, and TRichEditWb. But I can not come up with a solution for what I am trying to do.
I am haveing the most trouble with finding out were you click (h3,Body,etc) in the twebbrowser. Does anyone know how to do this. Thanks
I myself am using the DIHtmlParser and absolutely love it. Unfortunately for the specific scenario of clicking in the web browser and identifying what was clicked, I cannot be of any help.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.