The only reason I use Dreamweaver is the split window, so I can code HTML and see the effect in another window, and it can show the position of HTML element in the preview window. Is there any IDE has the same function?
Seeing the final version in an actual browser is best - the display mode in any IDE is not going to exactly match the way the page will look in a web browser.
Simply open both your chosen IDE and preferred web browser at the same time and use the window key with the left and right arrows so they both have half a screen each. Then after saving your changes in the IDE press the refresh button in the browser to see how the change really looks.
felgall, thanks for the tips!!! I will use it!!
Another question is in dreamweaver, when I click, say, a header element in HTML, dreamweaver can pinpoint this element in its split preview window. I feel this is very nice coz it can immediately ‘link’ the HTML code and what shows in the browser. Is there an alternative to this?
You can do that with the browser itself. Via the dev tools (right click on an element and choose Inspect Element or similar) you can view the element’s code and the where it appears on the page at once, and you can also see the CSS that applies to that element.
ralph.m, thanks for the advice! I just tried again in Chrome and Firefox, it’s good! I can also see the some additional HTML that Bootstrap adds to the page this way! Is there any good tutorials to Chrome or Firefox DevTools?
Well, I just got the feeling that i might say good-bye to dreamweaver forever, especially when I can fully harness the power of Chrome or Firefox dev tools.
Any good IDEs you could recommend? I also use PHP, JS to develop web sites. Currently I have Netbeans installed when I code PHP and JS.
I’ve been using eclipse with the plugins PHP Development Tools (PDT) (for PHP) and [URL=“http://www.aptana.com/”]Aptana (for CSS, HTML, and JS).