html快速上手1

最新推荐文章于 2024-07-24 20:11:59 发布

?⃕?⃕

最新推荐文章于 2024-07-24 20:11:59 发布

阅读量45

点赞数

文章标签： html javascript 前端

本文链接：https://blog.csdn.net/weixin_45659166/article/details/122122689

版权

这里写自定义目录标题

- html学习

html学习

参考菜鸟教程<仅为自己阅读>
标签参考手册标签参考手册
在这里插入图片描述
html中的class是什么意思？

html头部中包含哪些标签添加链接描述

html和css的联系：
html使用css的三种方式：
1.内联样式：写在body块内，直接在标签内加入style属性，如：
<p style="color:blue;margin-left:20px;">这是一个段落。</p>
2.内部样式表：写在head块内，写入新的标签<style>如：

<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>

3.外部样式表，单独写成css文件，然后html文件中通过link标签引用，如：

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

html区块：
在这里插入图片描述
简单介绍：div和span标签没有具体含义，div是区块元素，span是内联元素，二者都是为了划分区域，更好的和css联动使用，将一整个区块设置格式。
例如：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
 
<div id="container" style="width:500px">
 
<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">主要的网页标题</h1></div>
 
<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>菜单</b><br>
HTML<br>
CSS<br>
JavaScript</div>
 
<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
内容在这里</div>
 
<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
版权 © runoob.com</div>
 
</div>
 
</body>
</html>

结果：在这里插入图片描述
使用table标签可以做到相同的效果，代码如下：

<!DOCTYPE html>
<html>
<head> 
	<meta charset="utf-8"> 
	<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
 
	<table width="500" border="0">
		<tr>
			<td colspan="2" style="background-color:#FFA500;">
				<h1>主要的网页标题</h1>
			</td>
		</tr>
 
		<tr>
			<td style="background-color:#FFD700;width:100px;">
				<b>菜单</b><br>
				HTML<br>
				CSS<br>
				JavaScript
			</td>
			<td style="background-color:#eeeeee;height:200px;width:400px;">
			内容在这里</td>
		</tr>
 
		<tr>
			<td colspan="2" style="background-color:#FFA500;text-align:center;">
		版权 © runoob.com</td>
		</tr>
	</table>
 
</body>
</html>

?⃕?⃕

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html快速上手1

这里写自定义目录标题html学习html学习参考菜鸟教程<仅为自己阅读>标签参考手册标签参考手册html中的class是什么意思？html头部中包含哪些标签添加链接描述html和css的联系：html使用css的三种方式：1.内联样式：写在body块内，直接在标签内加入style属性，如：<p style="color:blue;margin-left:20px;">这是一个段落。</p>2.内部样式表：写在head块内，写入新的标签<sty
复制链接

扫一扫