【鸿蒙开发从0到1 day01】

一.主题标签

主题标签有h1_{h6,它一般是用来描述文章标题,新闻主题,商品名称等.他会有加粗效果,h1}h6的加粗效果是逐步下降的
特点:
-独占一行
-有加粗效果

运行效果:

二.段落标签

p标签,一般是用来对事务描述的标签,当然文章内容也可以使用
特点:
-独占一行
-双标签
-结束会有一个换行

运行效果:

三.格式化标签

格式化标签就是对我们的文本进行一些格式的设置,比如加粗,倾斜,下划线,删除线;
加粗是用b或者strong双标签
倾斜使用em或者i双标签
下划线使用ins或者u双标签
删除线使用del双标签
特点:
-展示在同一行

运行效果:

四.img标签

他是用来在页面中插入图片的标签,他有src,alt,tile,width,height等属性
	src:填写图片地址(绝对地址和相对地址)
	alt:图片加载不出的错误提示
	title:图片的描述提示
	width:设置图片宽度
	height:设置图片高度
		特点:
			-它是属于单标签
			-相对路径: **./**代表从同级目录开始找
			**../**代表的是从当前文件的上级目录开始找
			-绝对路径:实际就是找到图片在电脑中的路径,或者网页上一些图片的地址

运行效果:

五.a标签

a标签也是属于双标签
用来跳转链接的
有一个href属性,填写跳转的链接,没有链接的时候就写个#
-在a标签中加入一个 **_blank**就表示跳转后会打开一个新的窗口进行跳转
默认的就在原窗口跳转
-不会独占一行

运行结果:

六.无序标签

ul是一个整体
li是每一项
	特点:
		-独占一行
		-每一项最前面都有一个实心的小圆点

运行结果:

七.有序标签

ol:是整体
li:是每一项
特点:
-独占一行
-属于双标签
-列表前面有序号

运行效果:

八.表格标签

table:放在最外层
tr :表格的行
th: 表头标签
td : 表格的列

用法和特点:
	table里面嵌套tr标签,tr嵌套th/td,一般只有第一行嵌套th作为表头
	它们都是双标签
	默认是没有边框线的
	只需要在table标签内加一个border属性即可显示边框线
	table独占一行

运行效果:

九.合并单元格

rowspan 是跨行合并,保留最上面那个,把要合并的注释
colspan 是跨列合并,保留最左边那个,把其他要合并的单元格删除,合并几个colspan后面的参数就填几

运行效果:

十.表单标签

input输入标签
	属性:type:用来决定输入数据的类型
		placeholder;用来提示用户输入描述
特点:
 	单标签
    独占一行

运行结果:

input单选按钮type值设置为radio
name属性值必须全部保持一致
checked默认选择

运行效果:

input复选框
	type属性是checkbox
	使用checked默认选择

运行结果:

下拉菜单
	使用select标签嵌套option标签
	-select在同一行显示
	-selected可以将某个选项默认在首位显示

运行结果:

文本域标签textarea是一个双向标签,中间可以填入一些信息输入的提示文字

运行结果:

label标签用来扩大单选按钮的选中范围,
以便在我们单击单选按钮文本的时候也会触发选中单选按钮

运行结果:

按钮标签
	他需要搭配from表单使用,action属性是提交后跳转到的页面
	按钮有三种类型:
		提交:type设置为submit
		重置type设置为reset
		普通按钮type设置为button

运行结果:

十一.布局标签

	div区域标签
		特点
			-独占一行
	span用于价格(少量文字的地方)
		特点:
			-不会独占一行

十二.总结

独占一行的标签 :
	h系列 p div 无序列表和有序列表 table标签
在一行显示的标签:
	input span a img button select textarea label strong ins em del