Fatal编程技术网
  • javascript/
  • Javascript 如何在html中定义表格的宽度和高度？

Javascript 如何在html中定义表格的宽度和高度？

javascript jquery html css

Javascript 如何在html中定义表格的宽度和高度？,javascript,jquery,html,css,Javascript,Jquery,Html,Css,如何在html中定义表格的宽度和高度？以及如何更改链接的颜色和字体大小（用绿色覆盖的字体）， 我想让页面变得漂亮，project_list.html如下，非常感谢您的帮助： {% extends 'base.html' %} {% block content %} <nav aria-label="breadcrumb"> </nav> <h3 class="mb-3">我学习的课程列表</h3> <div class="c

如何在html中定义表格的宽度和高度？以及如何更改链接的颜色和字体大小（用绿色覆盖的字体）， 我想让页面变得漂亮，project_list.html如下，非常感谢您的帮助：

{% extends 'base.html' %}

{% block content %}
  <nav aria-label="breadcrumb">
  </nav>
  <h3 class="mb-3">我学习的课程列表</h3>
  <div class="card">
    <table class="table mb-0">
      <thead>
        <tr>
          <th>课程序号</th>
          <th>课程名称</th>
          <th>部门名称</th>
          <th>课程日期</th>
          <th>课程时间</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for course in courses %}
          <tr>
            <td class="align-middle">{{ course.pk }}</td>
            <td class="align-middle" style="word-break: break-all;"><a href="{% url 'employees:course_detail' course.pk%}">{{ course.name }}</a></td>
            <td class="align-middle">{{ course.department.get_html_badge }}</td>
            <td class="align-middle">{{ course.date }}</td>
            <td class="align-middle">{{ course.time }}</td>
          </tr>
        {% empty %}
          <tr>
            <td class="bg-light text-center font-italic" colspan="4">目前没有你所选技能的课程。</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
<div class="card-footer">

{%extends'base.html%}
{%block content%}
我学习的课程列表
课程序号
课程名称
部门名称
课程日期
课程时间
{课程%中的课程为%}
{{course.pk}
{{course.department.get_html_badge}
{{course.date}
{{course.time}
{%empty%}
目前没有你所选技能的课程。
{%endfor%}
至于宽度，我认为最简单的选择是为thead元素定义特定的宽度，比如

<thead>
    <tr>
        <th width="7%">课程序号</th>
        <th width="47%">课程名称</th>
        <th width="20%">部门名称</th>
        <th width="10%">课程日期</th>
        <th width="10%">课程时间</th>
        <th width="6%"></th>
    </tr>
</thead>


课程序号
课程名称
部门名称
课程日期
课程时间
您可以根据生成的表格更改宽度。百分比宽度总是很难调整

至于高度，它会相应调整。我不建议您为行指定高度，因为如果内容长度不同，它将无法正确调整

至于链接颜色，我认为最简单的应该是：

<td class="align-middle" style="word-break: break-all;"><a href="{% url 'employees:course_detail' course.pk%}" style="color:blue;font-size:16px;">{{ course.name }}</a></td>
如果您使用
rem
或
em
，您可以用所需的值替换
16px
。

使用百分比，而不是像素，例如
文本。百分比将取决于周围的元素，您必须根据需要进行调整。
要定义表格的宽度，您可以使用
这将更改下面给出的详细说明中的表格宽度



要更改链接的颜色，您可以使用以下内容：


<body a link="black" vlink="red"> 







这可能对您有用：）
要更改表格的宽度和高度，可以在html中使用colgroup。要改变颜色，只需在样式元素中指定它


<table>
<colgroup>
<col style="width:80px" />
<col style="width:80px" />
<col style="width:80px" />
</colgroup>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>





.table.mb-0{高度：400px；宽度：50%；}
。用于帮助解决尺寸问题。非常感谢您的及时回答，它很有效，谢谢❤️body
alink
不是链接吗？另外，用数字而不是百分数表示宽度是个好主意吗？