4coders » CSS http://4coders.info It's not about coding, dude! Sat, 20 Nov 2010 11:30:20 +0000 en hourly 1 http://wordpress.org/?v=3.3 30 dobrych praktyk dla początkujących z HTML i CSS http://4coders.info/30-dobrych-praktyk-dla-poczatkujacych-z-html-i-css.html http://4coders.info/30-dobrych-praktyk-dla-poczatkujacych-z-html-i-css.html#comments Sun, 17 May 2009 15:44:45 +0000 coder http://4coders.info/?p=165 Masz, może się czegoś w końcu nauczysz ;-)

http://net.tutsplus.com

Podobne ↓

]]> http://4coders.info/30-dobrych-praktyk-dla-poczatkujacych-z-html-i-css.html/feed 0 25 sposobów na zaokrąglone brzegi dzięki CSS http://4coders.info/25-sposobow-na-zaokraglone-brzegi-dzieki-css.html http://4coders.info/25-sposobow-na-zaokraglone-brzegi-dzieki-css.html#comments Fri, 13 Mar 2009 10:38:16 +0000 coder http://4coders.info/?p=155 Niekiedy trzeba zaokrąglić brzegi bo pan klient się uparł. 25 sposobów na okrągłe brzegi w jednym miejscu.

Zobacz inne ↓

]]> http://4coders.info/25-sposobow-na-zaokraglone-brzegi-dzieki-css.html/feed 1 Seksowne przyciski w CSS http://4coders.info/seksowne-przyciski-w-css.html http://4coders.info/seksowne-przyciski-w-css.html#comments Fri, 13 Mar 2009 09:45:53 +0000 coder http://4coders.info/?p=153 Bardzo ładny i szybki tutorial jak zrobić ładne buttony przy pomocy samego CSS’a.

Podobne ↓

]]> http://4coders.info/seksowne-przyciski-w-css.html/feed 0 Jak zrobić przyjazne wyszukiwarkom logo? http://4coders.info/jak-zrobic-przyjazne-wyszukiwarkom-logo.html http://4coders.info/jak-zrobic-przyjazne-wyszukiwarkom-logo.html#comments Wed, 04 Mar 2009 12:34:06 +0000 coder http://4coders.info/?p=123 Zazwyczaj na stronach jest jakiś element, który możemy nazwać logiem. Idealnie dla wyszukiwarki jak będzie to tekst umieszczony w znaczniku h1. Tekst jest jednak mało atrakcyjny wizualnie jeśli chodzi o logo, zaś grafika mało atrakcyjna dla bota wyszukiwarek. Istnieje jednak ciekawe rozwiązanie przy użyciu CSS.

Logo umieszczamy w takim kodzie:

<h1><a href="http://4coders.info">dla programistów</a></h1>

Do tego dorzucamy CSS:

h1 {
	text-decoration:none;
	border:0;
	width : 200px;
	height : 100px;
	margin : 0;
	padding : 0;
	background : url(logo.jpg) no-repeat 0 0;
}
 
h1 a {
	display : block;
	height : 100px;
	text-indent : -9999px;
}

Co się stanie?

  • jak to zadziała bez CSS to wiadomo, widać
  • z CSS, h1 otrzyma w tle nasze logo z pliku logo.jpg (wysokość i szerokość h1 ustawiamy na wysokość i szerokość loga)
  • tekst w kotwicy przesuwamy gdzieś w „nieskończoność”

Można sobie sprawdzić jak to zadziała w przeglądarce, która obsługuje CSS oraz np. w przeglądarce links (lub bez kodu CSS). Generalnie, enduser będzie zadowolony bo widzi ładne logo, a google bot nakarmiony tekstem …

Podobne ↓

]]> http://4coders.info/jak-zrobic-przyjazne-wyszukiwarkom-logo.html/feed 2 position: fixed w Internet Explorer http://4coders.info/position-fixed-w-internet-explorer.html http://4coders.info/position-fixed-w-internet-explorer.html#comments Fri, 16 Jan 2009 09:14:38 +0000 coder http://4coders.info/?p=102 Jak powszechnie wiadomo IE6 ma w nosie position:fixed. Jak sobie z tym radzić można przeczytać tutaj.

Zobacz inne ↓

]]> http://4coders.info/position-fixed-w-internet-explorer.html/feed 0