如何找到我可以在ant设计组件中编辑的所有样式属性？
如何找到我可以在ant设计组件中编辑的所有样式属性？
提问于 2018-08-17 17:26:53
我正在尝试创建一个蚂蚁设计卡片，它只在卡片的左右两侧有一个边框。我可以在卡片组件中直接编辑的bordered属性可以删除整个边框，也可以不删除任何边框。我希望能够在内联样式中指定边框的各个方面。在哪里/如何找到可以编辑的内联样式属性？
<Card
bordered={false}
style={{
// how do I find all of the attributes I can edit right here
}}
>回答 2
Stack Overflow用户
回答已采纳
发布于 2018-08-20 06:46:02
您可以通过浏览器页面上的开发工具来执行此操作：
在“图元”面板中，选择所需的图元，然后转到“样式”选项卡：
<div class="ant-card ant-card-bordered" style="border-top: 1px;border-bottom: 1px;width: 300px;">样式选项卡：
.ant-card-bordered {
border: 1px solid #e8e8e8;
border-top-color: rgb(232, 232, 232);
border-top-style: solid;
border-top-width: 1px;
border-right-color: rgb(232, 232, 232);
border-right-style: solid;
border-right-width: 1px;
border-bottom-color: rgb(232, 232, 232);
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: rgb(232, 232, 232);
border-left-style: solid;
border-left-width: 1px;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;Stack Overflow用户
发布于 2018-08-17 17:42:00
为什么不创建一个css文件并将这些类名添加到'Card‘组件的'className’属性中呢？
您可以使用Chrome开发工具检查元素，并使用所需的类名编写CSS。
你的css文件如下所示：(根据需要添加更多细节)
.cardBorder {
border: none;
}和您的卡片组件如下所示：
<Card className="cardBorder" />通过这个，你可以做任何类型的css修改。比起内联样式，最好有单独的css文件来处理这些。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51900309
复制相关文章
![什么是Deno，它与Node.js有什么不同？[每日前端夜话0xA1]](https://ask.qcloudimg.com/http-save/yehe-1120945/07sqpk3pig.jpeg)
相似问题
在Vue.js中将槽传送到槽中
Vue 2向父组件添加槽
如何在nuxt组合api中将事件发送到默认布局？
如何在Vue中将循环组件事件获取到父组件
从组件呈现布局中的Vue槽
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
