行间样式怎样给子元素设置样式？

agui1989

发布于
2016-07-01

<table style="这里写样式">
<tr>
<td></td>
<td></td>
</tr>
</table>

比如上面这种情况，我想在table中给td加边框，应该怎样设置？

css html javascript 前端

阅读 6.3k

7 个回答

得票最新

Tomoe

6.2k11012

发布于
2016-07-02

✓ 已被采纳

不行，行間樣式只能針對當前元素做樣式設定，沒辦法使用選擇器

北堂棣

6.6k94268

发布于
2016-07-04

行间样式：
css写在标签里面，如：

<td style="border:1px solid #ccc;"> </td>

不推荐使用，css代码跟页面内容混在一起,看起来很不整洁。

内部样式：
css写在HTML页面的<head></head>标签里面，如：

<style type="text/css">
table td{border:1px solid #ccc;}
</style>
<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
</table>

外部样式：
css文件单独写，在HTML的<head></head>标签中引入（最正规），如
<link rel="stylesheet" type="text/css" href="style.css" />

xiaoxiongmila

9022817

发布于
2016-07-01

那就只能在td上面加边框了

guangpunba

5.4k42754

发布于
2016-07-01

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
</table>


    table{border-collapse: collapse;}
    table td{border:1px solid #ccc;}

这个效果吗

苏克yvj

发布于
2016-07-01

更新于
2016-07-01

新手上路，请多包涵

可以用

<table border＝'1'>

我是好人

2.2k1618

发布于
2016-07-04

一般是预先写好样式

比如这样

table.border td{
    border:1px solid #ccc;
}

然后你只要给 table 元素添加一个class border 就能使 td 应用到你想要的样式了。

白羊

304

发布于
2020-09-21

首先答主提的问题是不可行的.
但不知道你的需求是不是想给某些 class 设置样式的但又在 html 中没有使用

比如 elementUI 的组件
在 style 标签中是可以动态修改的
`

html
<div class="header" ref="mycolor" @click="func">
    <div class="header-info"></div>
</div>

style
<style> /*在header区域内设置 CSS变量--bccolor */
.header {
    --bcColor: #ffffff;
}
/*在子元素中使用该变量*/
.header-info {
    background-color :var(--bcColor);
} </style>
js 修改
<script> methods:{
        func () {
            this.$refs.mycolor.style.setProperty("--bcColor",'white');
        }
    } </script>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

行间样式怎样给子元素设置样式？

你尚未登录，登录后可以

扁平化数组转换成树形?

js 如何将Key属性相同的放在同一个数组？

省市区街道数据在哪里可以下载？

两个promise问题？

如何自定义设置虚线边框的样式？

在Electron中，我们想要创建特定的BrowserWindow，想要使用react组件作为BrowserWindow的内容，请问如何实现呢？

Object assgin拷贝问题？