CSS 파일에 포함 된 이미지를 보는 방법

CSS 파일에서이 배경 이미지를 보았습니다.CSS 파일에 포함 된 이미지를 보는 방법

어떻게 볼 수 있습니까?

background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFIAAAB3CAYAAACQTRce 
AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgR 
mlyZXdvcmtzIENTNXG14zYAAAmZSURBVHic7Zt/bB... BIG SNIP ...V3JGCkIKVIQUqQgpEhBSJGCk 
CIFIUUKQubZCELm2QhC5tkIQubZCELm2QhC5tkIQubZCELm2QhC5tkIQubZFEno2LWC+6Jkno0g5HdtQU 
iRgpAiBSFFCkKKFIQUKQiV3FYMycK4oysVeOVuBSQOF8i5KojcjC8IGSMFIUUKQooUhBQpCClSEFKkIKR 
IQUiRgpAiBfFfWn5d1Y2PJI0AAAAASUVORK5CYII=)

나는 파일에 "iVBOR..." 및 "5CYII=" 사이에 모든 것을 붙여 시도하고 image.png 이름을 변경 - 그러나 그것은 작동하지 않았다.

출처

2011-05-14 jeph perro

"data: ..."부터 =까지의 모든 내용을 Firefox 주소 표시 줄에 붙여 넣으면 그려줍니다. 당신의 HTML에이 같은

또는 넣어 뭔가 : 그것은베이스 64로 인코딩 된 때문에

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

출처

2011-05-14 00:28:29

Firefox가 데이터 uri를 렌더링한다는 것을 몰랐습니다. 이것은 현대적인 브라우저의 표준 기능입니까? –

파이어 폭스에 붙여 주셔서 감사합니다. 그것은 깔끔한 트릭입니다. –

@Nathan : 확실하지 않습니다. 나의 초기 추측은 그렇다. 현대의 브라우저는 이러한 인코딩 된 데이터 스트림을 어느 정도 처리해야한다. –

-2

파일 이름이 php base64로 암호화되어 있으므로 해독하기가 어려울 것입니다. 행운을 빈다.

출처

2011-05-14 00:24:26 Version1

죄송하지만 이름은 이미지는 암호화되지 않고 base-64는 PHP 기술이 아니며 base64 인코딩은 "해독"(디코딩)하기가 어렵지 않습니다. –

Base-64는 암호화가 아니므로 해독이 쉽습니다. http://base64.sourceforge.net/ –

PNG 데이터는 텍스트로 표현하기 위해 base64를 사용하여 인코딩됩니다. 파일로 저장하기 전에 base64를 디코딩해야합니다. 그러나, 단순히 브라우저에서이 문제를 보는 데 필요한 HTML 코드는 사소한해야

<html> 
<head> 
<style> 
    div { 
     background: ... 
    } 
</style> 
</head> 
<body> 
<div></div> 
</body> 
</html>

당신은 div의 크기를 조정할 수 있습니다.

출처

2011-05-14 00:25:44

더 나은 방법은 jsfiddle.net입니다. –

PNG 파일로 데이터를 복사가 작동하지 않습니다. 두 가지 가능성이 있습니다.

데이터를 디코딩하고 파일에 저장하십시오.
해당 CSS 스타일을 사용하는 <div>으로 HTML 페이지를 만든 다음 브라우저에서 해당 페이지를 엽니 다.

출처

2011-05-14 00:28:34

-1

