How to apply a style to a specific page? I want to apply different stype on the pages of my site.

The following code applies a hard background to all product pages :

body.path-product {
    background-image: url("/themes/contrib/bootstrap_subtheme_front_office/images/background-page.svg");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
}


I want a different style to be applied for the product/add/produit path.

How to do this ?

Screenshot :

enter image description here

In my theme I created a file "html--product--add.html.twig" and I pasted in the contents of "html.html.twig".

{#
/**
 * @file
 * Default theme implementation to display the basic html structure of a single
 * Drupal page.
 *
 * Variables:
 * - $css: An array of CSS files for the current page.
 * - $language: (object) The language the site is being displayed in.
 *   $language-&gt;language contains its textual representation.
 *   $language-&gt;dir contains the language direction. It will either be 'ltr' or
 *   'rtl'.
 * - $rdf_namespaces: All the RDF namespace prefixes used in the HTML document.
 * - $grddl_profile: A GRDDL profile allowing agents to extract the RDF data.
 * - $head_title: A modified version of the page title, for use in the TITLE
 *   tag.
 * - $head_title_array: (array) An associative array containing the string parts
 *   that were used to generate the $head_title variable, already prepared to be
 *   output as TITLE tag. The key/value pairs may contain one or more of the
 *   following, depending on conditions:
 *   - title: The title of the current page, if any.
 *   - name: The name of the site.
 *   - slogan: The slogan of the site, if any, and if there is no title.
 * - $head: Markup for the HEAD section (including meta tags, keyword tags, and
 *   so on).
 * - $styles: Style tags necessary to import all CSS files for the page.
 * - $scripts: Script tags necessary to load the JavaScript files and settings
 *   for the page.
 * - $page_top: Initial markup from any modules that have altered the
 *   page. This variable should always be output first, before all other dynamic
 *   content.
 * - $page: The rendered page content.
 * - $page_bottom: Final closing markup from any modules that have altered the
 *   page. This variable should always be output last, after all other dynamic
 *   content.
 * - $classes String of classes that can be used to style contextually through
 *   CSS.
 *
 * @ingroup templates
 *
 * @see bootstrap_preprocess_html()
 * @see template_preprocess()
 * @see template_preprocess_html()
 * @see template_process()
 */
#}
{%
  set body_classes = [
    logged_in ? 'user-logged-in',
    not root_path ? 'path-frontpage' : 'path-' ~ root_path|clean_class,
    node_type ? 'page-node-type-' ~ node_type|clean_class,
    db_offline ? 'db-offline',
    theme.settings.navbar_position ? 'navbar-is-' ~ theme.settings.navbar_position,
    theme.has_glyphicons ? 'has-glyphicons',
  ]
%}
&lt;!DOCTYPE html&gt;
&lt;html {{ html_attributes }}&gt;
  &lt;head&gt;
    &lt;head-placeholder token="{{ placeholder_token|raw }}"&gt;
    &lt;title&gt;{{ head_title|safe_join(' | ') }}&lt;/title&gt;
    &lt;css-placeholder token="{{ placeholder_token|raw }}"&gt;
    &lt;js-placeholder token="{{ placeholder_token|raw }}"&gt;
  &lt;/head&gt;
  &lt;body{{ attributes.addClass(body_classes) }}&gt;
    &lt;a href="#main-content" class="visually-hidden focusable skip-link"&gt;
      {{ 'Skip to main content'|t }}
    &lt;/a&gt;
    {{ page_top }}
    {{ page }}
    {{ page_bottom }}
    &lt;js-bottom-placeholder token="{{ placeholder_token|raw }}"&gt;
  &lt;/body&gt;
&lt;/html&gt;


How to put the class "body.path-product-add" in this file ?
I guess you want to apply that class to the body tag. If that's true then you just need to append body_classes array and put your class in the end.

set body_classes = [
  logged_in ? 'user-logged-in',
  not root_path ? 'path-frontpage' : 'path-' ~ root_path|clean_class,
  node_type ? 'page-node-type-' ~ node_type|clean_class,
  db_offline ? 'db-offline',
  theme.settings.navbar_position ? 'navbar-is-' ~ theme.settings.navbar_position,
  theme.has_glyphicons ? 'has-glyphicons',
  'path-product-add',
]


And then clear cache of your website.