<!doctype html>

<style>
    div:read-only, span:read-only { background-color: #ccf; }
    div:read-write, span:read-write { background-color: #fcc; }
</style>

<div>Read-only</div>
<div>Read-only <span>Read-only</span></div>
<div>Read-only <span contenteditable="true">Read-write</span></div>
<div contenteditable="true">Read-write <span>Read-write</span></div>
<div contenteditable="true">Read-write <span contenteditable="false">Read-only</span></div>
<div contenteditable="true">Read-write <span contenteditable="false">Read-only <span>Read-only</span</span></div>

<div>Read-only <span contenteditable>Read-write</span></div>
<div>Read-only <span contenteditable>Read-write <span contenteditable="inherit">Read-write</span></span></div>
<div contenteditable>Read-write <span contenteditable="false">Read-only <span contenteditable="inherit">Read-only</span></span></div>