[問題] 防止動態產生之 HTML 元素之樣式被覆蓋

作者: danny0838 (道可道非常道)   2014-11-30 10:20:26
如題,設計 bookmarklet 或 browser extension 時,
往往會有些透過 javascript 在目前瀏覽的網頁上建立 HTML 元素,
比如我要設計一個書籤小工具,點擊即建立一個控制選單,
大概通常會產生 div, table, tr, td, p, span, strong, code
但這些元素的樣式可能被目前網頁的 CSS 覆寫,
如有奇葩的 CSS 宣告,比如 span { display: block; } 之類的,
這些動態產生的元素的樣式往往會被覆寫,造成難以預期的排版破壞。
實務上有哪些好方法能把這些動態產生的 HTML 固定為想要的樣式,而不被覆蓋呢?
我知道可以把所有可能的 CSS 樣式值全部寫進 inline style,
不過這實在是太冗長、太麻煩了orz
作者: oToToT (屁孩)   2014-11-30 10:22:00
加個!important
作者: mmis1000 (秋月戀楓)   2014-12-01 00:40:00
用 Contextual css reset,只reset目標區塊

Links booklink

Contact Us: admin [ a t ] ucptt.com