• Используйте для классов префикс в виде наименования приложения или расширения, чтобы обеспечить отсутствие конфликтов с другими CSS в системе.

• Свяжите свойство CustomClass со значением, которое инициирует визуальные обновления с помощью соответствующих селекторов CSS.

• Время от времени CSS может переопределять определения виджета, однако это также зависит от того, как свойство было определено в виджете. При возникновении конфликтов используйте вложенный выбор родителя/потомка в CSS, а также директиву !important (соблюдая меры предосторожности).

• Удостоверьтесь, что для размеров или положения используются значения на основе процентов. Для позиционирования полезны атрибуты Vertical-Align и Text-Align. Контейнер с гибкой рамкой позволяет эффективно управлять размером и положением элементов.

• Некоторые виджеты не поддерживают новое свойство CustomClass, но можно выполнить дополнительную настройку CSS. Одним из вариантов является маркировка родительского контейнера (компоновка/панель) с помощью класса с последующим выбором целевого раздела в CSS с помощью селектора родитель-потомок.

• Ограничивающий параллелепипед в следующем выпуске Mashup Builder не изменяется, поэтому примените стиль для раздела ограничивающего параллелепипеда.

• Сохраните общий код в одиночном файле CSS, избегая дублирования кода. Например, если выбран внутренний элемент виджета Повторитель, поместите его в общий файл так, чтобы можно было легко применить обновление в случае изменения DOM.

• Выберите имя класса или тип элемента. Имя класса обычно представляет конструкторские намерения, тогда как элемент (таблицу) можно преобразовать в элемент другого типа (например, повышения производительности).

• При выборе по типу элемента проверьте его контекст, чтобы убедиться в пригодности кода. Например, при выборе элемента виджета текстового окна элемент input, вероятно, является безопасным; слишком общий раздел.

• Соблюдайте соответствие между именем класса ThingWorx и соответствующими конструкторскими намерениями. Например, используйте имя класса ThingWorx shadow только для настройки теней.

• По возможности используйте выбор прямых потомков (>). Это позволяет избежать передачи выбора всем рекурсивным потомкам. Мэшап может включать другие мэшапы (при использовании повторителей или вложенных мэшапов), поэтому выбирайте только нужные элементы. Пример: виджет "Панель" содержит раздел OuterContainer, поэтому необходимо выбрать прямого потомка, а не все разделы этого типа.