svg css yuvarlanmış köşe çalışmıyor

CSS uygulamasına uyguladığım bir SVG dosyası var. Çoğu kural işe yarıyor gibi görünüyor, ancak köşelerin yuvarlanmasıyla ilgili kurallar uygularken (rx: 5; ry: 5) hiçbir etkisi yoktur. 'Inline' tarzı kurallar çalışır, ancak gömülü ve dış stil sayfaları ile hiçbir şans yaşıyorum: Yanlış gidiyorumsvg css yuvarlanmış köşe çalışmıyor

<svg ...> 
<defs> 
    <style type="text/css" > 
    <![CDATA[ 
    rect{ rx:5; ry:5; } 
    ]]> 
    </style> 
</defs> 

<rect 
    height="170" width="70" id="rect7" 
    x="0" y="0" /> 
</svg>

bir fikrin?

kaynak

2011-12-31 pluke

rx ve ry sunum nitelikleri yerine düzenli niteliklerdir. Sadece sunum özellikleri CSS tarafından şekillendirilebilir. Çeşitli normal/sunum nitelikleri, SVG 1.1 belirtiminden Presentation Attribute ve Property numaralı bilgilere de bakınız.

Yaklaşan SVG2 belirtiminin çoğu sunum özelliklerinin CSS özellikleri haline gelmesini önerir. Şimdiye kadar sadece Chome taslak şartnamenin bu bölümünü uyguladı. Diğer UA'ların bunu zamanında uygulayacağını düşünüyorum.

kaynak

2011-12-31 12:49:52

sayesinde. Svg'nin yuvarlama ayarını, "border-radius: 5px; – pluke

" ile ayarlayabilmenin herhangi bir yolu var. Bu açık cevap: –

Maalesef, soruyla daha açık olmalıydım, CSS3'ün şu anda “yarıçapı” yarıçapına izin verdiğinden, aynı efekti elde etmek için bir stil sayfasının veya alternatifinin uygulanabileceği herhangi bir yol var mı: 5px; '? SVG'leri dinamik olarak oluşturmuyorum ve farklı genel stillere sahip farklı web sitelerinde kullanıyorum. Bu 'inline' ya da anında değiştirmek için javascript yazmak için tek yol mu? – pluke

komut dosyası daha basit olamaz, neden bunu kullanmamayı: bunu açıklıyor

yourRect.setAttributeNS(null, "rx", "5"); 
yourRect.setAttributeNS(null, "ry", "5");

kaynak

2012-01-01 17:06:37 Alex

svg css yuvarlanmış köşe çalışmıyor

cevap

İlgili konular