HTML中如何将表格最外层边框设置成实线,内单元格边框设置成虚线?

HTML中如何将表格最外层边框设置成实线,内单元格边框设置成虚线?_第1张图片如图中所示,最外层边框为实线,内部单元格边框为虚线
以下为HTML部分的一部分代码

<body>
    <form action="">
        <table>/*设置表格代码*/
            <th>同城网在线调查<th>
            <tr>
                <td>你从哪里知道同城的td>
                <td>
                    <select name="where" id="1">
                        <option value="">朋友告知option>
                        <option selected="selected">网上搜索option>
                        <option value="">传单option>
                    select>
                td>
            tr>
            <tr>
                <td>你正在使用的同城网服务td>
                <td>
                    <input type="checkbox">免费社区
                    <input type="checkbox">免费留言簿
                    <input type="checkbox">免费投票
                td>
            tr>
            <tr>
                <td>你希望我们提供哪些新服务td>
                <td>
                    <input type="checkbox">聊天室
                    <input type="checkbox">博客
                    <input type="checkbox">游戏系统
                td>
            tr>
            <tr>
                <td>你是同城网的会员吗td>
                <td>
                    <input type="radio"><input type="radio">不是
                td>
            tr>
            <tr>
                <td>你对同城网的其他意见td>
                <td>
                    <textarea  id="01" cols="30" rows="10" style="overflow-y: scroll;">textarea>
                td>
            tr>
            <tr aria-colspan="2">
                <td>td>
                <td><input type="submit" value="提交">td>
            tr>
        table>
    form>
body>
html>

以下为css代码部分

在这里插入代码片table,th{ 
   border-spacing: 0em;
   margin-left: 1px;
    border: 1px solid #220808;
    border-collapse: collapse;
}/*设置表格最外层边框实线*/
th{
    color: white;
    background-color: rgba(38, 45, 59, 0.767);
}
td{
    border: 1px dashed;
}/*设置单元格边框纵向虚线*/
tr{
    vertical-align: top;
    border: 1px dashed;
}/*设置单元格边框横向虚线*/

总结:主要搞清楚表格最外层边框(外框)与表格的单元格边框(内框)是由哪一部分决定的
外框:table
内框:td,tr

你可能感兴趣的:(笔记)