html css代码基础
•
编辑:汕哥教育 •来源: 汕哥教育培训中心•阅读量:
Html(HyperText Markup Language)是一种超文本标记语言,用于创建网页的标准标记语言,使用它可以创建一个静态网页,运行在游览器上,由游览器解释执行,注意它是一种标记语言,不是编程语言
基本结构:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>汕哥教育</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
解释:
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
双标记: 有开始标签就有结束标签
格式: <开始标签>内容</结束标签>
例:<p>段落</p>
单标记:只有一个标记,开始即结束
格式:<标记/>
例:<br />
1:段落标签p
<p>这是一个段落</p>
2:标题标签
<h1>标题1</h1>
.....
<h6>标题6</h6>
3:链接标签a
<a href=”http://www.baidu.com” target=”_blank”>百度</a>
4:图片标签img
<img src=”地址” alt=”图片说明” width=”100px” height=”100px” />
5:水平线hr
<hr />
6:html注释
<!--注释内容-->
7:换行br
<br />
8:HTML 文本格式化标签
9:引用外部文件标签link
<link rel="stylesheet" type="text/css" href="mystyle.css">
Css分为”内联样式”,”内部样式”,”外部样式”
内样样式:
例:<p style=”color:red;”>设置段落的颜色为红色</p>
内部样式,定义在头部head区域
<style type=”text/css”>
p{
Color:blue;
}
</style>
外部样式,定义在头部区域head
例 :<link rel="stylesheet" type="text/css" href="mystyle.css">
10:表格标签table
<table>
<tr>
<td>单元格</td>
</tr>
</table>
这里就讲这么多,视频教程会进行一个实操,讲解更多更详细的html css内容
基本结构:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>汕哥教育</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
解释:
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
双标记: 有开始标签就有结束标签
格式: <开始标签>内容</结束标签>
例:<p>段落</p>
单标记:只有一个标记,开始即结束
格式:<标记/>
例:<br />
1:段落标签p
<p>这是一个段落</p>
2:标题标签
<h1>标题1</h1>
.....
<h6>标题6</h6>
3:链接标签a
<a href=”http://www.baidu.com” target=”_blank”>百度</a>
4:图片标签img
<img src=”地址” alt=”图片说明” width=”100px” height=”100px” />
5:水平线hr
<hr />
6:html注释
<!--注释内容-->
7:换行br
<br />
8:HTML 文本格式化标签
<link rel="stylesheet" type="text/css" href="mystyle.css">
Css分为”内联样式”,”内部样式”,”外部样式”
内样样式:
例:<p style=”color:red;”>设置段落的颜色为红色</p>
内部样式,定义在头部head区域
<style type=”text/css”>
p{
Color:blue;
}
</style>
外部样式,定义在头部区域head
例 :<link rel="stylesheet" type="text/css" href="mystyle.css">
10:表格标签table
<table>
<tr>
<td>单元格</td>
</tr>
</table>
这里就讲这么多,视频教程会进行一个实操,讲解更多更详细的html css内容