怎么在html文件里做一个表格?

怎么在html文件里做一个表格?,第1张

html做个表格的步骤如下:

1、首先新建一个html,点击<body></body>中间,先填入表格内容;

2、内容根据需求来写即可,示例代码如下:

<table>

<p style="text-align:center ">功课表</p>

<tr>

<th>语文</th>

<td>7:00-7:40</td>

<td>7:50-8:30</td>

</tr>

<tr>

<th>数学</th>

<td>7:00-7:40</td>

<td>7:50-8:30</td>

</tr>

<tr>

<th>英文</th>

<td>7:00-7:40</td>

<td>7:50-8:30</td>

</tr>

</table>

3、然后在<head></head>中间输入样式表的样式;

4、样式也根据个人的需求来设置即可,设置单元格的宽度高度,合并单元格,位置,颜色等等,示例代码如下:

<style type="text/css">

body

{

width:340px

height :800px

}

table

{

border-collapse :collapse

}

th,td

{

width:100px

height:40px

border :1px solid black

font-size:12px

text-align :center

}   

</style>

5、这里需要注意这个代码“table”的意义是将表格边框合并为单一的边框,将相邻变合并。

6、预览结果如下所示,一个简单的表格就制作出来了。

题主的例子#search { float: right width: 305px height: 76px}中的#是css层叠样式表中的ID选择器。

在一个HTML文档中,CSS ID 选择器会根据该元素的ID属性中的内容匹配元素,元素ID属性名必须与选择器中的ID属性名完全匹配,此条样式声明才会生效。语法如下:

#id属性 {样式声明 }

扩展资料

css层叠样式表有ID选择器、元素选择器、类选择器。

1、css层叠样式表中的ID选择器示例:

<div id="search" ></div>

<style>#search {  float: right  width: 305px  height: 76px}</style>

2、css层叠样式表中的元素选择器语法和示例

语法:元素 {样式声明 }

示例:<span>这里是由 span 包裹的一些文字.</span>

<style>span { background-color: DodgerBluecolor: #ffffff}</style>

3、css层叠样式表中的类选择器语法和示例

语法:.类名 {样式声明 }

示例:<div class="search" ></div>

<style>.search{background-color: DodgerBlue}</style>

在html中,什么叫做元素解释:

1、元素:

HTML网页实际上就是由许许多多各种各样的HTML元素构成的文本文件,并且任何网页浏览器都可以直接运行HTML文件。所以可以这样说,HTML元素就是构成HTML文件的基本对象,HTML元素可以说是一个统称而已。HTML元素就是通过使用HTML标签进行定义的。 

2. 标签:

标签就是<head>、<body>、<table>等被尖括号“<”和“>”包起来的对象,绝大部分的标签都是成对出现的,如<table></talbe>、<form></form>。当然还有少部分不是成对出现的,如<br>、<hr>等。 

标签就是用来标记HTML元素的。位于起始标签和结束标签之间的文本就是HTML元素的内容。

3. 属性: 

为HTML元素提供各种附加信息的就是HTML属性,它总是以"属性名=属性值"这种名值对的形式出现,而且属性总是在HTML元素的开始标签中进行定义。 

4、示例: 

<html><head><title>示例标题</title></head><body bgcolor="red"><p>这是示例页面</p></body></html>在这个示例中,<p>这是示例页面</p>就是HTML元素,其中“这是示例页面”就是元素的具体内容了。

5、<head><title><body>等就是HTML标签,这是标签构成了HTML元素。

<body bgcolor="red">中的bgcolor="red"就是标签的属性,它定义了标签应该如何具体配置。 总之,元素和标签的区别也不必太在意,实际工作中都直接以标签统称


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7411077.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-05
下一篇 2023-04-05

发表评论

登录后才能评论

评论列表(0条)

保存