In this section:
- Creating an HTML file
- Generating references in an HTML file
- Previewing output of an HTML file in a browser
- Viewing HTML source code of a web page in the editor
- Viewing embedded images
- Extracting an include file
PhpStorm brings powerful support for HTML that includes syntax and error highlighting, formatting according to the code style, structure validation, code completion, and much more .
Creating an HTML file
Generating references in an HTML file
PhpStorm can generate
<img> tags inside
Previewing output of an HTML file in a browser
You can preview a file with Web contents in the PhpStorm default browser or in the one of your choice.
To open the page preview in a browser of your choice
Open the file in the editor, choose on the main menu, and select the desired browser from the pop-up menu. Alternatively, hover your mouse pointer over the code to show the browser icons bar, and click the icon that indicates the desired browser:
Viewing HTML source code of a web page in the editor
- Choose .
- In the Open URL dialog box that opens, type the URL address of the web page or choose a previously opened URL from the list.
Viewing embedded images
- Select the image file in the Project tool window, and choose on the context menu of the selection or press F4.
- In the editor, place the cursor at the reference to the image, and choose on the context menu or press Ctrl+B
- Configure the path to the external editor on the Images page ( for Windows and Linux or for macOS).
- Select the image file in the Project tool window, and choose or press Ctrl+Alt+F4.
Extracting an include file
<script> tags can also be extracted.
- In the editor, select the code block to be extracted and choose on the main menu or on the context menu of the selection.
- In the Extract Include File dialog box that opens, specify the name of the target include file in the Name for extracted include file text box.
- In the Extract to directory text box, specify the directory to store the include file in. Leave the predefined directory or choose another one.
- Click OK, when ready. PhpStorm extracts the selected source code into the specified file in the target directory and generates the corresponding reference in the source file.