ตระกูลฟอนต์อินพุตกระดาษสำหรับชุดโพลีเมอร์

  .input-content ::content input,
  .input-content ::content textarea,
  .input-content ::content iron-autogrow-textarea,
  .input-content ::content .paper-input-input {
    position: relative; /* to make a stacking context */
    outline: none;
    box-shadow: none;
    padding: 0;
    width: 100%;
    max-width: 100%;
    background: transparent;
    border: none;
    color: var(--paper-input-container-input-color, --primary-text-color);
    -webkit-appearance: none;
    text-align: inherit;
    @apply(--paper-font-subhead);
    @apply(--paper-input-container-input);
  }

paper-styles/วิชาการพิมพ์.html:

--paper-font-common-base: {
  font-family: 'Roboto', 'Noto', sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* [...] */

--paper-font-subhead: {
  @apply(--paper-font-common-base);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
};

อย่างไรก็ตาม คำนำหน้า -0 เป็นเพียงดัชนีเท่านั้น หากคุณมีองค์ประกอบโพลีเมอร์ที่เป็นประเภทเดียวกันสองรายการ องค์ประกอบนั้นจะใส่ -0 นำหน้าองค์ประกอบแรกและ -1 นำหน้าองค์ประกอบที่สอง ฉันไม่แน่ใจ แต่ฉันเดาว่าพวกเขาถูกแปลเป็นตัวเลือก CSS โดยใช้ updateStyles เนื่องจากคุณสามารถปรับแต่งแต่ละรายการแยกกันผ่าน JavaScript ได้ ดังนั้นจึงช่วยตั้งชื่อแต่ละองค์ประกอบแยกกันในขณะที่แปลคำหลัก :root และ ::content

ดังนั้น หากคุณต้องการเขียนทับองค์ประกอบเฉพาะนี้ ฉันจะบอกให้คุณใช้คำนำหน้า -0 มิฉะนั้นให้ใช้คลาสหรือองค์ประกอบทั่วไปมากขึ้นเพื่อเลือกอย่างเหมาะสมด้วยวิธีทั่วไป