gitlab html 在线预览,HTML style guide
HTML style guide
Semantic elements
Semantic elements are HTML tags that
give semantic (rather than presentational) meaning to the data they contain. For example:
Prefer using semantic tags, but only if the intention is truly accurate with the semantic meaning
of the tag itself. View the MDN documentation
for a description on what each tag semantically means.
Simply visit your Settings to say hello to the world.
Simply visit your Settings to say hello to the world.
...
Buttons
Button type
Button tags requires a type attribute according to the W3C HTML specification.
// bad
// good
Links
Blank target
Avoid forcing links to open in a new window as this reduces the control the user has over the link.
However, it might be a good idea to use a blank target when replacing the current page with
the link makes the user lose content or progress.
Use rel="noopener noreferrer" whenever your links open in a new window, i.e. target="_blank". This prevents a security vulnerability documented by JitBit.
When using gl-link, using target="_blank" is sufficient as it automatically adds rel="noopener noreferrer" to the link.
// bad
// good
// good
Fake links
Do not use fake links. Use a button tag if a link only invokes JavaScript click event handlers, which is more semantic.
// bad
// good