1024 rem 与 em 与 vw 与表格作业 - 前端开发

首页 > 博客列表 > 1024 rem 与 em 与 vw 与表格作业

博主信息

博文 10

粉丝 0

访问量 8416

专题推荐

更多>

rem和em的区别

rem是相对于根字号，即相对于<html>标签的font-size实现的
参考物是父元素的font-size，具有继承的特点。浏览器默认字体是16px，整个页面内1em不是一个固定的值

表格

  <style>
    html{
      font-size: 24px;
    }
    .table{
      width: 50vw;
      border-collapse:collapse;
      border: 1px solid #e3e3e3;
    }
    td{
      text-align: center;
      height: 4rem;
      font-size: 1rem;
    }
  </style>
  <table border="1" class="table">
    <thead>
      <tr>
        <td></td>
        <td>周一</td>
        <td>周二</td>
        <td>周三</td>
        <td>周四</td>
        <td>周五</td>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td rowspan="4">上午</td>
        <td>语文</td>
        <td>数学</td>
        <td>语文</td>
        <td>英语</td>
        <td>体育</td>
      </tr>
      <tr>
        <td>电脑</td>
        <td>语文</td>
        <td>体育</td>
        <td>英语</td>
        <td>数控</td>
      </tr>
      <tr>
        <td>生物</td>
        <td>数学</td>
        <td>地理</td>
        <td>语文</td>
        <td>历史</td>
      </tr>
      <tr>
        <td>数学</td>
        <td>政治</td>
        <td>语文</td>
        <td>历史</td>
        <td>文艺</td>
      </tr>
      <tr >
        <td colspan="6" align="center">午休</td>
      </tr>
      <tr>
        <td rowspan="2">下午</td>
        <td>数控</td>
        <td>英语</td>
        <td>电脑</td>
        <td>历史</td>
        <td>英语</td>
      </tr>
      <tr>
        <td>班会</td>
        <td>语文</td>
        <td>数学</td>
        <td>历史</td>
        <td>英语</td>
      </tr>
    </tbody>
  </table>

效果图
课程表

批改老师：

PHPz

批改状态：合格

老师批语：

本博文版权归博主所有，转载请注明地址！如有侵权、违法，请联系admin@php.cn举报处理！

全部评论文明上网理性发言，请遵守新闻评论服务协议

0条评论

作者最新博文

1013课件作业

2022-10-15 12:12:39