Рубрика: CSS

Рубрики
WordPress Блоки "произвольный html" CSS JQuery

«Toggle»

  • Автор записи Автор: bo52
  • Дата записи 05.11.2022
  • Insert Headers and Footers
    • Script in Footer
      • плагин размещения js кода
  • сворачивание блоков
$('.mytoggle').each(function () {
	h=$(this);
	let html=h.html();
	h.empty();
	h.css('margin-bottom','0');
	let btn=$('<img>').prependTo(h);	
	$('<div>').appendTo(h).html(html);
	btn.css('display','inline-block');
	btn.css('vertical-align','top');
	btn.css('height','24px');
	btn.css('width','24px');
	btn.next().css('display','inline-block');
	btn.attr('src','http://codegid.ru/img/cub_r.png');
	btn.click(function(){$(this).parent().next().slideToggle()});
	
	let div=h.next();
	div.css('padding','5px');
	div.css('border','1px solid');
	div.css('display','none');
});
  • Пример использования в редакторе с блоками html
<div class="mytoggle">head</div><div>content</div>
Рубрики
HTML "Projects" HTML CSS JQuery JavaScript Портфолио

html\editor «sd»

  • Автор записи Автор: bo52
  • Дата записи 27.05.2022

Строчный вложенный редактор с перетаскиванием

Продолжить чтение «html\editor «sd»»
Рубрики
CSS основы

Способы добавления стилей на страницу

  • Автор записи Автор: bo52
  • Дата записи 06.04.2022
  • ОТНОСИТЕЛЬНОЕ
локальное добавление стиля в корне текущей папки
<link rel="stylesheet" href="/САЙТ/style.css">
локальное добавление стиля в родительской папке корня текущей папки
<link rel="stylesheet" href="../style.css">
  • АБСОЛЮТНОЕ
добавление стиля по полному пути
<link rel="stylesheet" href="http://www.htmlbook.ru/style.css"
Рубрики
HTML CSS Теги TextArea

textarea внутри контейнера с табами

textarea встраивает свою высоту при изменении высоты контейнера с ограничением минимальной высоты и длинны

<div class="cont">
<div cass="tabs">tab</div>
<div cass="div">
<textarea></textarea>
</div>
</div>

<style>
.cont{  
min-width: 300px;
min-height: 280px;
}
.tabs{
height:10%;
}
.div{
height:90%;
}
textarea{
height:100%;
}
</style>
Рубрики
Fragments "CSS" CSS

«Примеры стилей»

  • элемент «высота»
//высота по родительскому элементу
height: inherit;
  • элемент «вертикальное расположение»
//размещение элемента по вертикали (вверх)
vertical-align: top;
//размещение элемента по середине
vertical-align: middle;
  • элемент «рамка»
//рамка контейнера
border: 1px solid black;
  • элемент «Mouse»
//при наведении на элемент появляется курсор
cursor: pointer;