Html 根据网页重新缩放表格'；s码

在下面的照片中，有一个div，其中我有一个表，其中包含一些内容，当我重新缩放web浏览器的页面时，该表从div中消失

我想做的是，当它被缩放时，使表格变小，并且仍然显示其中的所有内容，而不使用滚动条或类似的东西

编辑

#profileTable{
宽度：自动；
文本对齐：左对齐；
颜色：#000080；
填充：30px 60px；
边框：1px实心#ccc；
边界半径：4px；
背景色：白色；
利润率：0.50px 50 px；
}
#内容{
保证金：0px 60px 0px；
背景色：#E9E9E9；
边框：实心1px灰色；
弹性：1；
明确：两者皆有；
位置：相对位置；
}

你的个人资料
用户名：
内容
名字：
内容

查看引导中的表响应功能

加

---

然后

如果您使用了

flex

，您也可以将其用于

tr

，以允许在没有媒体查询的情况下进行包装（请注意，此

表

也可以是列表

ul

或

dl

）

水平边距可以通过calc（）和minwidth转换为width，因此它们可以在视觉上折叠

范例

#profileTable{
文本对齐：左对齐；
颜色：#000080；
填充：30px 60px；
边框：1px实心#ccc；
边界半径：4px；
背景色：白色；
宽度：计算（100%-100px）；
最小宽度：270px；/*根据您的需要删除或调整此选项*/
保证金：0自动2米；
/*打破一切；不是一个好主意*/
}
#内容{
宽度：计算（100%-120px）；
最小宽度：360px；/*根据需要删除或调整此选项*/
保证金：自动；
背景色：#E9E9E9；
边框：实心1px灰色；
弹性：1；
明确：两者皆有；
位置：相对位置；
}
/*你已经在使用flex了吗*/
tr{
显示器：flex；
柔性包装：包装；
}
th{
空白：nowrap；
最小宽度：5em；/*根据您的需要删除或调整此选项*/
}
运输署{
弹性：1；
}
氢{
文本对齐：居中；
}

你的个人资料
用户名：
内容
名字：
内容

在这个问题中添加html、css。

表格{width:XX%；table layout:fixed；}

如果内容不需要表格，请使用常规标记。是否有html表格？CSS与哪个标签相关？center是很久以前就过时的标记，不要使用它：（该表是用PHP编写的，但要使用HTML表tags@GCyrillus更新了我的帖子，包括HTML和CSSOh上帝，你是救世主！！非常感谢！！

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<table class="table table-responsive">