Как да използвате CSS фрагменти в Obsidian

Фрагментите с каскадни стилови таблици (CSS) ви помагат да добавяте персонализирани стилове към Obsidian trezor. Те са мощни инструменти, които помагат за дефинирането на различни части на потребителския интерфейс, като цвета, позицията и размера на елементите. Да се ​​научите да използвате CSS фрагменти в Obsidian означава, че можете да създадете персонализиран външен вид, позволявайки на Obsidian да се доближи до вашия стил на работа и личност. Това може да подобри вашето преживяване и производителност като цяло. Прочетете, за да научите как да използвате CSS фрагментите на Obsidian.

Добавяне на фрагменти в Obsidian

Първата част от използването на CSS фрагменти е да ги добавите. Различните персонализации и стилове ви позволяват да създадете визуално привлекателно и функционално работно пространство. Използването на фрагменти прави воденето на бележки пълноценно и приятно. В случай, че още не знаете, това е как да добавите фрагменти към вашия трезор:

1. Отидете на „Настройки“ и го отворете.
   
2. Изберете „Външен вид“ и изберете „CSS фрагменти.
   
3. Изберете „Папка с фрагменти“.
   
4. Създайте или изтеглете CSS фрагментите в тази папка.
   
5. Отворете „Фрагменти“ и „Презареждане“.
   

Използване на CSS фрагменти в Obsidian

В Obsidian използването на CSS фрагменти помага за презаписване или допълване на различни по-големи теми, които прилагате към продукта. За да използвате фрагменти:

1. Добавете файл с име .css към .obsidian/snippets.
   
2. Отидете до опцията „Външен вид“.
   
3. Опресняване.
   
4. Изберете получения файл с превключвател.
   

Оформяне на Obsidian с помощта на CSS фрагменти

CSS фрагментите са неразделна част от Obsidian, защото те описват как трябва да изглежда всяка част от трезора. Тези фрагменти ви позволяват да персонализирате практически всички характеристики на Obsidian, за да отговарят на вашите предпочитания. Има различни опции, що се отнася до стилизирането на Obsidian.

Използване на селектори за избор на стил

Решаването какво да стилизирате изисква „селектори“. Това ви позволява да идентифицирате частта, която трябва да стилизирате. Селекторите обикновено са вложени и трябва да сте конкретни. Ако стилизирате „шрифт с кавички“, изберете точно това. Като цяло избирането на „кавички“ променя външния вид на блоковите цитати във всяка част на приложението.

Използвайте свойства, за да стилизирате селекцията

За да стилизирате избора си, трябва да използвате „Свойства“, които са в изобилие в CSS. За да бъдете конкретни относно резултата, идентифицирайте свойствата, които се нуждаят от редактиране, и им дайте целевите стойности.

Използвайте декларация, за да дадете инструкции

За да се дадат инструкциите, се използва „декларация“. Това включва селектора (какво се нуждае от стилизиране), свойствата, които се нуждаят от стилизиране (частите, които трябва да се променят) и новите стойности на свойствата (изгледа, който искате). Например, ако искате целият текст в редактора да е червен, това е все едно да кажете: „Обсидиан, намери целия текст в редактора и им кажи да станат червени.“ CSS декларацията трябва да изглежда така:

.markdown-source-view { цвят: червен; }

.markdown-source-view действа като селектор. {} съдържа свойствата, които трябва да бъдат стилизирани, докато цветът изобразява свойството, а червеното е желаната стойност. Връзките на стойностите на всички свойства се показват със свойство, последвано от двоеточие, стойност и точка и запетая, за да завършите вашия ред. Имотите трябва да са на един отстъп от сектора, за да ги разграничавате лесно.

Разделянето на декларацията на редове не е задължително, но може да ви помогне, когато променяте много различни елементи и аспекти.

Интерпретацията на CSS е последователна, като най-новите декларации имат власт над всички останали, предхождащи я.

Използвайте класове, за да изберете какво да стилизирате

„Класовете“ се използват за избор на това, което трябва да стилизирате. Класовете са описани като добавени атрибути на основната структура на приложението. Те могат да бъдат насочени с помощта на селектори. .markdown-source-view идентифицира съдържанието на приложението, което е отворено за изглед на редактор. Предходна точка в имената на обекти обозначава класове.

Целеви елементи

„Елементите“ също се нуждаят от насочване, в зависимост от това какво се оформя. Това са структурни части на приложението. Параграфите могат да бъдат с отстъп с помощта на селектор на елемент „p“. Не се използва предхождаща пунктуация за описание на елементи.

Използвайте логиката в селекторите, за да увеличите специфичността

Използването на интервал увеличава специфичността чрез избиране на потомци: „баба и дядо родител-дете“ избира детето на родителя, който е дете на баба и дядо. Например, .markdown-source-view blockquote избира блокови цитати в панелите на режима на редактиране.

Ако има точка между класовете, това показва връзка „и“. Например, въвеждането на „.programmer.designer“ ще избере елементи с „programmer“ и „designer“ като клас.

Запетая е логически разделител „или“. Например, въвеждането на „blockquote,pre“ е насочено към елементите „blockquote“ и „pre“.

Можете да се обърнете към Ръководство на Mozilla за CSSтъй като по-голямата част от логиката там се отнася за Obsidian.

Запазване на декларациите за стил

Когато правите цялостни теми, запазете ги под VAULT/.obsidian/themes. Това трябва да има уникално име и да се намира в Настройки> Външен вид> Тема в Obsidian. Докоснете опцията „Презареждане на теми“, ако не е открита. Ако промените се правят на съществуваща тема и са малки, съхранете ги под VAULT/.obsidian/snippets.

Персонализиране на Obsidian теми с помощта на CSS фрагменти

Obsidian има теми, които ви позволяват да правите промени. Можете да изберете да продължите да изпробвате една тема наведнъж или да създадете персонализиран CSS, който отговаря на вашите нужди, като използвате DevTool.

Поставете отметка на опцията „Прилагане на CSS фрагмент“.

Оттук започвате и това е да активирате персонализиран CSS. Това позволява на Obsidian да прочете кода и след това да презапише стила по подразбиране. Стъпките по-долу помагат да активирате персонализираната CSS опция.

1. Отворете приложението Obsidian.
   
2. Отидете до „Настройки“ на страницата си с обсидиан (долу вдясно). Това отваря страницата с настройки.
   
3. Изберете „Външен вид“ на страницата с настройки.
   
4. В долната част на менюто „Външен вид“ отметнете опцията „Прилагане на CSS фрагмент в (директория)“.
   

Това ще насочи приложението към CSS файла, намиращ се в основната директория на трезора. Това се чете и персонализираният CSS код се прилага. На този етап няма CSS файл.

Извлечете максимума от Obsidian с помощта на CSS фрагменти

Обсидианът отваря много възможности. За да извлечете максимума от него, трябва да опитате нещо допълнително, което правите, като го използвате, по-вълнуващо и възнаграждаващо. Създаването на вашите теми с помощта на CSS може да е всичко, от което се нуждаете. За да направите това, първо трябва да активирате CSS Snippets в Obsidian чрез менюто с настройки. CSS ви позволява да променяте стила и да добавяте нови стойности. Можете да постигнете много повече и да си поиграете с използването на CSS фрагменти.

Опитвали ли сте някога да използвате CSS фрагменти на Obsidian? Какъв беше вашият опит? Моля, споделете с нас в секцията за коментари по-долу.