基本语法
<!-- html和html5的区别：没有就是html -->
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 配置网页信息 -->
<meta charset="UTF-8">
<!-- http：协议 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 网页标题 -->
<title>仿百度</title>
</head>
<!-- 页面内容区域 -->
<body>
<!-- 每个标签在浏览器渲染的时候都会被浏览器赋予特性 -->
<!-- h1~h6都是标题标签 h1字号最大 -->
<h1>hello</h1>
<!-- 段落标签（用来展示一段文字的内容） -->
<p>我的第一个网页，三周之后就可以完成第一个小程序了。</p>
<!-- 直接写标签内容，回车就有尖括号 -->
<!-- 单标签一般为属性标签 -->
<!-- src : source、图片的来源
alt : 当src失效时，加载alt
alert：提示
加载网络资源：直接把资源图片地址粘贴过来
本地资源：需要获取图片的绝对路径。把图片放在此文件夹中-->
<img src="1.jpeg" alt="图片挂掉了">
<!-- 超链接标签
href：让a标签跳转的位置 -->
<a href="http://www.taobao.com">淘宝网</a>
<!-- hr:修饰线段 -->
<hr>
<!-- 无序列表 unorder list ： · -->
<ul>
<!-- 列表项 -->
<li>html标签</li>
<li>css样式</li>
<li>javascript语法</li>
</ul>
<!-- 有序列表 order list -->
<ol>
<!-- 列表项 -->
<li>html标签</li>
<li>css样式</li>
<li>javascript语法</li>
</ol>
<p>
<span style="color: crimson;">中午吃什么</span>
</p>
<h2>
<span style="color: darkmagenta;">晚上吃什么</span>
</h2>
</body>
</html>
文本样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>文本样式</title>
<!-- style标签用来设置元素的层叠样式表 -->
<style>
/* 标签名{}>>>为对应的标签来设置样式 */
p{
/* 样式名：样式值 */
color: gold;
font-size: 40px;
font-family: "仿宋";
/* 字体粗细 */
font-weight: bold;
/* 首行缩进：1em = 16px */
text-indent: 2em;
/* 背景颜色 */
background-color: lightsalmon;
}
</style>
</head>
<body>
<!-- <标签内style属性（行内样式）>
color(样式名)：chocolate（样式值） -->
<span style="color: chocolate;">该标签只是显示内容，没有任何语义</span>
<!-- br:换行标签 -->
<!-- span连写时，标签会在一行，不会换行，所以可以加br -->
<br>
<!-- 默认字体像素为16px -->
<!-- font-size：字体的大小
px代表的是单位（像素） -->
<span style="font-size: 20px;">这个span的字体要比上面的字体大</span>
<br>
<!-- font-family：文本类型 -->
<span style="font-family: '仿宋';">这个span的文字类型与上面两个的文字类型不同</span>
<br>
<span style="color: darkturquoise; font-size: 30px; font-family: '宋体';">上述三个文本样式都可以在该标签中呈现</span>
<hr>
<hr>
<hr>
<p>这个span的内容将采用style标签内的样式</p>
<br>
<p></p>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
