You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
< docs >
-- -
order : 2
title :
zh - CN : 白底模式
en - US : white background mode
-- -
# # zh - CN
默认 PageHeader 是透明底色的 。 在某些情况下 , PageHeader 需要自己的背景颜色 。
# # en - US
The default PageHeader is a transparent background . In some cases , PageHeader needs its own background color .
< / docs >
< template >
< div class = "demo-page-header" style = "background-color: #f5f5f5; padding: 24px" >
< a -page -header
:ghost ="ghost"
title = "Title"
sub -title = " This is a subtitle "
@ back = "() => $router.go(-1)"
>
< template # extra >
< a -button key = "3" > Operation < / a - b u t t o n >
< a -button key = "2" > Operation < / a - b u t t o n >
< a -button key = "1" type = "primary" > Primary < / a - b u t t o n >
< / template >
< a -descriptions size = "small" :column ="3" >
< a -descriptions -item label = "Created" > Lili Qu < / a - d e s c r i p t i o n s - i t e m >
< a -descriptions -item label = "Association" >
< a > 421421 < / a >
< / a - d e s c r i p t i o n s - i t e m >
< a -descriptions -item label = "Creation Time" > 2017 - 01 - 10 < / a - d e s c r i p t i o n s - i t e m >
< a -descriptions -item label = "Effective Time" > 2017 - 10 - 10 < / a - d e s c r i p t i o n s - i t e m >
< a -descriptions -item label = "Remarks" >
Gonghu Road , Xihu District , Hangzhou , Zhejiang , China
< / a - d e s c r i p t i o n s - i t e m >
< / a - d e s c r i p t i o n s >
< / a - p a g e - h e a d e r >
< / div >
< a -checkbox v -model :checked ="ghost" style = "margin-top: 0.5rem" > toggle ghost < / a - c h e c k b o x >
< / template >
< script lang = "ts" setup >
import { ref } from 'vue' ;
const ghost = ref ( false ) ;
< / script >
< style scoped >
. demo - page - header : deep ( tr : last - child td ) {
padding - bottom : 0 ;
}
< / style >