前端学习——HTML

VSCode常用快捷键

代码格式化:Shift+Alt+F

向上或向下移动一行:Alt+Up或Alt+Down

快速复制一行代码:Shift+Alt+Up或者Shift+Alt+Down

快速替换:Ctrl+H

HTML标签

文本标签

定义着重文字
定义粗体文字
定义斜体文字
加重语气
删除字
无特定含义

列表标签

1、有序列表

javascript 复制代码
//type可以改变列表项目标签
// 1:用数字标号;A:用大写字母标号;a:用小写字母标号;i:小写罗马数字标号;I:大写罗马数字标号
<ol type=''>
   <li></li>
</ol>

2、无序列表

javascript 复制代码
//type属性
//disc:默认实心圆;circle:空心圆;square:小方块;none:不显示
<ul>
	<li></li>
</ul>

应用于导航效果

3、快捷键:ul>li*n

n为li标签的数量

表格

javascript 复制代码
//type属性
//
<table>
	<tr>//行
		<td></td>//列
	</tr>
</table>

1、快捷键

table>tr2>td 3{单元格}

2、表格属性

border:设置边框

width:单元格宽度

height:单元格的高度

3、表格单元格合并

水平合并:colspan,水平合并保留左边删除右边

垂直合并:rowspan,垂直合并保留上边删除下边

javascript 复制代码
//type属性
//
<table>
	<tr>//行
		<td></td>//列
		<td></td>//列
		<td></td>//列
	</tr>
	<tr>//行
		<td colspan="2"></td>//列
		<td></td>//列
	</tr>
</table>

Form表单

用户输入的地方都会有表单,交互

javascript 复制代码
// An highlighted block
<form action="url" method="get/post" name="myForm"></form> 

action:服务器地址

method:get和post

不同的提交方式,get把提交的数据url可以看到,post看不到

get一般很少提交数据,post用于提交大量数据

name:表单名称

表单元素

javascript 复制代码
// An highlighted block
<form>
	<input type="text">
	<input type="submmit">
</form> 

1、文本

javascript 复制代码
// An highlighted block
<form>
	用户名:<input type="text">
</form> 

2、密码

javascript 复制代码
// An highlighted block
<form>
	密码:<input type="password" name="pwd">
</form> 

3、提交按钮

javascript 复制代码
// An highlighted block
<form>
	用户名:<input type="text">
	密码:<input type="password" name="pwd">
	<input type="submmit" value="登录">
</form> 

块元素与行内元素

1、块元素

div form h1~h6 hr p table ul ol

2、内联元素

a b em span i strong

3、行内块级元素(不换行,能够识别宽高)

button img input

新增标签

div标签:容器

相关推荐
im_AMBER1 小时前
学习日志19 python
python·学习
灵感__idea3 小时前
JavaScript高级程序设计(第5版):好的编程就是掌控感
前端·javascript·程序员
烛阴4 小时前
Mix
前端·webgl
代码续发4 小时前
前端组件梳理
前端
试图让你心动5 小时前
原生input添加删除图标类似vue里面移入显示删除[jquery]
前端·vue.js·jquery
_Kayo_5 小时前
VUE2 学习笔记6 vue数据监测原理
vue.js·笔记·学习
chenchihwen5 小时前
大模型应用班-第2课 DeepSeek使用与提示词工程课程重点 学习ollama 安装 用deepseek-r1:1.5b 分析PDF 内容
人工智能·学习
陈不知代码5 小时前
uniapp创建vue3+ts+pinia+sass项目
前端·uni-app·sass
小王码农记5 小时前
sass中@mixin与 @include
前端·sass
陈琦鹏6 小时前
轻松管理 WebSocket 连接!easy-websocket-client
前端·vue.js·websocket