«css» etiketlenmiş sorular

Şu anda bir liste oluşturmak için bu kod parçasını kullanıyorum: <ul ng-cloak> <div ng-repeat="n in list"> <li><a href="{{ n[1] }}">{{ n[0] }}</a></li> <li class="divider"></i> </div> <li>Additional item</li> </ul> Ancak, <div>öğe bazı tarayıcılarda çok küçük bazı oluşturma hatalarına neden oluyor. Ng-tekrarını div konteyneri olmadan yapmanın bir yolu veya aynı etkiyi elde …

91 javascript  css  html  angularjs 

Sonraki günlerde bir web uygulamasının prototipini müşterilerimden birine sunmam gerekiyor, mesele şu ki CSS'de o kadar iyi değilim ve en kötüsü aldığım sonuçlardan neredeyse hiç memnun değilim. İş mantığını kodlamak bana zorluk çıkarmaz, ancak UI tasarımı zamanımın% 80'inden fazlasını alıyor. Nefes kesici hiçbir şeye ihtiyacım yok, sadece temiz, güzel ve …

91 css  user-interface 

Webkit'in geçiş bitiş olayına webkitTransitionEnd, Firefox geçişEnd, opera oTransitionEnd olarak adlandırılır. Bunların hepsini saf JS'de ele almanın iyi bir yolu nedir? Tarayıcı koklama yapmalı mıyım? veya her birini ayrı ayrı uygulayabilir misiniz? Aklıma gelmeyen başka bir yol? yani: //doing browser sniffing var transitionend = (isSafari) ? "webkitTransitionEnd" : (isFirefox) ? …

91 javascript  css  css-transitions  dom-events 

Stil sahibi bir unsurum var position: relative; transition: all 2s ease 0s; Sonra üzerine tıkladıktan sonra konumunu sorunsuz bir şekilde değiştirmek istiyorum, ancak stil değişikliğini eklediğimde geçiş gerçekleşmiyor, bunun yerine öğe anında hareket ediyor. $$('.omre')[0].on('click',function(){ $$(this).style({top:'200px'}); }); Ancak color, örneğin özelliği değiştirirsem, sorunsuz bir şekilde değişir. $$('.omre')[0].on('click',function(){ $$(this).style({color:'red'}); }); Bunun …

91 javascript  css  transition 

<input type="range" />Dikey olarak bir kaydırıcı kontrolü görüntülemek istiyorum . Yalnızca aralık kaydırıcı kontrolünü destekleyen tarayıcılarla ilgileniyorum. Yüksekliğin genişlikten daha büyük ayarlanmasının tarayıcının otomatik olarak yönlendirmeyi değiştirmesine neden olacağını gösteren bazı yorumlar ve referanslar buldum, ancak benim testlerimde bu sadece Opera'da çalışıyordu ama artık Opera'da çalışıyordu. Bir HTML5 aralığı kaydırıcısını …

91 html  css 

Aşağıdaki mesajı aldım (biraz değişti): "Yarışmaya 30 Ocak 2011'e kadar katılırsanız, harika yaz gezileri de dahil olmak üzere $ $ 'a kadar kazanabilirsiniz!" Şu anda sahibim: <p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;"> metin dizesini biçimlendiriyor, ancak "30 Ocak 2011" rengini # FF0000 ve "yaz" rengini # 0000A0 olarak değiştirmek istiyor. Bunu …

91 html  css  text  colors  inline 

Web sitemde reset.css kullanıyorum. Stilleri listelemek için tam olarak bunu ekler: ol, ul { list-style: none outside none; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, …

91 html  css  html-lists 

Bir <button>etiketin iç öğelerini flexbox'larla ortalamaya çalışıyorum justify-content: center. Ancak Safari onları ortalamıyor. Aynı stili diğer tüm etiketlere uygulayabilirim ve amaçlandığı gibi çalışır (bkz. <p>-Tag). Yalnızca düğme sola hizalanır. Firefox veya Chrome'u deneyin ve farkı görebilirsiniz. Üzerine yazmam gereken herhangi bir kullanıcı aracısı stili var mı? Ya da bu soruna …

91 html  css  safari  flexbox  css-grid 

Bu nedenle, aşağıdaki gibi fare üzerinde ters animasyon yapmak mümkündür: .class{ transform: rotate(0deg); } .class:hover{ transform: rotate(360deg); } ancak @keyframes animasyonunu kullanırken, çalışmasını sağlayamadım, örneğin: .class{ animation-name: out; animation-duration:2s; } .class:hover{ animation-name: in; animation-duration:5s; animation-iteration-count:infinite; } @keyframe in{ to {transform: rotate(360deg);} } @keyframe out{ to {transform: rotate(0deg);} } Yinelemelere ve …

91 css  animation 

Ruby tabanlı transpiler kadar basit olmadığı için libsass kurmakla uğraşıyordum. Birisi nasıl yapılacağını açıklayabilir mi: libsass yüklensin mi? komut satırından kullanmak? yudum ve homurtu gibi görev koşucuları ile kullanmak? Paket yöneticileriyle çok az deneyimim var ve hatta görev yöneticileriyle daha az deneyimim var.

91 css  sass  gulp-sass  node-sass  libsass 

Bu kodu dinamik olarak oluşturulmuş bir div öğesine eklemeye çalışıyorum style = "width:330px;float:left;" Kod hangi dinamik yaratır divolduğunu var nFilter = document.createElement('div'); nFilter.className = 'well'; nFilter.innerHTML = '<label>' + sSearchStr + '</label>'; Benim fikrim stili sonradan eklemek < div class="well"ama nasıl yapardım bilmiyorum.

91 javascript  css  innerhtml 

Esnek öğelerin ortalanmasını istiyorum, ancak ikinci bir çizgimiz olduğunda, 5'in (aşağıdaki görüntüden) 1'in altında olmasını ve üst öğede ortalanmamasını istiyorum. İşte sahip olduğum şeylere bir örnek: ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; } li { list-style-type: none; border: 1px solid gray; margin: …

91 html  css  flexbox 

İOS'ta (Safari 5) giriş öğesi (üst iç gölge) için takip etmem gerekiyor: Üst gölgeyi kaldırmak istiyorum, hata -webkit-appearancekaydetmiyor. Mevcut stil: input { border-radius: 15px; border: 1px dashed #BBB; padding: 10px; line-height: 20px; text-align: center; background: transparent; outline: none; -webkit-appearance: none; -moz-appearance: none; }

91 ios  css  input 

Gördüğünüz gibi list-items, ilki rowaynı height. Ancak ikincideki öğeler rowfarklıdır heights. Tüm eşyaların üniforma olmasını istiyorum height. Bunu sabit yükseklik vermeden ve sadece flexbox kullanarak başarmanın bir yolu var mı? İşte benim code .list { display: flex; flex-wrap: wrap; max-width: 500px; } .list-item { background-color: #ccc; display: flex; padding: 0.5em; …

91 html  css  flexbox 

Yazı tipini etkilemeden opaklık kullanarak liste menüsünün arka planının kaybolmasını istiyorum. CSS3 ile mümkün mü?

91 html  css  opacity