{"id":18,"date":"2023-10-04T02:58:07","date_gmt":"2023-10-04T02:58:07","guid":{"rendered":"http:\/\/dev.themariners.hk\/?page_id=18"},"modified":"2023-10-04T02:58:11","modified_gmt":"2023-10-04T02:58:11","slug":"%e6%a8%a3%e5%bc%8f%e6%8c%87%e5%8d%97","status":"publish","type":"page","link":"https:\/\/themariners.hk\/zh-hant\/%e6%a8%a3%e5%bc%8f%e6%8c%87%e5%8d%97\/","title":{"rendered":"\u6a23\u5f0f\u6307\u5357"},"content":{"rendered":"
\n
\n
\n
\n

Preview<\/h2>\n <\/div>\n
\n

Change the preview content by updating the following field.<\/p>\n \n

\n Useful links: Lorem Ipsum<\/a> and Chinese Lorum Ipsum<\/a>.\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n\n

\n
\n
\n

Body<\/h2>\n <\/div>\n <\/div>\n
\n
body<\/div>\n
\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.\n <\/div>\n <\/div>\n <\/div>\n
\n
\n
\n

Class<\/h2>\n <\/div>\n <\/div>\n
\n
.type-h1<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h2<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h3<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h4<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h5<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h6<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-h7<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-subtitle-large-1<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-subtitle-large-2<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-subtitle-medium-1<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-subtitle-medium-2<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-subtitle-small<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-400<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-600<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-link<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-caption-400<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-caption-500<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-small-400<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-small-500<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-body-quote<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-button-regular<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-button-small<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-form<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-menu-l1<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-footer-h1<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-footer-body<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n
\n
.type-appendix<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n
\n

Tag<\/h2>\n <\/div>\n <\/div>\n
\n
h1<\/div>\n
\n

Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h1>\n <\/div>\n <\/div>\n
\n
h2<\/div>\n
\n

Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h2>\n <\/div>\n <\/div>\n
\n
h3<\/div>\n
\n

Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h3>\n <\/div>\n <\/div>\n
\n
h4<\/div>\n
\n

Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h4>\n <\/div>\n <\/div>\n
\n
h5<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h5>\n <\/div>\n <\/div>\n
\n
h6<\/div>\n
\n
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/h6>\n <\/div>\n <\/div>\n
\n
small<\/div>\n
\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/small>\n <\/div>\n <\/div>\n
\n
strong<\/div>\n
\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto animi, odio veniam reiciendis fugiat repudiandae ad molestias? Nam quidem ad esse quo officia, vel doloremque quaerat, totam placeat rem numquam.<\/strong>\n <\/div>\n <\/div>\n <\/div>\n \n \n
\n
\n
\n

Breakpoints Checker<\/h2>\n

\n Remark: Resize your browser to check which breakpoint's style has been applied\n <\/h4>\n <\/div>\n <\/div>\n
\n
\n
\n Current Breakpoint:\n xs<\/span>\n sm<\/span>\n md<\/span>\n xm<\/span>\n ml<\/span>\n lg<\/span>\n xl<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n
\n
\n
\n

Container's width Checker<\/h2>\n

\n Remark: Resize your browser to check the maximum width of different breakpoints\n <\/h4>\n <\/div>\n <\/div>\n
\n
\n
\n Current Browser width: <\/span>
\n Container width: <\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n
\n
\n

Grid Columns<\/h2>\n

Remark: The gutter has marked in yellow<\/h4>\n <\/div>\n <\/div>\n\n
\n
\n
col-1<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-2<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-3<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-4<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-5<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-6<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-7<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-8<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-9<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-10<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-11<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-12<\/div>\n <\/div>\n <\/div>\n \n \n
\n
\n

Grid Offset<\/h2>\n

Remark: The gutter has marked in yellow<\/h4>\n <\/div>\n <\/div>\n\n
\n
\n
offset-0<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-1<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-2<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-3<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-4<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-5<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-6<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-7<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-8<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-9<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-10<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-11<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n
\n
\n
\n

Container's width Checker (fluid)<\/h2>\n

\n Remark: Resize your browser to check the maximum width of different breakpoints\n <\/h4>\n <\/div>\n <\/div>\n
\n
\n
\n Current Browser width: <\/span>
\n Container width: <\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n
\n
\n

Grid Columns<\/h2>\n

Remark: The gutter has marked in yellow<\/h4>\n <\/div>\n <\/div>\n\n
\n
\n
col-1<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-2<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-3<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-4<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-5<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-6<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-7<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-8<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-9<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-10<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-11<\/div>\n <\/div>\n <\/div>\n
\n
\n
col-12<\/div>\n <\/div>\n <\/div>\n \n \n
\n
\n

Grid Offset<\/h2>\n

Remark: The gutter has marked in yellow<\/h4>\n <\/div>\n <\/div>\n\n
\n
\n
offset-0<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-1<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-2<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-3<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-4<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-5<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-6<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-7<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-8<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-9<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-10<\/div>\n <\/div>\n <\/div>\n
\n
\n
offset-11<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n
\n
\n
\n

Colours<\/h2>\n <\/div>\n <\/div>\n\n
\n
\n
<\/div>\n

ocean-blue<\/p>\n <\/div>\n

\n
<\/div>\n

white<\/p>\n <\/div>\n

\n
<\/div>\n

warm-sand<\/p>\n <\/div>\n

\n
<\/div>\n

light-blue<\/p>\n <\/div>\n

\n
<\/div>\n

sky-blue<\/p>\n <\/div>\n

\n
<\/div>\n

light-grey<\/p>\n <\/div>\n

\n
<\/div>\n

mid-grey<\/p>\n <\/div>\n

\n
<\/div>\n

red<\/p>\n <\/div>\n

\n
<\/div>\n

black<\/p>\n <\/div>\n

\n
<\/div>\n

black-variant1<\/p>\n <\/div>\n

\n
<\/div>\n

black-variant2<\/p>\n <\/div>\n

\n
<\/div>\n

black-variant3<\/p>\n <\/div>\n <\/div>\n <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-18","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/pages\/18","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/comments?post=18"}],"version-history":[{"count":1,"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/pages\/18\/revisions"}],"predecessor-version":[{"id":19,"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/pages\/18\/revisions\/19"}],"wp:attachment":[{"href":"https:\/\/themariners.hk\/zh-hant\/wp-json\/wp\/v2\/media?parent=18"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}