(함수() {window.latencyTrackerTimes = {clientSideStartMs : Date.now()}})() (함수() {함수 _DumpException (b) {window.console.error (b. }}, 함수 aa (b, d) {var a = [ "LOWLIFE_wizbind"], c = d || f; (var e; a.length & & (e = a.shift());)에 대해 a [0]은 c ||! c.execScript || c.execScript ("var"+ a [0] .length || void 0 === b? c [e]? c = c [e] : c = c [e] = {} : c [e] = b}; 함수 ba (b, d) {if (b = compareDocumentPosition)가 b == d ||를 리턴하면, b.contains (d)가 리턴된다. ! (b.compareDocumentPosition (d) & 16); for (; d & &b! = d;) 함수 a (a) {a || (a = window.event); return d.call (b (d, d)) 함수를 반환합니다. (b = b.parentNode); return b} var C = "undefined"{{{{{}}}}}} 함수 y (b) {b = b.target || b.srcElement;! b.getAttribute & & b.parentNode & & ! = 대해서 typeof 네비게이터 & & /Macintosh/.test(navigator.userAgent),da="undefined"!=typeof 네비게이터 & &! /Opera/.test (navigator.userAgent) & & /WebKit/.test(navigator.userAgent), Ea = {A : 1, INPUT : 1, TEXTAREA : 1, SELECT : 1, BUTTON : 1}, 함수 fa() {this._mouseEventsPrevented =! 0} var E = {A : 13, BUTTON : 0 , CHECKBOX : 32, COMBOBOX : 13, GRIDCELL : 13, LINK : 13, LISTBOX : 13, MENU : 0, MENUBAR : 0, MENUITEM : 0, MENUITEMCHECKBOX : 0, MENUITEMRADIO : 0, OPTION : 0, RADIO : 32, RADIOG ROUT : 32, RESET : 0, SUBMIT : 0, TAB : 0, TREE : 13, TREEITEM : 13}; 함수 F (b) {return (b.getAttribute ("type") || b.tagName) .toUpperCase () 함수 G (b) {return (b.getAttribute ("type") || b.tagName)를 호출합니다.0, DATETIME :! 0, "DATETIME-LOCAL", "DATETIME-LOCAL", DATETIME : 0, DATETIME : : 0, EMAIL :! 0, MONTH : 0, NUMBER :! 0, PASSWORD :! 0, RANGE :! 0, SEARCH :! 0, TEL :! 0, TEXT :! 0, TEXTAREA :! 0, TIME : 0, URL :! 0, WEEK :! 0}, ia = {A :! 0, AREA :! 0, BUTTON :! 0, DIALOG :! 0, IMG :! 0, INPUT :! 0, LINK : ! 0, OPTGROUP :! 0, OPTION :! 0, PROGRESS :! 0, SELECT :! 0, TEXTAREA :! 0}; function H() {this.j = []; this.a = []; this.i = {}; this.b = null; this.f = []} var ja = "undefined"! = 네비게이터 유형 & &/iPhone | iPad | iPod /. test (navigator.userAgent), I = String.prototype.trim? function (b) {return b.trim()} : 함수 (b) {return b.replace (/^\ s + /, ""). replace (a) {var c; var e = d, n; if ("d, 클릭 "== e & & (C & & a.metaKey ||! C & & a.ctrlKey || 2 == a.which || null == a.which & & 4 == a.button || a.shiftKey)) e = "clickmod"; else {var h; h = a. 이는 || a.keyCode || a.key; DA & & == 3의 H & & (H = 13)의 경우 (! 13 H = & & (32) = H) (H) = 1;! 다른 {var에 L = (g = "keydown"! = a.type) || (y.a); n = (l.getAttribute ("role") || l.type || l.tagName) .toUpperCase(); var g; ("COMBOBOX"! = g || "INPUT") "getAttribute"in l? (g = (l.getAttribute ("role") || l.tagName) .toUpperCase(), g =! G (l) & & g =! 1, g =! g); (g = g || a.ctrlKey || a.shiftKey || a.altKey || a.metaKey || F (l) & & 32 == h) || (g = l.tagName in ea) || (g = l.getAttributeNode ("tabindex (l = "INPUT"! = l.tagName.toUpperCase "), g = null! = g & & g.specified), g =! (g & &! l.disabled)() || l.type, g =! (N E)에 & & == 13에, H = (0 == E [N] %의 시간을 || g) & & !! l)} H & & ((n = 1, n) & & n! = this에 대해 다음과 같이 입력합니다. e = "clickkey")} l = a.srcElement || a.target; h = J (e, a, l, "", null) (var) = k (p, "jsaction"); if (n = n) n (n은 부모 노드를 나타냄) {p = c = n; g = e; var q = p. (varq = {}에 대해, A = w.split (ka), B = 0, z = A ㆍ A 길이 : 0; B- webkit-keyframes gb__a {0 % {opaci # gbsfw (최소 너비 : 400px, 오버플로 : 표시}} .gb_Jb, # gbsfw. {tac : 0} 50 % {opacity : 1}} @ 키 프레임 gb__a {0 % {opacity : 0} 50 % {opacity : 1}} # gbsfw.gb_qa iframe {디스플레이 : 없음} .gb_Kb {패딩 : 118px 0; 텍스트 정렬 : 센터} .gb_Lb {배경 : no-re

출처

2016-07-21 13:05:27

CSS 파일에 포함 된 이미지를 보는 방법

답변

관련 문제