htmlcodeeditor.com Open in urlscan Pro
2a06:98c1:3121::3  Public Scan

Form analysis
1 forms found in the DOM

Name: szettingform —

<form name="szettingform">
  <div> Paragraphs: <select name="hanyparagrafuslegyen">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="5" selected="selected">5</option>
      <option value="10">10</option>
      <option value="15">15</option>
      <option value="20">20</option>
    </select>
  </div>
  <div> Populate: <select name="mitpupulaljon">
      <option value="1" selected="selected">the editor</option>
      <option value="2">below</option>
    </select>
  </div>
</form>

Text Content

WE VALUE YOUR PRIVACY

We and our partners store and/or access information on a device, such as cookies
and process personal data, such as unique identifiers and standard information
sent by a device for personalised ads and content, ad and content measurement,
and audience insights, as well as to develop and improve products. With your
permission we and our partners may use precise geolocation data and
identification through device scanning. You may click to consent to our and our
partners’ processing as described above. Alternatively you may click to refuse
to consent or access more detailed information and change your preferences
before consenting. Please note that some processing of your personal data may
not require your consent, but you have a right to object to such processing.
Your preferences will apply to this website only. You can change your
preferences at any time by returning to this site or visit our privacy policy.
MORE OPTIONSDISAGREEAGREE
HTML Code Editor
OK

 


 * HTML CODE EDITOR

 * Demo

 
 * h1
 * h2
 * h3
 * ¶p
 * b
 * i
 * u
 * span
 * link
 * img
 * ul
 * li
 * 

 
1

<!-- This is a comment in the source -->

2

<h3>Welcome to the free online <span style="background-color: #914c53; color: #ffffff; padding: 0 3px;">HTML Code Editor</span></h3>

3

<p><strong>Compose the content in the source editor on the left and see the preview changing instantly on the right as you're typing.</strong></p>

4

<p>Use the bar above the editor to create new HTML elements. Explore the cleaning features, the tag wizard and many other integrated fratures that make web code composing really easy <img src="https://htmlcodeeditor.com/images/smiley.png" alt="smiley" /></p>

5

​






Clean

compress
- aaa +


Length: 580
Preview


Try the PRO HTML Editor!
Tag Wizard

Create iframe
URL:

Width:
% px
Height:
% px
Scrolling:
Hidden Show
Border:
Yes No
CancelAdd iframe
Create table
Columns:

Rows:

Border:

Border Collapse:
Not specified Collapse
Width:
% px
Cellpadding:

CancelAdd table
Create link
URL:

Text:

Title:

Target:
None New tab
CancelAdd link
Create span
Text:

Bold:
Yes No
CancelAdd span
Create image
Source:

Description:

Style:

Width:
% px
Height:
% px
Float:
None Left Right
CancelAdd image
Create form

TO INCLUDE IN THE FORM:

Form attributes
Fieldset
Label
Input
Radio buttons
Textarea
Checkbox
Button
CancelAdd form
Create list
List type:
Unordered list Ordered list Description list
Unordered:
disc circle square none
Ordered:
1. 2. 3. A. B. C. a. b. c. I. II. III. i. ii. iii.
CancelAdd list
 
Replace tag
<w xy="#">ab</w>
Delete
<w xy="#">ab</w>
Delete tags
<w xy="#">ab</w>
Delete attributes
<w xy="#">ab</w>
 
iframe





 
table






a (link)





 
span





 
image





 
form





 
ul, ol (list)






 
 
 
 
 
Share / Like
Tell your friends about this free tool!
Cleaning Options

Inline styles

Classes & IDs

Empty tags

Tags with one &nbsp;

Successive &nbsp;s

Comments

Tag attributes

All tags

Find - Replace

Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles
Find:
Replace with:
EverywhereContentTag attributesClass or IDStyles


Replace

Pick a Color
Mixer



Gibberish Text Generator

Paragraphs: 1 2 5 10 15 20
Populate: the editor below
Generate



INSTANT HTML CODE EDITOR

Free online HTML code editor with instant live preview. Enter your code in the
editor and see the preview changing as you type. Compose your documents easily
without installing any program.

There is another online HTML editor which is using a WYSIWYG visual editor
linked to the source editor but we found it necessary to create a separate
composer where the TinyMCE is not overwriting the errors and gives more freedom
and control. That particular editor corrects our code every time when considers
something an error, even if we didn't want that. Now we can use non-standard
tags and attributes, ASP.NET tags and more.


HOW TO USE THE HTML CODE EDITOR?

You will see the source editor pre-populated with a demo text when you load the
website for the very first time, letting you experiment with the tool. Load this
text any time you want using the allocated menu option. To open a new tag use
the list above the text area. Close the opened tags clicking the close button on
the very right side of the top section. This will close the items one by one in
reverse opening order.

The main HTML composing area is using syntax highlighting to make the markup
language tags easily distinguishable and more readable. The amount of characters
is displayed along with the main control buttons: undo, new page, font-size
adjuster, compressor and the main HTML Cleaning button which executes all
checked cleaning options.

The preview area is located on the right side of the source editor and the
changes are reflected here instantly to make HTML composing more human friendly.
This section is using the Bootstrap CSS, which allows you to use the styles of
the most popular front-end framework.

Scrolling further down you can find many useful integrated tools. Use the tag
wizard to perform bulk operations on the code. Following the first tag name list
column there are additional options to create new tags, replace them, delete
them completely with their content, remove only the tags, delete the tag
attributes of certain tags and it's possible to convert tables and lists to
structured div elements. Besides the predefined iframe, table, link, span,
image, form and list tags you can define and manipulate further tags entering
them in the input fields. Every tag wizard action can be executed individually
with the little play buttons or they can be set active checking the grey dots
and apply them all together with the main button in the top-right corner of the
window.

The most basic HTML Cleaning features are available and can be applied one by
one or all active options at the same time. Clear out inline styles, unwanted
classes and ids, empty tags, tags containing only one non-breaking space,
successive spaces, comments. You can also get rid of all tag attributes (except
the src of images and href of anchor tags) or remove every tags with one mouse
click, making the document a plain text.

The replace tool can look and interchange text bits in the whole document, the
content, the tag attributes, the styles or in the classes/ids. This doesn't
support regular expressions.

The color picker is another important feature of the HTML code editor which lets
us easily select the desired color and save them for later use. The most common
code snippets can easily be copy-pasted in the editor.

The gibberish text generator populates the editor or the allocated area on the
page with some basic Lorem Ipsum paragraphs.


USEFUL TIPS

Keep a backup of the content and always save the work progress.
Make sure you validate the HTML codebefore publishing to avoid errors.
Read about all the bad HTML practices here.

Use the CSS below to style the divs converted from tables: .rTable { display:
table; width: 100%;} .rTableRow { display: table-row; } .rTableHeading {
background-color: #ddd; display: table-header-group; } .rTableCell, .rTableHead
{ display: table-cell; padding: 3px 10px; border: 1px solid #999999; }
.rTableHeading { display: table-header-group; background-color: #ddd;
font-weight: bold; } .rTableBody { display: table-row-group; } .rTableFoot {
display: table-footer-group; font-weight: bold; background-color: #ddd; }


BACK TO THE TOP OF THE PAGE ⇑


SPONSORS







This website is using cookies to collect visitor statistics. Please leave the
website if you disagree.
Privacy Policy, Terms & Conditions   


© HTML Code Editor