HTML

最新推荐文章于 2022-07-07 22:58:56 发布

移动四级包

最新推荐文章于 2022-07-07 22:58:56 发布

阅读量185

点赞数

分类专栏： HTML

本文链接：https://blog.csdn.net/sourire0323/article/details/79616429

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

HTML
1 浏览器
客户端软件和服务进行交互
Chrome FireFox 欧朋 safari
2 浏览网页的过程
3 http
是一个协议

4 HTML

1 定义:

超文本标记语言（HyperText Markup Language）

2 分类:
单标签
<元素属性="属性值" />
双标签
<元素属性="属性值">内容</ 元素>
注意:
1 不管是单标签还是双标签都必须有/ 作为结束符号

2 html的元素不区分大小写但是为了规范统一使用小写

3 基本结构
<! DOCTYPE html> ----->声明该文档是一个html
<html>

<head>
</head>
<!-- body中的内容是给用户看的->
<body>
</body>

</html>

4 常用标签
head中子标签(子元素);
meta:
为当前页面提供说明信息
title:
当前标签页的名称
默认收藏时的书签名称
link : 引入css内容
script : 引入 js 内容

body中的子标签(子元素);
1 h1~h6:标题元素
h6 是最小的 h1是最大的 h标签字体加粗前后换行

2 字体相关元素
i: 字体倾斜不换行
del : 删除线
b : 加粗
u : 下划线
font :
color: 3种表示方式
size: 1~7的数字
face: 字体

3 hr 和 br
hr: 水平线
属性: width : 长度 px
height : 厚度 px
color : 颜色
align : 水平方向对齐方式
right left center
br: 换行后换行

4 pre p
p : 段落前后有空行前后换行
属性:
align : 水平方向对齐方式
right left center justify(两端对齐)

pre: 段落前后有空行前后换行
空格和换行会保留原样展示

5 img : 在页面引入图片
必要属性;
src:图片的来源 (本地路径网络)
alt:图片无法显示时的说明
常用属性:
width : 宽度 px
height : 高度 px
border : 边框 px
align : 对齐方式
top、bottom、middle、left right
title : 鼠标悬停在图片上的说明文字
6 列表
有序:
ol
属性 type:1 A a i I
子元素: li
无序:
ul
属性 type: desc circle square
子元素: li
定义:
dl
子元素:
dt : 向左

dd : 列表项内容

<!DOCTYPE html>
<html>
	<head>
		<title>列表的嵌套</title>
	</head>
	<body bgcolor="pink" text="green">
		<h2>八大菜系</h2> <img src="https://gss0.baidu.com/-Po3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/d62a6059252dd42adb85605a083b5bb5c8eab8b7.jpg" alt="图片太可爱无法显示" align="right"/>
		<ul>
			<li>川菜
				<!--有序-->
				<ol>
					<li>鱼香肉丝</li>
					<li>麻婆豆腐</li>
					<li>宫保鸡丁</li>
					<li>樟茶鸭子</li>
				</ol>
			</li><br>
			<li>湘菜
				<!--无序-->
				<ul type="desc">
					<li>麻辣子鸡</li>
					<li>辣味合蒸</li>
					<li>洞庭野鸭</li>
					<li>霸王别姬</li>
				</ul>
			</li><br>
			<li>徽菜
				<!--定义-->
				<dl>
					<dt>它以烹制山珍野味著称，擅长烧、炖、蒸，而少爆炒。其烹饪芡大、油重、色浓、朴素实惠。</dt>
					<dd>红烧果子狸</dd>
					<dd>火腿炖甲鱼</dd>
					<dd>雪冬烧山鸡</dd>
					<dd>符离集烧鸡</dd>
					<dd>蜂窝豆腐</dd>
					<dd>无为熏鸭</dd>
				</dl>
			</li>
			<li>粤菜
				<!--有序-->
				<ol type="a">
					<li>冬瓜盅</li>
					<li>龙虎斗</li>
					<li>脆皮乳猪</li>
					<li>蚝油牛柳</li>
					<li>大良炒鲜奶</li>	
					<li>潮州火筒炖鲍翅</li>
				</ol>
			</li><br>
			<li>鲁菜
				<!--无序-->
				<ul type="circle">
					<li>糖醋鱼</li>
					<li>锅烧肘子</li>
					<li>葱爆羊肉</li>
					<li>葱扒海参</li>
					<li>锅塌豆腐</li>
				</ul>
			</li><br>
			<li>浙菜
				<!--无序-->
				<ul type="square">
					<li>西湖醋鱼</li>
					<li>龙井虾仁</li>
					<li>干炸响铃</li>
					<li>油焖春笋</li>
					<li>西湖莼菜汤</li>
				</ul>
			</li><br>
			<li>苏菜
				<!--有序-->
				<ol type="i">
					<li>烤方</li>
					<li>盐水鸭</li>
					<li>叫花鸡</li>
					<li>松鼠桂鱼</li>
					<li>淮扬狮子头</li>
				</ol>
			</li><br>
			<li>闵菜
				<!--定义-->
				<dl>
					<dt>福建菜系，简称闽菜。以福州和厦门菜为主要代表。特色：制作细巧、色调美观、调味清鲜 </dt>
					<dd>闽生果</dd>
					<dd>雪花鸡</dd>
					<dd>太极明虾</dd>
					<dd>梅开二度</dd>
					<dd>烧生糟鸭</dd>
				</dl>
			</li>
		</ul>
	<hr width="500px" height="2px" color="yellow" >
	</body>
</html>

移动四级包

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML

HTML1 浏览器客户端软件和服务进行交互 Chrome FireFox 欧朋 safari 2 浏览网页的过程3 http 是一个协议4 HTML1 定义: 超文本标记语言（HyperText Markup Language）2 分类: 单标签 &lt;元素属性="属性值" /&gt; 双标签 &lt;元素属性="属性值"&gt;内容&lt;/ 元素&gt; 注意: 1 不管是单标...
复制链接

扫一扫

专栏目录