Div?

2013-05-03 35 views
9

Herhangi bir şekilde değiştirilemeyen bir harici stil sayfası (.css dosyası) verilmiş. Ancak bu stil sayfasını tek bir div ve bu yüzden zaten mevcut web sayfasındaki div içeriğini kullanmam gerekiyor. Şu anda stil sayfasının içeriğini metin olarak boş bir stil etiketine (.innerHTML kullanarak) etkilemem gereken div içinde okuyorum, ancak bu sadece tek bir div yerine tüm web sayfasını etkiliyor. Birisi bununla ilgili yardım edebilir mi?Div?

+0

CSS tüm sayfayı etkiler. Bunu yalıtmayı bildiğim tek yol, sayfanın yalnızca belirli bir bölümünü etkilemesi için bir IFRAME kullanmaktır. –

+0

Bu yüzden divamdaki bir IFRAME? Bunu yapabilirim ancak o zaman sadece IFRAME'i nasıl etkilerim? – LethalPapercut

cevap

9

IFRAME çözüm bu gibi çalışır:

ana HTML dosyası olarak, size DIV gerekecek:

<div id="myspecialdiv"> 
    <iframe width="100%" height="100%" frameborder="0" src="divcontent.html"></iframe> 
</div> 

Stil İhtiyacınız olarak söyledi. : (PHP örneğin): divcontent.html dosya DIV etiketinin içeriği de dahil olmak tam bir HTML dosyası olabilir, bir LİNK harici stil kullanarak gerektiğini

<html> 
    <head> 
     <link rel="stylesheet" href="path/to/external/stylesheet.css" /> 
    </head> 
    <body> 
     <!-- The contents of your DIV --> 
    </body> 
</html> 
+0

tarafından dövülen Oops, bir dizi dış stil sayfası verdiğimi söylüyor. Tüm bunları çalışma zamanında divcontent.html'ye nasıl bağlarım? Sürekli olarak yeni .css dosyaları aldığım bir web uygulamasında çalışıyorum. – LethalPapercut

+0

Bu, çalışma zamanınıza, web uygulamasını geliştirmek için kullandığınız dile, üzerinde bulunduğu çerçeveye ve uygulamanızın mimarisine bağlıdır. Ama 'divcontent.html' dosyasının aslında HTML olması gerekmiyor - HTML oluşturan herhangi bir dosya olabilir (örn: PHP, aspx, vb.). Cevap size konsept verir - bunu özel gereksinimlerinize uyarlamanız gerekir. –

6

HTML5 ile çalışabiliyorsanız, scoped styles kullanmayı deneyebilirsiniz. Bunu sadece üst Etkisi oldu, div içinde CSS şunları içerebilir:

<div> 
    <style scoped> 
     // Styles here 
    </style> 
</div> 
+0

Şaşırtıcı bir çözüm gibi gözüküyor ancak kapsamlı özelliklerin büyük tarayıcılarda henüz desteklenmediğini görmek benim ihtiyaçlarıma uymuyor. – LethalPapercut

+0

Harici CSS dosyalarına bağlantı vermek istiyorum ve