javascript - Vue.js 2, Using custom component tag names in css? -


<template>     <header>         <hamburger></hamburger>         <app-title></app-title>         <lives></lives>     </header> </template>  <script> export default {     name: 'titlebar',     data() {         return {          }     } } </script>  <style lang="scss" scoped>     @import "../styles/variables";      header {         padding: $padding-titlebar;         position: relative;     }     lives {         position: absolute;         right: 2.5vh;     } </style> 

is possible use component tags regular html tag styling purposes i've written down there in lives { }?
see that writing <lives class="lives"> , using .lives { } in css works seems kinda redundant, rather ommit adding aditional classes if it's possible use component tag.
understand vue compiles <lives> html code , there no "lives" tag css use after it's compiled, still wondering.

vue component's name has no relationship css rule, it's template does.

vue component has template property, contains html tag. , also, can use custom html tag in template. example:

template: `<lives class="lives">{{a}}</lives>` 

so can define css rule lives tag.


Comments

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

python Tkinter Capturing keyboard events save as one single string -

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -