Let's cut to the chase, we are talking about mark-up languages and how they are displayed in a browser.
HTML is data coupled with the instructions on how to display the data. Other technologies such as CSS and Javascript, can be used to make changes to the document after it is rendered in a browser.
XML is primarily data, generally without instructions on how to display the data. XSLTs, etc can be used in conjunction with the XML to display that data in a chosen format.
ODT is XML, but by extension, as well as properties, can be transformed from text and binary resources into a graphical display, much like a HTML document is rendered in a browser.
As with anything in CS, there will be exceptions, such as an API that or some other tool that can make changes that were not envisioned by the authors of the specifications.
Browsers are designed to take HTML (text), based on the extension type, and turn that into a graphical display of those text and binary resources.
Most browsers are designed to take XML, also based on the extension type, and display a hierarchical tree of the data. That is where transformations such as XSLTs come in, they are designed to take data in a specific format, and then transform the data into something else; HTML, text, more XML, etc.
XML is primarily concerned with storing the data, by design there aren't any instructions embedded in XML that define how the data should be displayed. Custom XML schemas sometimes throw this idea right out the window and mix XML with custom elements and attributes in order to create their own markup language variant, for their own custom interpreter, such is the case with ODT and other open document types.
Since ODT is also XML, based on the extension a browser could process the data using a specific set of instructions.
Check out these links for more information on the HTML and XML specifications:
Link to HTML 5 Specification at W3C
Link to the XML Specification at W3C