当前位置: 首页 > 工具软件 > Hint.css > 使用案例 >

css如何设置dialog,css-dialog提示

邵捷
2023-12-01

内容不完善内容不完善内容不完善内容不完善内容不完善

确定

BackGround.js

import styled from 'styled-components';

const BackGround = styled.div`

background-color: rgba(19, 21, 26, 0.6);

opacity: 1;

z-index: 1001;

top: 0;

left: 0;

right: 0;

bottom: 0;

position: absolute;

`;

export default BackGround;

Dialog.js

import styled from 'styled-components';

const Dialog = styled.div`

background-color: #fff;

width: 270px;

height: auto;

top: 50%;

transform: translateY(-50%) translateX(-50%);

left: 50%;

z-index: 1002;

display: block;

position: fixed;

border-radius: 5px;

`;

export default Dialog;

Hint.js

import styled from 'styled-components';

const Hint = styled.div`

border-bottom: 1px solid #f1f1f1;

padding: 14px 10px;

line-height: 1.4;

`;

export default Hint;

OKButton.js

import styled from 'styled-components';

const OKButton = styled.button`

background-color: #fff;

color: orange;

border: none;

outline: none;

background-clip: padding-box;

border-radius: 5px;

width: 100%;

padding: 10px;

`;

export default OKButton;

 类似资料: