目录
前言
html初学笔记,记录刚学习html的基础知识。作为以后参考使用。
提示:以下是本篇文章正文内容,下面案例可供参考
一、开始
用VScode创建html文件,然后打入!号后回车就能生成模板,开始行动!
二、标题标签
1.标题
代码如下(示例):
标题标签,文字加粗,一行显示<h1>标题</h1>
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
标签属性:
align:设置对齐方式,值:center、left、right
2.段落标签
代码如下(示例):
<p></p>
作用:分段,段落与段落之间会有间隙<p>分段</p>
Lorem+数字生成段落
标签属性:
align:值:居中对齐:center、左对齐:left、右对齐:right、两端对齐:justify
</br> 换行
3. 水平线标签
属性:
size: 设置水平线粗细
width:设置水平长度
align:设置水平线对齐方式
color:设置水平线颜色
noshade:取消水平线阴影
4.文本格式化标签
强调字,粗体: <strong>加粗</strong>
强调字,粗体: <em>加粗</em>
引用字,斜体: <cite></cite>
5.图片标签:
<img src="图片url" width="500" height="600" border="10" alt="秘密" title="图片" />
(1). img标签的属性:
src:图片路径
width:图片宽度
height:图片高度
border:图片边框的粗细
align:对齐方式
alt:替换文本,当图片不能显示,就会显示文字。
(2). src后面接图片路径,有绝对路径和相对路径
绝对路径:C:\Users\曾钟宁\Desktop\Web/a.jpg
相对目录:/表示下一级,../表示上一级,../../a.jpg
6.列表标签
<ul>
<li>列表项</li>
<li>列表项</li>
......
</ul>
<ul>标签属性:
设置符号样式:type = disc:实心圆、circle:空心圆、square:方块、
无序列表是并列关系,<ul>里面只能放<li>标签,<li>标签里面可以容纳所有元素
<ol>
<li>列表项1</li>
<li>列表项2</li>
......
</ol>
<ol>标签属性
设置序号样式:type = 1、A、a、I
7.表格标签
<table> 定义表格
<tr> 定义表格的行
<th> 定义表格的表头
<td> 定义表格的单元
<thead> 定义表格的页眉
<tbody> 定义表格的主体
<tfoot> 定义表格的页脚
table:表格;thead:表头;tr:行;td:单元格;th:一行的首个单元格
8.表单标签
用于定义表单域,以实现用户信息的搜集和传递
<form></form>
<form>标签的属性:
属性action:属性值url地址
作用:用于接收并处理表单数据的服务器的url地址
属性method:属性值get/post
作用:用于设置表单数据的提交方式
属性name:属性值名称
作用:用于指定表单域的名称,以区分同一个页面中的多个表单域
8.1input
<input type="属性值" name="元素名" value="请求输入" checked="" maxlength="30" />
属性type的属性值:
text 定义单行的输入字段(文本框),用户可在其中输入文字
password 定义密码字段,会进行掩码
submit 定义提交按钮,可以把表单元素里的值提交给后台服务器
reset 定义重置按钮,可以重置表单中的所有数据
button 定义可点击按钮,(onclick="",一般通过JavaScript启动脚本)
file 定义字段和“浏览”按钮,文件上传用(能上传头像之类的)
hidden 定义隐藏的输入字段
image 定义图像形式的提交按钮
点击按钮后触发的事件
onclick=""
8.2 select下拉表单元素
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
......
</select>
在<option>中定义select="selected"时,当前项即为默认选中项
总结
html最终需要css和js的结合才能发挥完美。