We can wrap text in ==text== to highlight it.
I’m trying to make a CSS snippet that can highlight an image ====
This css snippet only selects text element
.cm-s-obsidian span.cm-formatting-highlight, .cm-s-obsidian span.cm-highlight {
background-color: transparent;
color: #DA70D6;
}
It seems like you’re working in live-preview, and with the code you’ve listed there the code mirror engine simply removes the highlighting around the image, so it doesn’t look like you’re able to highlight an image at all using this syntax. (That is beside something with a .cm-line having an <img> within, and I don’t think that’s unique enough for reliable CSS selection)
In reading view, the highlight elements are kept, as you then get a <mark><img ... ></mark> layout, so there you should be able to do some CSS styling to it.
To get something similar in live-preview, I’m not sure what you need to.
thank you, this css works in reading mode but I need one for live preview more
.markdown-preview-view mark img {
box-shadow: 20px 20px yellow;
}
Try:
:is(.markdown-preview-view, .markdown-source-view .cm-editor .cm-scroller) img {
box-shadow: 20px 20px yellow;
}
for both live preview and reading modes. You don’t want the mark in there, that’s for text.
Doesn’t that highlight every image?
Good catch holroy! Thanks. This should work. 
Add |highlight to any image you want highlighted.
![[oops.png|highlight|200]]
:is(.markdown-preview-view, .markdown-source-view .cm-editor .cm-scroller) img[alt*="highlight"] {
box-shadow: 20px 20px yellow;
}
The “|highlight” works but I want to use the same syntax as ==text== to make use of plugins for extracting highlights
Use both?
====
Wow, why didn’t I think of this! But how can I make a shortcut to toggle highlight?
Would using this work? GitHub - manic/obsidian-wrap-with-shortcuts: Wrap selected text in custom tags with shortcuts.
I often have an embedded link already so this doesn’t work. And I don’t think this can remove the highlight.
May I ask the meaning of the css class “.cm-scroller” and “.cm-editor”?
They are both for targeting editing mode as far as I know.
This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
