Архив

Публикации с меткой ‘css’
ol, ul — цвет нумерации
7 декабря 2015 Нет комментариев 
article ul,article ol{
	list-style-type:none;
	counter-reset:num;
	margin:0 0 20px 0;
}
article ul li,article ol li{
	list-style-type:none;
	padding-left:20px;
	margin-bottom:4px;
}
article ul li:before,article ol li:before{
	color:#ffffff;
	background:#ff9300;
	border-radius:50%;
	padding:0 5px;
	text-align:center;
}
article ul li:before{
	content:"•";
}
article ol li:before{
	content:counter(num);
	counter-increment:num;
}

LESS:

.article{
	ul,ol{
		list-style-type:none;
		counter-reset:num;
		margin:0 0 20px 0;
		li{
			list-style-type:none;
			padding-left:20px;
			margin-bottom:4px;
			position:relative;
			&:before{
				position:absolute;
				top:0;
				left:0;
				color:@color_link;
				font-weight:600;
			}
		}
	}
	ul li:before{
		content:"•";
	}
	ol li:before{
		content:counter(num) ". ";
		counter-increment:num;
	}
}

Для того чтобы учитывался атрибут start у ol:

$('article ol').each(function(){
	var start=parseInt($(this).attr('start'));
	if(start>0){
		$(this).css('counter-reset','num '+(start-1));
	}
});
Categories: CSS Tags:
css: колонки в таблице равной ширины
21 апреля 2015 Нет комментариев 
table{
	table-layout:fixed;
}
Categories: CSS Tags:
css каждый второй tr
30 декабря 2014 Нет комментариев

Для таблиц с class even
Примеры CSS:
Каждый четный: :nth-child(even)

table.even {
	border-collapse:collapse;
	border:0px;
	width:100%;
}
table.even td{
	border:0px;
	padding:12px;
}
table.even tr:nth-child(even){
	background:#d38282;
	color:#ffffff;
}

Чтобы каждый 3-й и т.д.: nth-child(Nn)

table.even {
	border-collapse:collapse;
	border:0px;
	width:100%;
}
table.even td{
	border:0px;
	padding:12px;
}
table.even tr:nth-child(3n){
	background:#d38282;
	color:#ffffff;
}

Нечетные :nth-child(odd)
И т.д.

Categories: CSS Tags:
css: border — границы внутри блока
14 августа 2014 Нет комментариев 
.classname {
	border:2px solid #000000;
	box-sizing:border-box;
}
Categories: CSS Tags:
css: своя стрелка для select
16 февраля 2013 2 комментария

html:

<div class="select_cnt">
	<select id="selectid" name="selectname">
		<option value="1">вариант 1</option>
		<option value="2">вариант 2</option>
	</select>
</div>

css:

.select_cnt {
	width:180px;
	height:20px;
	overflow:hidden;
	float:right;
	margin-right:20px;
	background:url('/img/cat_select.png') no-repeat right;
}
.select_cnt select {
	width:200px;
	height:20px;
	border:none;
	background-color:transparent;
	background-color: rgba(0,0,0,0);
}
Categories: CSS Tags:
css: стиль для первого вложенного элемента
11 февраля 2013 Нет комментариев

В примере для первого div внутри элемента

.classname div:first-child {
}
Categories: CSS Tags:
css: свой шрифт (из файловой системы)
1 июля 2012 Нет комментариев 
@font-face {
	font-family: Days;
	src: url('/fonts/Days.otf') format("opentype");
}
.class {
	font-family:Days;
}
Categories: CSS Tags: