Архив

Публикации с меткой ‘css’
input date своя иконка
22 января 2021 Нет комментариев 
input[type=date]::-webkit-calendar-picker-indicator{
	display:none;
}
input[type=date]{
	background:url("../images/icon_calendar.svg") #f7f9fc no-repeat 90% 50%;
}
Categories: CSS Tags:
input number hide arrows
15 декабря 2020 Нет комментариев 
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button{
	-webkit-appearance:none;
}
input[type=number]{
	-moz-appearance:textfield;
}
Categories: CSS Tags:
css — картинка по центру по высоте
3 декабря 2020 Нет комментариев 
.catalog{
	.item{
		.photo{
			a{
				display:inline-block;
				height:100%;
				img{
					display:inline-block;
					vertical-align:middle;
					max-width:100%;
					max-height:100%;
					width:auto;
				}
				&:after{
					content:'';
					display:inline-block;
					vertical-align:middle;
					height:100%;
				}
			}
		}
	}
}
Categories: CSS Tags: ,
css — c большой буквы
4 августа 2020 Нет комментариев

Первая буква в ссылке заглавная
less:

ul{
	li{
		a{
			display:block;
			&:first-letter{
				text-transform:uppercase;
			}
		}
	}
}

css:

ul li a{
	display:block;
}
ul li a:first-letter{
	text-transform:uppercase;
}

Первая буква в каждом слове заглавная
less:

ul{
	li{
		text-transform:capitalize;
	}
}

css:

ul li{
	text-transform:capitalize;
}
Categories: CSS Tags:
css — построчно закрасить текст
6 июля 2020 Нет комментариев

Для отступов в каждой строке outline

span{
	background:#45bf55;
	color:#ffffff;
	outline:#45bf55 solid 5px;
}
Categories: CSS Tags:
jquery before css
18 июня 2019 Нет комментариев

Применить стили к :before (1200 — ширина рабочей области)

$(window).load(function(){
	var half=(parseInt($(window).width())-1200)/2;
	$('head').append('<style>.title:before{width:'+(half-15)+'px;left:-'+half+'px;}</style>');
});
Categories: CSS, Javascript Tags: ,
css косая граница
6 июня 2019 Нет комментариев

Less:

.block{
	position:relative;
	&:before{
		content:'';
		position:absolute;
		top:0;
		left:-20px;
		display:block;
		width:20px;
		height:100px;
		background:@color_white;
		-webkit-transform:skewX(15deg);
		-moz-transform:skewX(15deg);
		-ms-transform:skewX(15deg);
		-o-transform:skewX(15deg);
		transform:skewX(15deg);
	}
}
Categories: CSS Tags: ,