Changes between Initial Version and Version 1 of Zh_CN:Help/Styles/MapCSSImplementation


Ignore:
Timestamp:
2024-02-20T09:59:30+01:00 (17 months ago)
Author:
jmxtzgbv9
Comment:

先翻译部分,不保证翻译准确

Legend:

Unmodified
Added
Removed
Modified
  • Zh_CN:Help/Styles/MapCSSImplementation

    v1 v1  
     1[[TranslatedPages]]
     2[[PageOutline(2-10,Table of Contents)]]
     3= MapCSS 实现=
     4JOSM 的 [osmwiki:MapCSS/0.2 MapCSS] 实现用于实现以下功能:
     5
     6* [wikitr:/Styles 地图样式]
     7* [wikitr:/Rules Validator rules], 参见 [wikitr:/Help/Validator/MapCSSTagChecker MapCSS 标签检查器]仅用于规则的特殊部分。
     8* [wikitr:/Help/Action/Search 搜索对话框]
     9
     10考虑在 VS code中安装 [https://marketplace.visualstudio.com/items?itemName=whammo.mapcss-syntax MapCSS 语法高亮器],为 MapCSS 绘图和验证器语法添加可视化高亮。
     11
     12
     13== 总体结构 ==
     14MapCSS 样式表的规则形式为
     15{{{
     16#!mapcss
     17selector {
     18    prop: value;
     19    /* ... */
     20    prop: value;
     21    /* and/or */
     22    set: class;
     23    set: .class;
     24    /* note that validator rules do not use the colon after set */
     25}
     26}}}
     27为给定对象查找样式的算法如下:
     28{{{
     29 - for each rule:
     30     if the selector applies, set the properties from the { } block
     31 - analyze the final list of properties and generate styles from it
     32}}}
     33
     34MapCSS uses the '''comment''' format of CSS (`/* ... */`). Note that when commenting out large parts of a MapCSS file, some constructs may cause an unexpected end of the comment, for instance:
     35{{{
     36#!mapcss
     37/*
     38*[highway][name =~ /^R(\.|:)? .*/] { /* the end of the regular expression defines the unexpected end of the comment */
     39        throwWarning: tr("foo");
     40}
     41*/
     42}}}
     43
     44
     45== 选择器 == #选择器
     46选择器 "是表示 MapCSS 规则的过滤表达式。只有当选择器与地图对象匹配时,该规则才会应用于该对象。
     47
     48MapCSS 中的选择器不同于网页标准 CSS。MapCSS 只支持标准 CSS 选择器的一个子集,但扩展了 OSM 数据所需的其他选择器。
     49
     50一些示例如下:
     51{{{
     52#!mapcss
     53/* applied to ways with a tag highway=residential */
     54way[highway=residential] {  /*  the styles */}
     55
     56/* applied to new, closed ways on layer 1, provided they have the tag amenity=parking and access=customers, and provided
     57 * the zoom level is between 11 and 14
     58 */
     59way|z11-14[amenity=parking][access=customers]:closed:new::layer_1 {...}
     60
     61
     62area[amenity=parking][access=customers], area[amenity=parking][!access] {...}
     63relation[type=route][route=foot] > way::relation_underlay {..}
     64}}}
     65
     66
     67The different elements ('''type'''-, '''zoom'''- , '''condition''' selector, '''pseudo classes''', '''layer identifier''', '''grouping''' and '''child combinator''') are explained below.
     68
     69
     70=== 类别选择器 ===
     71{{{#!th valign=top
     72'''Selector'''
     73}}}
     74{{{#!th valign=top
     75'''Description'''
     76}}}
     77|-------------------------------------------------------------------------------
     78{{{#!td align=center  valign=top
     79*
     80}}}
     81{{{#!td align=left  valign=top   
     82Matches with any object
     83}}}
     84|-------------------------------------------------------------------------------
     85{{{#!td align=center  valign=top
     86`node`, `way`, `relation`
     87}}}
     88{{{#!td align=left  valign=top   
     89Matches with the osm objects of the given type.
     90}}}
     91|-------------------------------------------------------------------------------
     92{{{#!td align=center  valign=top
     93`area`
     94}}}
     95{{{#!td align=left  valign=top   
     96Matches with any area regardless of whether the area border is only modelled with a single way or with a set of ways glued together with a relation.
     97{{{
     98#!mapcss
     99area[natural=beach] {...}
     100/* ... is equal to ... */
     101way[natural=beach], relation[type=multipolygon][natural=beach] {...}
     102}}}
     103Note that `area` selects unclosed ways as well, so it may be useful to add the `:closed` pseudo class. The JOSM Validator will give a warning for unclosed ways that have an area style.
     104}}}
     105|-------------------------------------------------------------------------------
     106{{{#!td align=center  valign=top
     107`meta`
     108}}}
     109{{{#!td align=left  valign=top   
     110The `meta` selector starts a special rule that should stand at the beginning of the file. It gives some general information on the style sheet. All software that supports MapCSS should be able to parse this sections without errors, so do not use exotic syntax extensions in this part.
     111{{{
     112#!mapcss
     113meta {
     114    title: "Parking lanes";   /* title shown in the menu */
     115    icon: "logo_16x16x8.png"; /* small icon shown in the menu next to the title */
     116    version: "1.2";           /* the version of the style */
     117    description: "...";       /* one or two sentences of describing the style */
     118    author: "...";            /* the author(s) of the style */
     119    link: "https://...";      /* URL to the web page of the style */
     120    min-josm-version: 6789;   /* the minimum JOSM version where this style works */
     121}
     122}}}
     123}}}
     124|-------------------------------------------------------------------------------
     125{{{#!td align=center  valign=top
     126`canvas`
     127}}}
     128{{{#!td align=left  valign=top   
     129Some style information not specific to nodes, ways or relations.
     130{{{
     131#!mapcss
     132canvas {
     133    fill-color: #ffffea; /* the former background-color is deprecated since r7110 */
     134    default-points: false;
     135    default-lines: false;
     136}
     137}}}
     138{{{#!th
     139'''Key'''
     140}}}
     141{{{#!th
     142'''Description'''
     143}}}
     144{{{#!th
     145'''Value Format'''
     146}}}
     147{{{#!th
     148'''Default Value'''
     149}}}
     150|-
     151{{{#!td align=center
     152`fill-color`
     153}}}
     154{{{#!td
     155Specifies the overall fill/background color (`background-color` is deprecated since r7110).
     156}}}
     157{{{#!td align=center
     158''Color''
     159}}}
     160{{{#!td align=center
     161`black`
     162}}}
     163|-
     164{{{#!td align=center
     165`default-points`
     166}}}
     167{{{#!td
     168Whether default point style should be added to nodes where no style applies.
     169}}}
     170{{{#!td align=center
     171''Boolean''
     172}}}
     173{{{#!td align=center
     174`true`
     175}}}
     176|-
     177{{{#!td align=center
     178`default-lines`
     179}}}
     180{{{#!td
     181Whether default line style should be added to ways where no style applies.
     182}}}
     183{{{#!td align=center
     184''Boolean''
     185}}}
     186{{{#!td align=center
     187`true`
     188}}}
     189}}}
     190
     191=== 子节点选择器 ===
     192如果一个节点是一个方式的一部分,我们就说它是这个方式的 "子节点"。同样,如果一个节点、一条路或一个关系是一个关系的成员,我们就说它是这个关系的'''组成部分'''。
     193
     194在 MapCSS 中,你可以使用'''子选择器''',它只有在父对象和子对象都匹配的情况下才会匹配。
     195
     196Example:
     197{{{
     198#!mapcss
     199/*
     200 * only matches for a way which is a child of a relation with tags
     201 * type=route and route=foot
     202 */
     203relation[type=route][route=foot] > way {...}
     204}}}
     205
     206注释
     207* 缩放选择器和层标识符只适用于 > 符号右侧的部分。
     208* 函数''prop()''和''is_prop_set()''只支持 > 符号右侧的部分。
     209* 函数"'parent_tag'"和"'parent_tags'"(见下文)可用于访问父级标记。
     210* 为了与 MapCSS 0.2 标准兼容,也支持不带大于号 `>` 的 `relation[type=route][route=foot]方式 {/*...*/}`。但是,在这种情况下不能指定 [#LinkSelector 链接选择器]。
     211
     212=== 父选择器 ===
     213除了子选择器之外,JOSM 还支持'''父选择器'''的概念。请注意,父选择器是 MapCSS 在 JOSM 中的特定扩展,其它 MapCSS 实现中并不存在。
     214
     215与子选择器类似,父选择器只有在父对象和子对象都匹配时才会匹配。与子选择器不同的是,父选择器使用字符 <。
     216
     217与子选择器不同的是,父对象将被 "选中"。换句话说,`{{{...}}}`-声明块中的属性适用于"<"符号右侧的对象。
     218
     219示例如下:
     220{{{
     221#!mapcss
     222/*
     223 * matches for a highway which has at least one node tagged as traffic_calming=*
     224 */
     225node[traffic_calming] < way[highway] {...}
     226}}}
     227
     228=== 条件选择器 ===
     229选择器可以包含一组条件。如果其中任何一个条件求值为假,则选择器不匹配,样式规则也不会应用。
     230
     231'''属性条件'''指定 OSM 对象标签的条件。
     232
     233[=#condition_selector_operators]
     234{{{#!th valign=top
     235'''Operator'''
     236}}}
     237{{{#!th valign=top
     238'''Description'''
     239}}}
     240{{{#!th valign=top
     241'''Example'''
     242}}}
     243|-------------------------------------------------------------------------------
     244{{{#!td align=center valign=top
     245`=`
     246}}}
     247{{{#!td align=left valign=top
     248Exact match of the value.
     249}}}
     250{{{#!td align=left valign=top
     251{{{
     252#!mapcss
     253way[highway=residential]                    /* is case sensitive, i.e. does NOT match e.g. highway=Residential or Highway=residential   */
     254node[name="My name"]                        /* use quotes if key or value includes spaces                                               */
     255node["name:pl"="Królewiec"]                 /* use quotes if key or value includes special characters like colons or unicode characters */
     256}}}
     257}}}
     258|-------------------------------------------------------------------------------
     259{{{#!td align=center valign=top
     260`!=`
     261}}}
     262{{{#!td align=left valign=top
     263Value not equal
     264}}}
     265{{{#!td align=left valign=top
     266{{{
     267#!mapcss
     268way[highway!=residential]
     269node[name!="My name"]
     270node["name:pl"!="Królewiec"]
     271}}}
     272}}}
     273|-------------------------------------------------------------------------------
     274{{{#!td align=center valign=top
     275`<`, `>`, `<=`, `>=`
     276}}}
     277{{{#!td align=left valign=top
     278Comparison for numeric values.
     279
     280}}}
     281{{{#!td align=left valign=top
     282{{{
     283#!mapcss
     284node[population >= 50000]                   /* population greater than or equal to 50000 */
     285node[ele = 3000]                            /* elevation with exactly 3000 meters        */
     286}}}
     287}}}
     288|-------------------------------------------------------------------------------
     289{{{#!td align=center valign=top
     290`^=`
     291}}}
     292{{{#!td align=left valign=top
     293Prefix match
     294}}}
     295{{{#!td align=left valign=top
     296{{{
     297#!mapcss
     298node[name ^= "myprefix"]                    /* value starts with 'myprefix' */
     299}}}
     300}}}
     301|-------------------------------------------------------------------------------
     302{{{#!td align=center valign=top
     303`$=`
     304}}}
     305{{{#!td align=left valign=top
     306Postfix match
     307}}}
     308{{{#!td align=left valign=top
     309{{{
     310#!mapcss
     311node[name $= "mypostfix"]                   /* value ends with 'mypostfix' */
     312}}}
     313}}}
     314|-----------------------------------------------
     315{{{#!td align=center valign=top
     316`*=`
     317}}}
     318{{{#!td align=left valign=top
     319Substring match
     320}}}
     321{{{#!td align=left valign=top
     322{{{
     323#!mapcss
     324node[name *= "my substring"]                 /* value contains the substring 'my substring' */
     325}}}
     326}}}
     327|-------------------------------------------------------------------------------
     328{{{#!td align=center valign=top
     329`~=`
     330}}}
     331{{{#!td align=left valign=top
     332List membership
     333}}}
     334{{{#!td align=left valign=top
     335{{{
     336#!mapcss
     337*[vending~=stamps]                          /* the tag value for the tag 'vending' consists of a list of ;-separated values */
     338                                            /* and one of these values is 'stamps'                                          */
     339}}}
     340}}}
     341|-------------------------------------------------------------------------------
     342{{{#!td align=center valign=top
     343`=~`
     344}}}
     345{{{#!td align=left valign=top
     346[https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match
     347
     348}}}
     349{{{#!td align=left valign=top
     350{{{
     351#!mapcss
     352*[name=~/^My_pattern.*/]                    /* the value of the tag 'name' matches with the regular expression '^My_pattern.*' */
     353                                            /* Note, that reqular expressions have to be enclosed in /.../                     */
     354}}}
     355Case-insensitive matching can be enabled via the embedded flag expression `(?i)` (see [https://docs.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#CASE_INSENSITIVE Pattern.CASE_INSENSITIVE]).
     356{{{
     357#!mapcss
     358*[name =~ /^(?i)(parking)$/]                 /* matches parking, Parking, PARKING, PaRkInG,...      */
     359*[name =~ /^(?U)(\p{Lower})+$/]              /* name consists of only lower case unicode characters */
     360}}}
     361}}}
     362|-------------------------------------------------------------------------------
     363{{{#!td align=center valign=top
     364`!~` (since r6455)
     365}}}
     366{{{#!td align=left valign=top
     367negated [https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match
     368
     369}}}
     370{{{#!td align=left valign=top
     371{{{
     372#!mapcss
     373*[surface!~/paved|unpaved/]
     374}}}
     375}}}
     376|-------------------------------------------------------------------------------
     377{{{#!td align=center valign=top
     378`∈` ([https://www.fileformat.info/info/unicode/char/2208/index.htm U+2208], since r6609)
     379}}}
     380{{{#!td align=left valign=top
     381element of
     382
     383Matches when an object matches the right selector(s) contains at least one element which match the left selector(s).
     384}}}
     385{{{#!td align=left valign=top
     386{{{
     387#!mapcss
     388*[amenity=parking] ∈ area[amenity=parking] {
     389  throwWarning: tr("{0} inside {1}", "amenity=parking", "amenity=parking");
     390}
     391}}}
     392Finds areas with `amenity=parking` that contain at least one node or area with `amenity=parking`. Since r15064 this rule produces one warning for each element on the left when there are multiple matches.
     393}}}
     394|-------------------------------------------------------------------------------
     395{{{#!td align=center valign=top
     396`⊆` ([https://www.fileformat.info/info/unicode/char/2286/index.htm U+2286], since r15102)
     397}}}
     398{{{#!td align=left valign=top
     399Subset of or Equal To
     400
     401Synonym for `∈`.
     402}}}
     403{{{#!td align=left valign=top
     404{{{
     405#!mapcss
     406*[amenity=parking] ⊆ area[amenity=parking] {
     407  throwWarning: tr("{0} inside {1}", "amenity=parking", "amenity=parking");
     408}
     409}}}
     410
     411}}}
     412|-------------------------------------------------------------------------------
     413{{{#!td align=center valign=top
     414`⊇` ([https://www.fileformat.info/info/unicode/char/2287/index.htm U+2287], since r15102)
     415}}}
     416{{{#!td align=left valign=top
     417Superset of or Equal To
     418
     419Matches when an object matches the right selector(s) and is contained in one or more elements which match the left selectors.
     420}}}
     421{{{#!td align=left valign=top
     422{{{
     423#!mapcss
     424area[amenity=parking] ⊇ *[amenity=parking]
     425}}}
     426finds nodes or areas with `amenity=parking` inside areas with `amenity=parking`. Slower than `⊆` and thus not useful in validator rules, but can be useful in the search dialog.
     427}}}
     428|-------------------------------------------------------------------------------
     429{{{#!td align=center valign=top
     430`⊈` ([https://www.fileformat.info/info/unicode/char/2288/index.htm U+2288], since r15102)
     431}}}
     432{{{#!td align=left valign=top
     433Neither a Subset of nor Equal To
     434
     435Matches when an object matches the right selector(s) and does not contain any element which matches the left selectors.
     436}}}
     437{{{#!td align=left valign=top
     438{{{
     439#!mapcss
     440*[highway=street_lamp] ⊈ area:closed2[amenity=parking][lit=yes]
     441}}}
     442finds areas amenity=parking that have lit=yes but don't contain a lamp. Always add `:closed2` to avoid false positives as unclosed areas never contain something.
     443}}}
     444|-------------------------------------------------------------------------------
     445{{{#!td align=center valign=top
     446`⊉` ([https://www.fileformat.info/info/unicode/char/2289/index.htm U+2289], since r15102)
     447}}}
     448{{{#!td align=left valign=top
     449Neither a Superset of nor Equal To
     450
     451Matches when an object matches the right selector(s) and is not contained in any area which matches the left selectors.
     452}}}
     453{{{#!td align=left valign=top
     454{{{
     455#!mapcss
     456area[landuse=residential] ⊉ *[building]
     457}}}
     458finds buildings which are not inside any landuse=residential area. Note that this operator is likely to produce false positives when you have `landuse=residential`areas which don't match `:closed2`.
     459}}}
     460|-------------------------------------------------------------------------------
     461{{{#!td align=center valign=top
     462`⧉` ([https://www.fileformat.info/info/unicode/char/29c9/index.htm U+29C9], since r6613)
     463}}}
     464{{{#!td align=left valign=top
     465crossing
     466}}}
     467{{{#!td align=left valign=top
     468{{{
     469#!mapcss
     470area:closed:areaStyle ⧉ area:closed:areaStyle {
     471  throwOther: tr("Overlapping Areas");
     472}
     473}}}
     474takes `layer` tag into account if set (since r12986)
     475}}}
     476
     477Since r6554, it is possible to prefix the "value" (i.e., expression after the operator) with a `*` in order to "de-reference" it (i.e., obtain consider it as another key and obtain its value). Thus, `[key1 = *key2]` or `[key1=*key2]` compares the value of `key1` with the value of `key2`, and `[key =~ */pattern/]` considers the value of the key `pattern` as a regular expression and matches it against the value of `key`.
     478
     479In addition, you can test whether a tag is present or not:
     480
     481{{{#!th valign=top
     482'''Condition'''
     483}}}
     484{{{#!th valign=top
     485'''Example'''
     486}}}
     487|-------------------------------------------------------------------------------
     488{{{#!td align=left  valign=top
     489Presence of tag
     490}}}
     491{{{#!td align=left  valign=top   
     492{{{
     493#!mapcss
     494way[highway]                     /* matches any way with a tag 'highway' (is case sensitive)                                              */
     495way["name:fr"]                   /* use quotes if the tag name includes special caracters (white space, colons, unicode characters, etc.) */
     496}}}
     497}}}
     498|-------------------------------------------------------------------------------
     499{{{#!td align=left  valign=top
     500Absence of tag
     501}}}
     502{{{#!td align=left  valign=top   
     503{{{
     504#!mapcss
     505way[!highway]                     /* matches any way which does not have a tag 'highway' (is case sensitive)                               */
     506way[!"name:fr"]                   /* use quotes if the tag name includes special caracters (white space, colons, unicode characters, etc.) */
     507}}}
     508}}}
     509|-------------------------------------------------------------------------------
     510{{{#!td align=left  valign=top
     511Presence of tag by [https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match (since r6547)
     512}}}
     513{{{#!td align=left  valign=top   
     514{{{
     515#!mapcss
     516way[/^addr:/]                     /* matches any `addr:*` key */
     517}}}
     518}}}
     519|-------------------------------------------------------------------------------
     520{{{#!td align=left  valign=top
     521Absence of tag by Regular expression match
     522}}}
     523{{{#!td align=left  valign=top   
     524{{{
     525#!mapcss
     526way[!/^addr:/]                    /* matches any way which does not have a tag 'addr:*' */
     527}}}
     528}}}
     529
     530You can test whether the value of a tag is logical truth value. The value is evaluated to true, if it is either
     531"yes", "true", or "1". All other values are evaluated to false.
     532
     533{{{#!th valign=top
     534'''Condition'''
     535}}}
     536{{{#!th valign=top
     537'''Example'''
     538}}}
     539|-------------------------------------------------------------------------------
     540{{{#!td align=left  valign=top
     541Testing for truth value
     542}}}
     543{{{#!td align=left  valign=top   
     544{{{
     545#!mapcss
     546way[oneway?]                   /* matches any way with a truth value in the tag 'oneway' */
     547}}}
     548}}}
     549|-------------------------------------------------------------------------------
     550{{{#!td align=left  valign=top
     551Testing for false value (since r6513)
     552}}}
     553{{{#!td align=left  valign=top   
     554{{{
     555#!mapcss
     556way[oneway?!]                  /* matches any way with a false value in the tag 'oneway' */
     557}}}
     558}}}
     559
     560=== 境域选择器 === #境域选择器
     561您可以测试对象是位于特定区域内还是区域外。为此,JOSM 有一个内部数据库。您可以下载[source:/trunk/resources/data/boundaries.osm territories 文件]并在 JOSM 中打开[attachment:boundaries.png(截图预览)]来研究它。该文件包含世界上所有国家的边界。由于性能原因,边界被简化了。可根据要求对特殊情况进行细化。领土用[https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2 ISO_3166-1_alpha-2 代码]"标记"。美国、加拿大、中国、印度和澳大利亚的分区有额外的边界。请参阅以下示例了解如何使用领土选择器。领土选择器在 mappaint 风格中的作用较小,可能会占用大量资源。不过,它们在[wikitr:/Help/Validator/MapCSSTagChecker mapcss based validator rules]中的作用要大得多。要选择左侧交通或右侧交通的区域,有一个更简单的方法,请参阅 [#PseudoClasses 伪类]。有关此功能的主要实现,请参见 #10387。
     562
     563{{{
     564#!mapcss
     565                                      /* matches any node located …                             */
     566node[inside("FR")]                    /* … inside of France (includes the overseas territories) */
     567node[inside("FX")]                    /* … inside of Metropolitan France (i.e. only the
     568                                         mainland part with its near islands including Corse)   */
     569node[inside("EU")]                    /* … inside of the European Union                         */
     570node[inside("FR,DE")]                 /* … inside of France __OR__ inside of Germany            */
     571node[inside("US-FL")]                 /* … inside of the US state Florida                       */
     572
     573node[outside("FR")]                   /* … outside of France                                    */
     574node[outside("FR,DE")]                /* … outside of France __AND__ outside of Germany         */
     575node[inside("US")][outside("US-FL")]  /* … inside of the USA except the state Florida           */
     576}}}
     577
     578=== 链接选择器 ===#链接选择器
     579在子对象选择器中,可以对父对象和子对象之间的联系设置条件。
     580
     581如果父对象是一个关系,则可以为成员对象在该关系中的 "角色 "设置条件。
     582{{{
     583#!mapcss
     584relation[type=route] >[role="link"] way {  /* matches any way which is a member of route relation with role 'link' */
     585   color: blue;
     586}
     587}}}
     588
     589{{{#!th valign=top
     590'''Operator'''
     591}}}
     592{{{#!th valign=top
     593'''Description'''
     594}}}
     595{{{#!th valign=top
     596'''Example'''
     597}}}
     598|-------------------------------------------------------------------------------
     599{{{#!td align=center  valign=top
     600`=`
     601}}}
     602{{{#!td align=left  valign=top   
     603Exact match of the role name. The name `role` is compulsory in this context.
     604}}}
     605{{{#!td align=left  valign=top   
     606{{{
     607#!mapcss
     608relation >[role=residential] way           
     609relation >[role="My name"]   way           /* use quotes if the role value includes spaces or other special characters */
     610}}}
     611}}}
     612
     613The operators `!=`, `^=`, `$=`, `*=` and `~=` are supported too. Please refer to [#condition_selector_operators condition selector operators].
     614
     615Nodes in ways and members in relations are ordered. You can formulate conditions on the position of a node in a way or a member object in a relation. Positive numbers count from first to last element, negative numbers (since r8236) count from last to first element.
     616
     617{{{
     618#!mapcss
     619relation[type=route] >[index=1] way {  /* matches the first way which is a member of route relation  */
     620   color: blue;
     621}
     622
     623way >[index=-1] node {  /* matches the last node of a way  */
     624   symbol-stroke-color: green;
     625}
     626
     627way!:closed >[index=1] node!:connection,
     628way!:closed >[index=-1] node!:connection {  /* matches all single way end nodes */
     629   symbol-stroke-color: green;
     630}
     631}}}
     632
     633=== 缩放选择器 ===
     634您可以用'''缩放选择器'''来装饰类型选择器。缩放选择器限制了应用相应 MapCSS 规则的缩放级别范围。
     635||= '''示例1''' =||= '''示例2''' =||= '''示例3''' =||= '''说明''' =||
     636|| `way|z12 {...}` || `node|z12 {...}` || `node|z12[...] {...}` || 缩放级别为12 ||
     637|| `way|z13-15 {...}` || `node|z13-15 {...}` || `way|z13-15[...] {...}` ||缩放级别为13-15 ||
     638|| `way|z16- {...}` || `node|z16- {...}` || `node|z16-[...] {...}` || 缩放级别为16以上 ||
     639|| `way|z-12 {...}` || `node|z-12 {...}` || `node|z-12[...] {...}` || 缩放级别为12以下 ||
     640|| `way {...}` || `node{...}` || `way[...] {...}` || 所有缩放级别 ||
     641
     642每个缩放级别的比例范围的精确定义将来可能会改变。根据经验法则,当图像显示''n''级的滑动地图瓦片时,您的缩放级别大约为''n''级。
     643
     644=== 虚拟类 ===#虚拟类
     645See [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/ConditionFactory.PseudoClasses.html Javadoc] for the up-to-date list of pseudo classes supported by JOSM's MapCSS implementation.
     646
     647||= '''Class''' =||= '''Description''' =||
     648|| `:closed` || true for ways where the first node is the same as the last and for any (completely downloaded) multipolygon relation ||
     649|| `:closed2` || same as above, but this one ignores if a multipolygon is downloaded completely (since r9099) ||
     650|| `:completely_downloaded` || true for a relation whose members are all downloaded (since r9099) ||
     651|| `:new` || all new objects ||
     652|| `:connection` || true for nodes that are used by more than one way ||
     653|| `:unconnected` || true for nodes that are not used by any way (since r6687) ||
     654|| `:tagged` || What JOSM considers tagged, i.e. an object that with a tag key other than the following: `source*`, `source_ref`, `note`, `comment`, `converted_by`, `created_by`, `watch*`, `fixme`, `FIXME`, `description`, `attribution` (version r4008; in this list, `*` is a glob)
     655|| `:area-style` || true if the object has an area style ||
     656|| `:righthandtraffic` || true if there is right-hand traffic at the current location (since r7193); see [wikitr:/left-right-hand-traffic left-right-hand-traffic] for screenshot of areas ||
     657|| `:clockwise` || Whether the way is closed and oriented clockwise, or non-closed and the 1st, 2nd and last node are in clockwise order. ||
     658|| `:anticlockwise` || Whether the way is closed and oriented anticlockwise, or non-closed and the 1st, 2nd and last node are in anticlockwise order. ||
     659|| `:unclosed_multipolygon` || true for fully loaded unclosed multipolygon relations (since r8252) ||
     660|| `:open_end` || to select end nodes of unclosed multipolygon relations with `relation:unclosed_multipolygon >:open_end node` (since r8252) ||
     661|| `:in-downloaded-area` || true if an object is within source area and false if in the hatched area (since r8495). ||
     662|| `:selected` || true if an object is selected in the editor (since r9341). ||
     663|| `:highlighted` || true if the object is highlighted ||
     664|| `:modified` || changed and new objects (since r7193). ||
     665You can also negate pseudo classes. E.g. `!:new` for all old objects.
     666
     667=== 图层标识符 ===
     668图层可用于为一个对象创建多个样式。下面是一个例子:
     669{{{
     670#!mapcss
     671way[highway=secondary] {
     672    width: 3;
     673    color: yellow;
     674}
     675
     676way[highway=tertiary] {
     677    width: 2;
     678    color: orange;
     679}
     680
     681way[access][access!=yes]::non_public_access_layer {
     682    width: +2;
     683    color:red;
     684    dashes: 2;
     685    object-z-index:-1.0;
     686}
     687
     688way[bridge]::bridge_layer {
     689    width: +3;
     690    color:#000080;
     691    opacity:0.5;
     692    object-z-index:1.0;
     693}
     694}}}
     695This draws all secondary and tertiary roads in yellow and orange respectively. Any road with an access tag other than yes will get an extra line style below ('''`object-z-index:-1.0;`''') the main line. If that part of the street happens to be a bridge, it will also get a half transparent blue overlay. The relative width value ('''`width: +2;`''') refers to the width on the default layer (2 or 3 in this case).
     696
     697The name for the layer can be any identifier.
     698
     699If you omit the layer in the selector, this is the same as using `::default`.
     700
     701One more example:
     702{{{
     703#!mapcss
     704node[amenity=parking] {
     705    icon-image: "presets/vehicle/parking/parking.svg";    /* displays the josm internal parking icon in the default layer */
     706    text: ref;                                            /* displays the value of the key ref as text in the default layer */
     707}
     708
     709node[amenity=parking][fee=yes]::fee {
     710    icon-image: "presets/money/exchange.svg";             /* displays the josm internal exchange icon in the fee layer */
     711    icon-offset-x: 14;                                    /* shift the icon */
     712    icon-offset-y: -12;                                   /* shift the icon */
     713    text: charge;                                         /* displays the value of the key charge as text in the fee layer */
     714    text-offset-x: 16;                                    /* shift the text */
     715    text-offset-y: 17;                                    /* shift the text */
     716}
     717}}}
     718The result looks this way:
     719
     720[[Image(multiple_icons_and_texts.png,link=)]]
     721
     722In addition, you can use the * layer to override and initialize all layers. \\
     723It overrides all existing subparts, so
     724
     725{{{
     726#!mapcss
     727way::A { a; }
     728way::B { b; }
     729way::* { c; }  /* overrides all existing subparts */
     730}}}
     731is equivalent to
     732{{{
     733#!mapcss
     734way::A { a; }
     735way::B { b; }
     736way::A { c; } /* overrides a with c all existing subparts */
     737way::B { c; } /* overrides b with c all existing subparts */
     738}}}
     739And it initializes new subparts. In other words:
     740{{{
     741#!mapcss
     742way::* { a; }
     743way::A { b; }
     744}}}
     745is equivalent to
     746{{{
     747#!mapcss
     748way::A {}
     749way::* { a; }
     750way::A { b; }
     751}}}
     752which is in turn the same as
     753{{{
     754#!mapcss
     755way::A { a; }
     756way::A { b; }
     757}}}
     758or
     759{{{
     760#!mapcss
     761way::A { a; b; }
     762}}}
     763
     764=== 分组 ===
     765Rules with common declaration block can be grouped into one:
     766{{{
     767#!mapcss
     768area[landuse=forest] { color: green;   width: 2; }
     769area[natural=wood] { color: green;   width: 2; }
     770}}}
     771is the same as
     772{{{
     773#!mapcss
     774area[landuse=forest], area[natural=wood] { color: green;   width: 2; }
     775}}}
     776
     777=== 类别 ===
     778您可以为匹配的元素指定类别,并使用这些类别定义其他选择器:
     779
     780{{{
     781#!mapcss
     782/* assigning classes */
     783selector {
     784  set class;
     785  /* or equivalently */
     786  set .class;
     787}
     788
     789/* matching classes */
     790way.class, node[foo=bar].class {
     791  /* ... */
     792}
     793}}}
     794
     795
     796Example for assigning/matching a class named `path`:
     797{{{
     798#!mapcss
     799way[highway=footway] { set path; color: #FF6644; width: 2; }
     800way[highway=path]    { set path; color: brown; width: 2; }
     801way.path { text:auto; text-color: green; text-position: line; text-offset: 5; }
     802}}}
     803You can also negate classes. E.g. `way!.path` for all ways, which are not part of the class ''.path''.
     804
     805=== Classes and Layer together ===
     806If you want to use layer and classes together, please note that you have to identify the class via is_prop_set.
     807
     808{{{#!mapcss
     809node[railway=signal] { set sgnl; }
     810
     811/* it doesn't work */
     812node.sgnl::layer_signal_icon  { z-index: 1000; ... icon: icon/signal-icon.svg; ... }
     813node.sgnl::layer_signal_text  { z-index: 1010; ... text: concat("Name of signal: ", tag("ref")); ..... )
     814
     815/* use instead: is_prop_set("...", "default") */
     816node[is_prop_set("sgnl", "default")]::layer_signal_icon  { z-index: 1000; ... icon: icon/signal-icon.svg; ... }
     817node[is_prop_set("sgnl", "default")]::layer_signal_text  { z-index: 1010; ... text: concat("Name of signal: ", tag("ref")); ..... )
     818}}}
     819
     820=== @supports Conditional Processing  ===
     821@supports rules are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. This feature came with r8087. Example:
     822{{{
     823#!mapcss
     824@supports (min-josm-version: 9789) {
     825    way[highway] {
     826        width: 4;
     827        color: orange;
     828    }
     829    /* fancy new stuff */
     830    /* ... */
     831}
     832
     833@supports (max-josm-version: 9788) {
     834    way[highway] {
     835        width: 4;
     836        color: blue;
     837    }
     838    /* fall back mode, using more simple features */
     839    /* ... */
     840}
     841
     842@supports (icon-offset-x) {
     843    /* only if icon-offset-x property is supported */
     844    node[amenity] {
     845        icon-offset-x: 5;
     846    }
     847}
     848}}}
     849
     850The syntax closely matches the official [https://drafts.csswg.org/css-conditional/ css syntax]. The following conditions are supported:
     851
     852{{{#!th
     853'''Condition'''
     854}}}
     855{{{#!th
     856'''Description'''
     857}}}
     858|-
     859{{{#!td
     860(''<mapcsskey>'')
     861}}}
     862{{{#!td
     863Check if a certain mapcss key is supported, e.g. `repeat-image` or `icon-offset-x`.
     864}}}
     865|-
     866{{{#!td
     867(min-josm-version: ''<number>'')
     868}}}
     869{{{#!td
     870Only include `@supports` section when the current version of JOSM is greater than or equal to the specified number.
     871}}}
     872|-
     873{{{#!td
     874(max-josm-version: ''<number>'')
     875}}}
     876{{{#!td
     877Only include `@supports` section when the current version of JOSM is lower than or equal to the specified number.
     878}}}
     879|-
     880{{{#!td
     881(user-agent: ''<string>'')
     882}}}
     883{{{#!td
     884Only include `@supports` section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is `josm`.
     885}}}
     886
     887Conditions can be combined with `and`:
     888
     889{{{
     890#!mapcss
     891@supports (min-josm-version: 8087) and (max-josm-version: 8200) {
     892 /* only for JOSM versions 8087 to 8200 */
     893}
     894}}}
     895
     896Other logical operators like `or` and `not` can also be used. Parentheses are needed if you want to combine different logical operators:
     897
     898{{{
     899#!mapcss
     900@supports ((min-josm-version: 8087) and (max-josm-version: 8200)) or (user-agent: myEditor) {
     901  /* for JOSM version 8087 to 8200 and for the editor called "myEditor" */
     902}
     903}}}
     904
     905Since @supports rules are only supported in JOSM r8087 and later, you should also specify this as minimum JOSM version in the meta selector:
     906
     907{{{
     908#!mapcss
     909meta {
     910    min-josm-version: "8087"; /* This style uses @supports rules */
     911    /* ... */
     912}
     913}}}
     914
     915
     916== 样式设置 ==
     917[wikitr:/Help/Dialog/MapPaint/StyleSettings Styles settings] are used to provide the user settings to customize a mappaint style. The user can use them in the [wikitr:/Help/Dialog/MapPaint MapPaint dialog]. The following `type` of settings are available:
     918* `boolean` (since r7450)
     919* `double` (since r15731, see #10435)
     920* `string` (since r15731, see #10435)
     921* `color` (since r16843, see #10435)
     922
     923=== 布尔类型的设置 ===
     924Create a setting of type `boolean`:
     925{{{
     926#!mapcss
     927setting::highway_casing {
     928  type: boolean;
     929  label: tr("Draw highway casing");
     930  default: true;
     931}
     932}}}
     933
     934Use a setting of type `boolean`:
     935{{{
     936#!mapcss
     937way[highway][setting("highway_casing")] {
     938  casing-width: 2;
     939  casing-color: white;
     940}
     941}}}
     942
     943=== Settings of type `double` ===
     944Create a setting of type `double`:
     945{{{
     946#!mapcss
     947setting::place_font_size {
     948  type: double;
     949  label: tr("Set place name font size...");
     950  default: 11;
     951}
     952}}}
     953
     954Use a setting of type `double`:
     955{{{
     956#!mapcss
     957node.place, way.place, area.place {
     958  font-size: setting("place_font_size");
     959}
     960}}}
     961
     962=== 字符串类型的设置 ===
     963Create a setting of type `string`:
     964{{{
     965#!mapcss
     966setting::textdisplay {
     967  type: string;
     968  label: tr("key used for displaying");
     969  default: "name"; /* examples for usage: alt_name, old_name, addr:housename, ref, operator, ... */
     970}
     971}}}
     972
     973Use a setting of type `string`:
     974{{{
     975#!mapcss
     976way {
     977  text: tag(setting("textdisplay"));
     978}
     979}}}
     980
     981=== Settings of type `color` ===
     982Create a setting of type `color`. The `default` color can be any color as understood under [wikitr:/Help/Styles/MapCSSImplementation#Propertyvaluesexplanations Property values explanations]:
     983{{{
     984#!mapcss
     985setting::colordisplay {
     986  type: color;
     987  label: tr("key used for displaying");
     988  default: colorDisplayCustomPref#FF00FF;
     989}
     990}}}
     991
     992Use a setting of type `color`:
     993{{{
     994#!mapcss
     995way {
     996  color: setting("colordisplay");
     997}
     998}}}
     999
     1000=== 分组设置 ===
     1001Similar settings can be grouped together by defining ''settings groups'' (since r15289):
     1002
     1003{{{
     1004#!mapcss
     1005settings::my_group {
     1006  label: tr("my wonderful group");
     1007  icon: "my_beautiful_icon";
     1008}
     1009}}}
     1010
     1011标签是必须的,图标是可选的。
     1012
     1013一旦定义了一个设置组,就可以从属于该组的所有设置中引用它:
     1014
     1015{{{
     1016#!mapcss
     1017setting::hide_icons {
     1018  type: boolean;
     1019  label: tr("Hide icons at low zoom");
     1020  default: true;
     1021  group: "my_group";
     1022}
     1023}}}
     1024
     1025Settings groups are displayed as sub-menus from the style settings menu. If at least two settings belong to a group, a special "Toggle all settings" menu item allows to quickly switch on/off all settings from this group at once. Usage example: [wikitr:/Styles/MapWithAI MapWithAI].
     1026
     1027
     1028== 属性 ==# 属性
     1029=== 一般属性 ===
     1030
     1031||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1032|| `z-index` || Specify the order the objects are drawn: The objects with higher z-index are drawn on top of objects with lower z-index || ''Number'' (can be negative) ||  0  ||
     1033|| `major-z-index` || Similar to `z-index`, but it has higher priority than `z-index`. So if one object has a higher `major-z-index` than the other, it is drawn on top. If the `major-z-index` is the same, `z-index` decides. || ''Number'' (can be negative) || Depends on style element: area: 1, casing: 2, left-/right-casing: 2.1, line-pattern: 2.9, line: 3, point: 4, default-point: 4.1, line-text: 4.9, point-text: 5 ||
     1034|| `object-z-index` || Similar to `z-index`, but has lower priority. Controls the painting order for overlapping objects. E.g. for two crossing ways with text: Use `z-index` or `major-z-index` if you first want to draw the two lines and then the two captions. Use `object-z-index` if one of the ways should be completely on top of the other. || ''Number'' (can be negative) ||  0  ||
     1035|| `modifier` || Better control, whether a default line / node symbol is generated by JOSM. This happens when there is no proper style (`modifier=false`) found on any layer. || `false` or `true` || `false` for the default layer and `true` for any other layer ||
     1036
     1037Note that due to performance reasons the values for the three z-indexes are limited to 24 bit float values with max. 5 decimal digits. Currently the internal mappaint style uses values with max. 2 digits before and after the decimal separator. To avoid problems use values of z-indexes between -99.999 and +99.999. (See also #14485)
     1038
     1039=== Icon and symbol styles ===
     1040
     1041||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1042|| `icon-image` || The icon at node position. See also [wikitr:/Help/Styles/Images Images]. || ''Image'' ||  -  ||
     1043|| `icon-opacity` || Opacity of the icon image || ''Opacity'' ||  1.0  ||
     1044|| `icon-width` || Width of the icon. If only one of the properties `icon-width` and `icon-height` is given, the image will be scaled proportionally. The icon will keep the original size, if neither `icon-width` nor `icon-height` is set. || ''Number'' ||  -  ||
     1045|| `icon-height` || Height of the icon. (See `icon-width`) || ''Number'' ||  -  ||
     1046|| `icon-offset-x` || Shift the icon in horizontal direction (positive values to the right) (since r8085) || ''Number'' ||  0  ||
     1047|| `icon-offset-y` || Shift the icon in vertical direction (positive values downwards) (since r8085) || ''Number'' ||  0  ||
     1048|| `icon-rotation` || Rotate the icon clockwise or anti clockwise (negative value)(since r8260) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` ([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) \\ or a cardinal direction (e.g. `northeast` or `sw`); \\ or `way` to rotate the icon in the direction of the parent way. \\ See also the functions `degree_to_radians`, `cardinal_to_radians`. \\Since version 18678 function parent_way_angle() is an alternativ to way: e.g. {{{ way > node[...]::layer_x { ... icon-rotation: parent_way_angle(); ... } }}}  ||  -  ||
     1049|| `icon-position` || Define the position of the icon for areas. Same as `text-position` (since r11730). || `center`, `inside`, `line` ||  `center`  ||
     1050|| `symbol-shape` || Display a symbol at the position of the node || `square`, `circle`, `triangle`, `pentagon`, `hexagon`, `heptagon`, `octagon`, `nonagon`, `decagon` ||  -  ||
     1051|| `symbol-size` || Size of the symbol || ''Number'', can be relative ("+4") ||  10  ||
     1052|| `symbol-stroke-width` || outline stroke width || ''Width'' || 1.0 if `symbol-stroke-color` is set ||
     1053|| `symbol-stroke-color` || line color || ''Color'' || `#FFC800` if `symbol-stroke-width` is set ||
     1054|| `symbol-stroke-opacity` || line opacity || ''Opacity'' ||  1.0  ||
     1055|| `symbol-fill-color` || fill color for the shape || ''Color'' || `blue`, unless either `symbol-stroke-width` or `symbol-stroke-color` is set ||
     1056|| `symbol-fill-opacity` || fill opacity || ''Opacity'' ||  1.0  ||
     1057|| `text-...`, `font-...` ||||||  see general '''Text & Font properties''' ||
     1058
     1059Do not rely on the default values for `symbol-...` properties (except for `opacity`). They are intended for "quick & dirty" style sheets and should be set to an explicit value.
     1060
     1061=== Line styles ===#LineStyles
     1062||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1063|| `width` || Line width || ''Width'' ||  -  ||
     1064|| `color` || Line color || ''Color'' ||  value of `fill-color` or\\(if unset) JOSM's default \\untagged color (`#808080`) ||
     1065|| `opacity` || How transparent the line is. || ''Opacity'' ||  1.0  ||
     1066|| `dashes` || An array of alternating on/off lengths || list of numbers, e.g. \\> 15, 5 \\ \\may be written as expression: \\ > `list(3, 4, 5, 6)` \\ \\or the keyword `none` \\to turn dashes off ||  -  ||
     1067|| `dashes-offset` || shift the dash pattern by a certain amount || ''Number'' (>= 0) ||  0  ||
     1068|| `dashes-background-color` || The color to use in between the dashes (optional) || ''Color'' ||  -  ||
     1069|| `dashes-background-opacity` || Opacity value for the dashes background || ''Opacity'' ||  value of `opacity`  ||
     1070|| `linecap` || Shape at the end of the line (see [https://www.w3.org/TR/SVG/painting.html#StrokeLinecapProperty here]) || `none`, `round`, `square` ||  `none`  ||
     1071|| `linejoin` || Shape at the line corners || `round`, `miter`, `bevel` ||  `round`  ||
     1072|| `miterlimit` || Applies for `linejoin: miter`. \\Sets the maximum overshoot when line segments meet at a very small angle || ''Number'' (>= 1.0) ||  10.0  ||
     1073|| `offset` || Move line to the left or right (when looking in way direction). \\This could be used to draw multiple lanes for one way or mark left and right side of a way differently. || ''Number'' (positive value moves line to the left,\\negative to the right) ||  0  ||
     1074|| `text-position` || set to `line`, if text should be drawn along the line || `line`, `center` ||  -  ||
     1075|| `text-...`,\\`font-...` |||||| see general '''Text & Font properties  ||
     1076|| `repeat-image` || repeated image along a line ''(since r5801)'' || ''Image'' ||  -  ||
     1077|| `repeat-image-width` || Width of the image (optional, see `icon-width`) ''(since r5811)'' || ''Number'' ||  -  ||
     1078|| `repeat-image-height` || Height of the image (optional) ''(since r5811)'' || ''Number'' ||  -  ||
     1079|| `repeat-image-align` || Alignment of the image.\\Top-, bottom edge or the (horizontal) center line of the image will be along the line ''(since r5801)'' || `top`, `center`, `bottom` ||  `center`  ||
     1080|| `repeat-image-offset` || Offset from the line ''(since r5801)'' || ''Number'' ||  0  ||
     1081|| `repeat-image-spacing` || Spacing between repeated images ''(since r5801)'' || ''Number'' ||  0  ||
     1082|| `repeat-image-phase` || Initial spacing at the beginning of the line ''(since r5812)'' || ''Number'' ||  0  ||
     1083|| `repeat-image-opacity` || Opacity of the repeated image ''(since r16700)'' || ''Number'' ||  1.0  ||
     1084
     1085All these properties (except for `text-...` and `font-...`) exist also with the `casing-` prefix. The casing is a second independent line element, that is drawn below the normal line and can be used to draw a thin frame around the line in another color.
     1086||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1087|| `casing-width` || Width of the border on both sides of the main line. \\In JOSM < 5214: Total width of the casing || ''Width'' (revers to `width` if relative width is specified) ||  -  ||
     1088|| `casing-color` || Casing color || ''Color'' ||  value of `fill-color` or (if unset) \\JOSM's default untagged color (`#808080`) ||
     1089|| `casing-opacity` || How transparent the casing is. || ''Opacity'' ||  1.0  ||
     1090|| `casing-`... || ... || ... ||  ...  ||
     1091Similar to `casing-`, there is also the `left-casing-` and `right-casing-` prefix. It draws additional lines to the left and to the right of the main line.
     1092
     1093=== Area styles ===#AreaStyles
     1094||= '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1095|| `fill-color` || Color in which to fill the area. Until 11700, the alpha component was set to 50 to create a transparency effect. || ''Color'' ||  -  ||
     1096|| `fill-image` || Image pattern || ''Image'' ||  -  ||
     1097|| `fill-extent` || Set this property, to draw only the outline of the area. The number specifies, how far to fill from the border of the area towards the center. (If unset, the area will be filled completely) ''(since r9008)'' || ''Number'' ||  -  ||
     1098|| `fill-extent-threshold` || Set this property, to draw full area when the given percentage of coverage is reached. Can be greater than 100% as the covered area is estimated as **perimeter * extent**. || ''Number'' ||  -  ||
     1099|| `fill-opacity` || How transparent the fill is; applies to both color and image || ''Opacity'' || 0.2 ''(since r11700, 1.0 before that)'' \\(can be changed with the `mappaint.fillalpha` and \\`mappaint.fill-image-alpha` preferences)  ||
     1100|| `text-position` || set to `center`, if text should be drawn in the center of the area. Set to `inside` to place the text completely inside the area. ''(since r11722)'' || `line`, `center`, `inside` ||  -  ||
     1101|| `text-...`, `font-...` ||||||  see general text & font properties  ||
     1102Required properties to create an Area style: `fill-color` or `fill-image`
     1103
     1104=== Text & Font properties ===
     1105{{{#!th valign=top
     1106'''Key'''
     1107}}}
     1108{{{#!th valign=top
     1109'''Description'''
     1110}}}
     1111{{{#!th valign=top
     1112'''Value Format'''
     1113}}}
     1114{{{#!th valign=top
     1115'''Default Value'''
     1116}}}
     1117|-------------------------------------------------------------------------------
     1118{{{#!td align=left  valign=top
     1119`text` 
     1120}}}
     1121{{{#!td align=left  valign=top
     1122How to find the label text.\\No label is displayed, unless this instruction is present.
     1123}}}
     1124{{{#!td align=left  valign=top
     1125`auto`
     1126  Derive the text automatically. The default name tags are: "`name:`"+''<LANG>'', \\"`name`", "`int_name`", "`ref`", "`operator`", "`brand`" and "`addr:housenumber`".
     1127
     1128  Configure a list of tag names in the preference "`mappaint.nameOrder`" in order \\ to change this list. (After changing the list, a restart of JOSM is required.)
     1129
     1130''String''
     1131  Denotes the key of the tag whose value is used as text.
     1132
     1133''Expressions''
     1134  You can enter an expression to compute the text to be displayed. Examples:
     1135  * `eval("this is a static text")` - renderes a static text
     1136  * `eval(concat(tag("first"), "-", tag("second")))` - displays \\ the concatenated tags "first" and "second"
     1137
     1138`""`
     1139   To delete a previous set text.
     1140}}}
     1141{{{#!td align=center  valign=top
     1142-
     1143}}}
     1144|-------------------------------------------------------------------------------
     1145|| `text-color` || the text color || ''Color'' ||  `white` for lines and nodes,\\`#c0c0c0` for areas \\(JOSM "`text`" and "`areatext`"\\color preferences) ||
     1146|| `text-opacity` || how transparent the text is || ''Opacity'' ||  1.0  ||
     1147|| `text-offset-x` || shift the text horizontally, \\(not supported for text along line) || ''Number'' ||  0  ||
     1148|| `text-offset-y`\\(can also be written as\\`text-offset`)  || shift the text vertically, positive values shift the text in upwards direction  || ''Number'' ||  0  ||
     1149|| `text-halo-radius` || size of text background border \\(to make text visible on background \\with a similar color) || ''Number'' ||  -  ||
     1150|| `text-halo-color` || color of the text halo || ''Color'' ||  complement of the text color  ||
     1151|| `text-halo-opacity` || transparency for the text halo || ''Opacity'' ||  1.0  ||
     1152|| `text-anchor-horizontal` || horizontal text label placement || `left`, `center`, `right` ||  `right`  ||
     1153|| `text-anchor-vertical` || vertical text label placement || `above`, `top`, `center`, `bottom`, `below` ||  `bottom`  ||
     1154|| `text-rotation` || Rotate the text clockwise or anti clockwise (negative value)\\(since r16253) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` \\([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) or a cardinal direction (e.g. `northeast` or `sw`); \\ or `way` to rotate the text in the direction of the parent way. \\See also the functions `degree_to_radians`, `cardinal_to_radians`. \\Since version 18678 function parent_way_angle() is an alternativ to way: e.g. {{{ way > node[...]::layer_x { ... text-rotation: parent_way_angle(); ... } }}} \\(Note that the direction means where the upper edge of the text faces.\\That means with the default direction of north the text flows to east\\(with a left to right language). \\So if you want to flow it to e.g. south you need to set east.) ||  -  ||
     1155|| `text-position` |||||| see [#AreaStyles Area styles] and [#LineStyles Line styles] ||
     1156|| `font-family` || font family || ''String'' ||  "Droid Sans" \\(JOSM preference "`mappaint.font`")  ||
     1157|| `font-size` || font size || ''Number'' ||  8 \\(JOSM preference "`mappaint.fontsize`")  ||
     1158|| `font-weight` || bold or not || `bold`, `normal` ||  `normal`  ||
     1159|| `font-style` || italic or not || `italic`, `normal` ||  `normal`  ||
     1160
     1161=== User defined properties ===
     1162* In [wikitr:/Styles Mappaint styles] you can define any custom property, e.g.: `crc: CRC32_checksum(tag(name))/429496.7296;`
     1163* In [wikitr:/Rules Validator rules] they must be prefixed by a `-`, e.g.: `-osmoseItemClassLevel: "1210/1/1";`
     1164
     1165=== Property values explanations === #Propertyvaluesexplanations
     1166'' '''Width''' ''
     1167 - 14.0 (any positive number)
     1168 - `default` (use JOSM's default line width, which is 2, but can be configured)
     1169 - `thinnest` (draws the line as thin as possible)
     1170 - +3 (with plus sign in front) adds the amount to the width on the default layer. This applies only for styles that are not on the default layer, e.g. highlights. Another way to write this would be `prop("width","default")+3`. For `casing-width`, this refers to the `width` value on the same layer.
     1171
     1172'' '''Image''' ''
     1173 See [wikitr:/Help/Styles/Images].
     1174
     1175'' '''Color''' ''
     1176 * named color as found in [https://www.w3.org/TR/css3-color/#svg-color this] list
     1177 * html style: '''`#RRGGBB`''', '''`#RGB`''', '''`#RRGGBBAA`'''
     1178 * '''`rgb(/*r*/, /*g*/, /*b*/)`''' - rgb value with arguments from 0.0 to 1.0
     1179 * '''`rgba(/*r*/, /*g*/, /*b*/, /*alpha*/)`''' - rgb value with alpha
     1180 * '''`hsb_color(/*hue*/, /*saturation*/, /*brightness*/)`''' - color from HSB color space
     1181 * if the color is prefixed with a name and #, e.g. `color: highway_track#6e541c;` it will appear in the [wikitr:/Help/Preferences/ColorPreference Color Preference] and end users can adjust the color there themself
     1182
     1183'' '''Opacity''' ''
     1184 * from 0.0 (transparent) to 1.0 (opaque)
     1185
     1186'' '''String''' ''
     1187 * any character sequence, in quotes, e.g. `"images/fill.png"`. If the string is an identifier, quotes are optional. (Quote and backslash sign can be escaped.)
     1188
     1189'' '''Number''' ''
     1190 * integer or floating point (in simple form e.g. 0.3). In general can be negative, but most properties do not support negative numbers
     1191 * has a special meaning if you put a "+" sign in front (relative width)
     1192
     1193
     1194== Eval expressions ==#Evalexpressions
     1195See [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/Functions.html#method_summary Javadoc of Functions] for the up-to-date list of functions supported by JOSM's MapCSS implementation.
     1196
     1197 +, -, *, /::
     1198  arithmetic operations
     1199 ||, &&, !::
     1200  boolean operations
     1201 <, >, <=, >=, ==, !=::
     1202  comparison operators
     1203 asin, atan, atan2, ceil, cos, cosh, exp, floor, log, max, min, mod (since r17759), random, round, signum, sin, sinh, sqrt, tan, tanh::
     1204  the usual meaning, [https://download.oracle.com/javase/8/docs/api/java/lang/Math.html details]
     1205 cond(b, fst, snd)::
     1206 b ? fst : snd::
     1207  if ('''b''') then '''fst''' else '''snd'''
     1208 list(a, b, ...)::
     1209  create list of values, e.g. for the `dashes` property
     1210 get(lst, n)::
     1211  get the ''n''th element of the list ''lst'' (counting starts at 0) [''since r5699'']
     1212 split(sep, str)::
     1213  splits string ''str'' at occurrences of the separator string ''sep'', returns a list [''since r5699'']
     1214 prop(''p_name'')::
     1215  value of the property ''p_name'' of the current layer, e.g. prop(`"width"`)
     1216 prop(''p_name'', ''layer_name'')::
     1217  property from the layer ''layer_name''
     1218 is_prop_set(''p_name'')::
     1219  true, if property ''p_name'' is set for the current layer
     1220 is_prop_set(''p_name'', ''layer_name'')::
     1221  true, if property ''p_name'' is set for the layer ''layer_name''
     1222 tag(''key_name'')::
     1223  get the value of the key ''key_name'' from the object in question
     1224 parent_tag(''key_name'')::
     1225  get the value of the key ''key_name'' from the object's parent
     1226 parent_tags(''key_name'')::
     1227  returns all parent's values for the key ''key_name'' as a list ordered by a natural ordering [''since r8775'']
     1228 has_tag_key(''key_name'')::
     1229  true, if the object has a tag with the given key
     1230 rgb(''r'', ''g'', ''b'')::
     1231  create color value (arguments from 0.0 to 1.0)
     1232 hsb_color(''h'', ''s'', ''b'')::
     1233  create color from hue, saturation and brightness (arguments from 0.0 to 1.0) [''since r6899'']
     1234 red(''clr''), green(''clr''), blue(''clr'')::
     1235  get value of color channels in rgb color model
     1236 alpha(''clr'')::
     1237  get the alpha value of the given color [''since r6749'']
     1238 length(''str'')::
     1239  length of a string
     1240 count(''lst'')::
     1241  length of a list, i.e., counts its elements [''since r7162'']
     1242 length(''lst'')::
     1243  length of a list ([''since r5699''] – deprecated ''since r7162''
     1244 any(obj1, obj2, ...)::
     1245  returns the first object which is not null (formerly coalesce, [''since r7164''])
     1246 concat(''str1'', ''str2'', ...)::
     1247  assemble the strings to one
     1248 join(''sep'', ''str1'', ''str2'', ...)::
     1249  join strings, with ''sep'' as separator [''since r6737'']
     1250 join_list(''sep'', ''list_name'')::
     1251   joins the elements of the list ''list_name'' to one string separated by the separator ''sep'' [''since r8775'']
     1252 upper(''str'')::
     1253   converts string to upper case [''since r11756'']
     1254 lower(''str'')::
     1255   converts string to lower case [''since r11756'']
     1256 title(''str'')::
     1257   converts string to title case [''since r17613''] (`"i am FINE"` → `"I Am Fine"`)
     1258 trim(''str'')::
     1259   remove leading and trailing whitespace from string [''since r11756'']
     1260 trim_list(''list_name'')::
     1261   remove leading and trailing whitespace from a list of strings, will remove entries that are empty afterwards [''since r15591'']
     1262 JOSM_search("...")::
     1263  true, if JOSM search applies to the object
     1264 tr(str, arg0, arg1, ...)::
     1265  translate from English to the current language (only for strings in the JOSM user interface) [''since r6506'']
     1266 regexp_test(regexp, string)::
     1267  test if ''string'' matches pattern ''regexp'' [''since r5699'']
     1268 regexp_test(regexp, string, flags)::
     1269  test if ''string'' matches pattern ''regexp''; flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since r5699'']
     1270 regexp_match(regexp, string)::
     1271  Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. [''since r5701'']
     1272 regexp_match(regexp, string, flags)::
     1273  Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. Flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since r5701'']
     1274 substring(str, idx)::
     1275  return the substring of ''str'', starting at index ''idx'' (0-indexed) [''since r6534'']
     1276 substring(str, start, end)::
     1277  return the substring of ''str'', starting at index ''start'' (inclusive) up to ''end'' (exclusive) (0-indexed) [''since r6534'']
     1278 replace(string, old, new)::
     1279   Replaces any occurrence of the substring ''old'' within the string ''string'' with the text ''new''
     1280 osm_id()::
     1281  returns the OSM id of the current object [''since r5699'']
     1282 osm_user_name()::
     1283  returns the OSM user name who last touched the current object [''since r15246'']
     1284 osm_user_id()::
     1285  returns the OSM user id who last touched the current object [''since r15246'']
     1286 osm_version()::
     1287  returns the OSM version number of the current object [''since r15246'']
     1288 osm_changeset_id()::
     1289  returns the id of the changeset the current object was last uploaded to [''since r15246'']
     1290 osm_timestamp()::
     1291  returns the time of last modification to the current object, as timestamp [''since r15246'']
     1292 parent_osm_id()::
     1293  returns the OSM id of the object's parent (matched by child selector) [''since r13094'']
     1294 URL_encode(str)::
     1295  [https://en.wikipedia.org/wiki/Percent-encoding percent-encode] a string. May be useful for data URLs [''since r6805'']
     1296 URL_decode(str)::
     1297  [https://en.wikipedia.org/wiki/Percent-encoding percent-decode] a string. [''since r11756'']
     1298 XML_encode(str)::
     1299  escape special characters in xml. E.g. `<` becomes `&lt;`, other special characters: `>`, `"`, `'`, `&`, `\n`, `\t` and `\r` [''since r6809'']
     1300 CRC32_checksum(''str'')::
     1301  calculate the CRC32 checksum of a string (result is an integer from 0 to 2^32^-1) [''since r6908'']
     1302 is_right_hand_traffic()::
     1303  Check if there is left-hand or right-hand traffic at the current location. [''since r7193'']
     1304 number_of_tags()::
     1305  returns the number of tags for the current OSM object [''since r7237'']
     1306 print(o)::
     1307  prints a string representation of `o` to the command line (for debugging) [''since r7237'']
     1308 println(o)::
     1309  prints a string representation of `o` to the command line, followed by a new line (for debugging) [''since r7237'']
     1310 JOSM_pref(''key'', ''default'')::
     1311  Get value from the JOSM advanced preferences. This way you can offer certain options to the user and make the style customizable. It works with strings, numbers, colors and boolean values. \\[This function exists since version r3856, but with some restrictions. `JOSM_pref` always returns a string, but in version r7237 and earlier, the automatic conversion of string to boolean and color was not working. You can use the following workarounds for boolean values and color in version r7237 and earlier: `cond(JOSM_pref("myprefkey", "true")="true", "X", "O")` and `html2color(JOSM_pref("mycolor", "#FF345611"))`. These explicit conversions should be no longer necessary in version r7238 and later. Automatic conversion to a number works in any version. Furthermore, in version r16590, can be used to set color properties. So `* { set_color: JOSM_pref("pref", #000000); }` will create a color property now.]
     1312 setting()::
     1313  to use a [wikitr:/Help/Styles/MapCSSImplementation#Stylesettings style setting] [''since r7450'']
     1314 degree_to_radians()::
     1315  returns a in degree given direction in radians [''since r8260'']
     1316 cardinal_to_radians()::
     1317  returns a cardinal direction in radians [''since r8260'']
     1318 waylength()::
     1319  returns the length of the way in metres [''since r8253'']
     1320 areasize()::
     1321  returns the area of a closed way in square meters [''since r8253'']
     1322 at(lat,lon)::
     1323  returns true if the object centroid lies at given ''lat''/''lon'' coordinates, e.g. to check for nodes at "null island" `node[at(0.0,0.0)]` [''since r12514'']
     1324 is_similar(''str1'', ''str2'')::
     1325  returns true if the two strings are similar, but not identical, i.e., have a Levenshtein distance of 1 or 2. Example: `way[highway][name][is_similar(tag(name), "Main Street")]` checks for streets with a possible typo in the name (e.g. Main Streeg). [''since r14371'']
     1326 gpx_distance()::
     1327  returns the lowest distance between the OSM object and a GPX point [''since r14802'']
     1328 count_roles()::
     1329  returns the number of primitives in a relation with the specified roles [''since r15275'']
     1330 sort(''str1'', ''str2'', ''str3'', ''...'')::
     1331  sorts an array of strings [''since r15279'']
     1332 sort_list()::
     1333  sorts a list of strings [''since r15279'']
     1334 tag_regex(''regex'')::
     1335  returns a list of values that match the regex [''since r15317'']
     1336 to_boolean(''str'')::
     1337  returns the string argument as a boolean [''since r16110'']
     1338 to_byte(''str'')::
     1339  returns the string argument as a byte [''since r16110'']
     1340 to_short(''str'')::
     1341  returns the string argument as a short [''since r16110'']
     1342 to_int(''str'')::
     1343  returns the string argument as a int [''since r16110'']
     1344 to_long(''str'')::
     1345  returns the string argument as a long [''since r16110'']
     1346 to_float(''str'')::
     1347  returns the string argument as a float [''since r16110'']
     1348 to_double(''str'')::
     1349  returns the string argument as a double [''since r16110'']
     1350 uniq(''str1'', ''str2'', ''str3'', ''...'')::
     1351  returns a list of strings that only have unique values from an array of strings [''since r15323'']
     1352 uniq_list()::
     1353  returns a list of strings that only have unique values from a list of strings [''since r15353'']
     1354 parent_way_angle()::
     1355  returns the angle of the parent way as a double in rad [''since r18678''] (see: text-rotation or icon-rotation)
     1356 convert_primitive_to_string(''PrimitiveId'')::
     1357  returns the primitive id as a string [''since r18829'']
     1358 convert_primitives_to_string(''PrimitiveId'', ''PrimitiveId'', ''...'')::
     1359  returns a list of primitive ids converted to strings [''since r18829'']
     1360 parent_osm_primitives(''optional key'', ''optional value'')::
     1361  returns a list of primitive ids which match the key and value (if present) [''since r18829'']
     1362
     1363=== Examples ===
     1364* circle symbol for house number with size depending of the number of digits
     1365{{{
     1366#!mapcss
     1367node[addr:housenumber] {
     1368    symbol-shape: circle;
     1369    symbol-size: eval((min(length(tag("addr:housenumber")), 3) * 5) + 3);
     1370    symbol-fill-color: #B0E0E6;
     1371
     1372    text: "addr:housenumber";
     1373    text-anchor-horizontal: center;
     1374    text-anchor-vertical: center;
     1375    text-offset-x: -1;
     1376    text-offset-y: -1; }
     1377   
     1378node[addr:housenumber]::hn_casing {
     1379    z-index: -100;
     1380    symbol-shape: circle;
     1381    symbol-size: +2;
     1382    symbol-fill-color: blue;
     1383}
     1384}}}
     1385* invert colors
     1386{{{
     1387#!mapcss
     1388*::* {
     1389    color: eval(rgb(1 - red(prop(color)), 1 - green(prop(color)), 1 - blue(prop(color))));
     1390    fill-color: eval(rgb(1 - red(prop(fill-color)), 1 - green(prop(fill-color)), 1 - blue(prop(fill-color))));
     1391}
     1392}}}
     1393* random stuff
     1394{{{
     1395#!mapcss
     1396way {
     1397    width: eval(random() * 20);
     1398    color: eval(rgb(random(), random(), random()));
     1399}
     1400}}}
     1401
     1402* regexp matching example: change "nameXXXsubname" to "name::subname"
     1403{{{
     1404#!mapcss
     1405*[name=~/.+XXX.+/]
     1406{
     1407    _match: regexp_match("(.+?)XXX(.+)", tag("name"));
     1408    text: concat(get(prop("_match"),1), "::", get(prop("_match"),2));
     1409}
     1410}}}
     1411
     1412* paint buildings in different colors according to street in the address tags
     1413{{{
     1414#!mapcss
     1415area[building][addr:street] {
     1416    fill-color: hsb_color(CRC32_checksum(tag("addr:street"))/4294967296.0, 0.9, 0.7);
     1417    fill-opacity: 0.8;
     1418}
     1419}}}
     1420
     1421* casing on inside of area
     1422{{{
     1423#!mapcss
     1424area[building]:clockwise {
     1425    right-casing-width: 10;
     1426}
     1427area[building]:anticlockwise {
     1428    left-casing-width: 10;
     1429}
     1430/* or */
     1431area[building][is_clockwise()] {
     1432    right-casing-width: 10;
     1433}
     1434area[building][is_anticlockwise()] {
     1435    left-casing-width: 10;
     1436}
     1437}}}
     1438
     1439* case insensitive selector. This matches: `Name=Main Street`, but also `naMe=MAIN STREET`
     1440{{{
     1441#!mapcss
     1442way[/(?i)^name$/ =~ /(?i)^Main Street$/] {
     1443}
     1444}}}
     1445
     1446
     1447== Compatibility notes ==
     1448=== MapCSS 0.2 ===
     1449==== Grammar ====
     1450 * `way[oneway=yes]` does not have any magic, you can use `way[oneway?]` instead
     1451 * no `@import`
     1452 * JOSM does not require `eval(...)` to be wrapped around expressions, but for compatibility with other MapCSS implementations you should write it out.
     1453
     1454==== Properties ====
     1455At the moment, JOSM does ''not'' support the following properties:
     1456 line: ::
     1457  `image`
     1458 label: ::
     1459  `font-variant, text-decoration, text-transform, max-width`
     1460 shield: ::
     1461  not supported
     1462
     1463=== Halcyon (Potlatch 2) ===
     1464 * Text label is placed in the center of the icon. For compatibility with Halcyon put
     1465{{{
     1466#!mapcss
     1467node { text-anchor-vertical: center; text-anchor-horizontal: center; }
     1468}}}
     1469 at the beginning of your style sheet.
     1470 * standard z-index in Halcyon is 5, but it is 0 in JOSM
     1471 * '''`image: circle;`''' corresponds to '''`symbol-shape: circle;`'''
     1472
     1473=== Kothic ===
     1474 * Kothic has support for eval, which probably differs from JOSM's eval.
     1475 * Kothic understands units, whereas JOSM always calculates in pixel.
     1476 * The extrusion features are not available in JOSM.
     1477
     1478=== Ceyx ===
     1479 * seems to have `[tunnel=1]` instead of `[tunnel=yes]` (Halcyon) or `[tunnel?]` (JOSM)
     1480
     1481
     1482== Media queries (deprecated) ==
     1483
     1484{{{#!td style="background-color: #faa"
     1485Note: media queries are deprecated. You should use @supports rules instead (see above).
     1486}}}
     1487Media queries are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. This feature came with r6970. Example:
     1488{{{
     1489#!mapcss
     1490@media (min-josm-version: 9789) {
     1491    way[highway] {
     1492        width: 4;
     1493        color: orange;
     1494    }
     1495    /* fancy new stuff */
     1496    /* ... */
     1497}
     1498
     1499@media (max-josm-version: 9788) {
     1500    way[highway] {
     1501        width: 4;
     1502        color: blue;
     1503    }
     1504    /* fall back mode, using more simple features */
     1505    /* ... */
     1506}
     1507}}}
     1508
     1509The syntax closely matches the official [https://www.w3.org/TR/css3-mediaqueries/#syntax css syntax]. The following conditions are supported:
     1510
     1511{{{#!th
     1512'''Media condition'''
     1513}}}
     1514{{{#!th
     1515'''Description'''
     1516}}}
     1517|-
     1518{{{#!td
     1519(min-josm-version: ''<number>'')
     1520}}}
     1521{{{#!td
     1522Only include `@media` section when the current version of JOSM is greater than or equal to the specified number.
     1523}}}
     1524|-
     1525{{{#!td
     1526(max-josm-version: ''<number>'')
     1527}}}
     1528{{{#!td
     1529Only include `@media` section when the current version of JOSM is lower than or equal to the specified number.
     1530}}}
     1531|-
     1532{{{#!td
     1533(user-agent: ''<string>'')
     1534}}}
     1535{{{#!td
     1536Only include `@media` section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is `josm`.
     1537}}}
     1538
     1539Conditions can be combined with `and`:
     1540
     1541{{{
     1542#!mapcss
     1543@media (min-josm-version: 6970) and (max-josm-version: 7014) {
     1544 /* only for JOSM versions 6970 to 7014 */
     1545}
     1546}}}
     1547
     1548Multiple combined conditions can be chained with a comma (logical ''or''):
     1549
     1550{{{
     1551#!mapcss
     1552@media (min-josm-version: 6970) and (max-josm-version: 7014), (user-agent: myEditor) {
     1553  /* for JOSM version 6970 to 7014 and for the editor called "myEditor" */
     1554}
     1555}}}
     1556
     1557Since media queries are only supported in JOSM 6970 and later, you should also specify this as minimum JOSM version in the meta selector:
     1558
     1559{{{
     1560#!mapcss
     1561meta {
     1562    min-josm-version: "6970"; /* This style uses media queries */
     1563    /* ... */
     1564}
     1565}}}
     1566
     1567
     1568{{{#!comment
     1569There is also the `not` keyword (see the linked css doc for details).
     1570This is implemented, but probably not very useful. Feel free to add documentation.
     1571}}}