CSS and TWebbrowser delphi

Question

I was wondering if it was possible to manipulate the CSS of websites. For example color in the input fields? I had a look at several questions, but its not clear to me if it is possble at all.

For Example in Google Chrome, Whenever a field is selected it shows a golden line around the outsite. Is it possible to do this and other things in delphi, with any website. Writing CSS code that gets applied to the website opend in Twebbrowser? Just for personal viewing only

Thx

Can I change the color of an input field background with this code as well? I can change background colors and change font size, but cant seem to figure out to color in or border an input field. This is the code:

http://www.delphidabbler.com/tips/58

That's something that Chrome does, and it's not based on CSS. TWebBrowser is based on IE and doesn't highlight fields in the same way. You are relying on the rendering engine to do stuff like this. It's conceivable that one could inject some CSS in via the DOM, but it would be a mammoth task. — David Heffernan, Feb 24 '11 at 16:32
So, if I get it right, you wish to write your own Internet Explorer UI in Delphi (that is, you want to write your own "web browser" using the `TWebBrowser` control)? And then you wish to apply some additional CSS to the pages shown in this, new, browser? Or do you want to alter the behaviour of the real Internet Explorer on your computer? — Andreas Rejbrand, Feb 24 '11 at 16:32
@ Anderas Rejbrand - Yes, just small things like what Chrome does. Or color the field blue. Just to get an idea of how it works. But like you say: apply some additional CSS. — Lakkerw, Feb 24 '11 at 16:36
@ David Heffernan - thx, is it not possible to do such things with CSS though? — Lakkerw, Feb 24 '11 at 16:36
@David Heffernan - yes, but simple things, I am not going to completely abuse a page. for example do the chrome things, or fill in the field with a color. — Lakkerw, Feb 24 '11 at 16:42
@Lakkerw I don't mean to be rude, but since you are still learning and apparently don't understand basic Boolean logic, should you perhaps be trying something simpler? — David Heffernan, Feb 24 '11 at 16:44
@David Heffernan - I am learning, and the only way that is best, is by trying. Thats what I'm doing... — Lakkerw, Feb 24 '11 at 16:47
@Lakkerw This will be too hard for you. CSS is hard. CSS of other people's website is very hard. DOM is hard. DOM via IHTMLDocumentX is very hard. I'm not being mean, it's just that this is not the way to learn. I wouldn't attempt this on the grounds that it would probably be too hard for me to do well. I'm honestly trying to encourage you and pass on some of my hard-earned experience (sounds arrogant but there you go!) — David Heffernan, Feb 24 '11 at 16:52
@Lakkerw: I think it is more efficient to learn by yourself, and only ask questions when you really, really are stuck with something. And, as David said, you should start with simple things, not advanced things. You need to learn the basics first. — Andreas Rejbrand, Feb 24 '11 at 16:53
@ Andreas Rejbrand, David Heffernan - thx, I added some code if still interested. — Lakkerw, Feb 24 '11 at 17:34
Congratulations, you appear to have mastered the clipboard: http://www.delphidabbler.com/tips/58 — David Heffernan, Feb 24 '11 at 17:38
Hint: on Stackoverflow you can post the code as an answer to your own question, and also choose it as the accepted answer — mjn, Feb 24 '11 at 17:47
@Lakkerw - look at the amount of comments. There are several Delphi programmers (with good SO reputation) telling you to slow down. You should listen. — Leonardo Herrera, Feb 24 '11 at 18:26
Can't be that difficult, I seem to understand the code on that site pretty well. I just can't figure out how to change the color of an input field or the text color in it. — Lakkerw, Feb 24 '11 at 18:40
No I do not, but ive done some searches on it. seems more difficult than the code from that site. Is it not possible with similar code from that site. to change the color of the input field? — Lakkerw, Feb 24 '11 at 18:56
@Lakkerw That code uses the DOM. You need to know about it to do this. — David Heffernan, Feb 24 '11 at 19:19
I'll start having a closer look at DOM then. Thank you David — Lakkerw, Feb 25 '11 at 15:44

score 6 · Answer 1 · answered Feb 24 '11 at 16:35

6

It is possible to modify CSS by adding a stylesheet from code, after the page is loaded:

var
   document: IHTMLDocument2;
   stylesheet: IHTMLStyleSheet;
   stylesheetIndex: Integer;
begin

   // Inject CSS Style Sheets
   document := webBrowser1.Document as IHTMLDocument2;

   stylesheetIndex := document.styleSheets.length;
   if stylesheetIndex > 31 then
      raise Exception.Create('Already have the maximum amount of CSS stylesheets');

   stylesheet := document.createStyleSheet('', stylesheetIndex);
   stylesheet.cssText := ...

answered Feb 24 '11 at 16:35

jasonpenny

2,999
1
24
23

Hi, im sorry I'm not sure if i understand correctly. BUt at stylesheet.csstext:= from there on you can fill in the css code that is prefered? – Lakkerw Feb 25 '11 at 15:43
Yes, if you load google.com and then set cssText to `'body { background-color: black }';` you should see a black background – jasonpenny Feb 26 '11 at 05:23

score -1 · Answer 2 · answered Feb 24 '11 at 18:56

Using @jasonpenny's answer to add a stylesheet, what you need next to change the border around the input element that has focus, is what in CSS is called the focus pseudo class or selector. For more information see these articles:

The http://www.w3schools.com site has a wealth of information on web development. It also allows you to play with many examples so you can see what the effects would be when you change things. If you are trying to learn how to do css styling you might be better of getting to grips with all the information there, instead of trying to learn programming and a programming language at the same time.

CSS and TWebbrowser delphi

2 Answers2

Linked