分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

HTML-常用标签

发布时间:2023-09-06 02:13责任编辑:蔡小小关键词:HTML

  部分内容转自:https://www.cnblogs.com/liwenzhou/p/7988087.html

★head内常用标签

<title></title>定义网页标题<style></style>定义内部样式表<script></script>定义JS代码或引入外部JS文件<link/>引入外部样式表文件<meta/>定义网页原信息

★body内常用标签

◇基本标签

<b>加粗</b><i>斜体</i><u>下划线</u><s>删除</s><p>段落标签</p><h1>标题1</h1><h2>标题2</h2><h3>标题3</h3><h4>标题4</h4><h5>标题5</h5><h6>标题6</h6><!--换行--><br><!--水平线--><hr>

◇特殊字符

&nbsp; ???空格&gt; ???>&lt; ???<&amp; ???&&yen; ???¥&copy; ???版权&reg; ???注册

◇div标签和span标签

div标签: 另起一行开始渲染 【块级标签】
span标签:不需要另起一行渲染【行内标签】

块级标签:另起一行开始渲染
行内标签:不需要另起一行

标签嵌套:
块级元素【可以】嵌套行内元素及部分块级元素
行内元素【不能】嵌套块级元素

注意:p标签不能块级标签,也不能包含p标签

◇img标签

<img src="图片的路径" >
alt="图片未加载成功时的提示" title="鼠标悬浮时提示信息" width="宽" height="高(宽高两个属性只用一个会自动等比缩放)"
img可传参数

◇超链接标签

<a href="超链接">点我跳转</a> 
target="_blank" ???????在新标签页打开目标网页target="_self" ???????在自己的标签页打开目标网页 【默认】 ???
a可传参数
绝对URL - 指向另一个站点(比如 href="http://www.jd.com)相对URL - 指当前站点中确切的路径(href="index.htm")锚URL ????- 指向页面中的锚(href="#top") ???
href属性

◇编号

无序号编号

<ul type="disc"> ?<li>第一项</li> ?<li>第二项</li></ul>
disc ???(实心圆点,默认值)circle ???(空心圆圈)square ???(实心方块)none ???(无样式)
type属性

有序号编号

<ol type="1" start="2"> ?<li>第一项</li> ?<li>第二项</li></ol>
1 ????数字列表,默认值A ????大写字母a ????小写字母Ⅰ ???大写罗马ⅰ ???小写罗马
type属性

标题编号

<dl> ?<dt>标题1</dt> ?<dd>内容1</dd> ?<dt>标题2</dt> ?<dd>内容1</dd> ?<dd>内容2</dd></dl> ???

◇表格

<table> ?<thead> ???????# 头部 ?<tr> ???<th>序号</th> ???<th>姓名</th> ???<th>爱好</th> ?</tr> ?</thead> ?<tbody> ???????# 身体 ?<tr> ???<td>1</td> ???<td>Egon</td> ???<td>杠娘</td> ?</tr> ?<tr> ???<td>2</td> ???<td>Yuan</td> ???<td>日天</td> ?</tr> ?</tbody></table>
语法
border: ????????表格边框.cellpadding: ????内边距cellspacing: ????外边距.width: ????????????像素 百分比.(最好通过css来设置长宽)rowspan: ????????单元格竖跨多少行colspan: ????????单元格横跨多少列(即合并单元格)
table可传参数

◇form标签

表单用于向服务器传输数据,从而实现用户与Web服务器的交互


表单能够包含:
  1,input系列标签,比如文本字段、复选框、单选框、提交按钮等等。
  2,textarea、select、fieldset和 label标签

<form> </form>
action ???????????规定向何处提交表单的地址(URL)(提交页面)autocomplete ???规定浏览器应该自动完成表单(默认:开启)enctype ???????????规定被提交数据的编码(默认:url-encoded)method ???????????规定在提交表单时所用的 HTTP 方法(默认:GET) ???--> post getname ???????????规定识别表单的名称(对于 DOM 使用:document.forms.name)novalidate ???????规定浏览器不验证表单accept-charset ???规定在被提交表单中使用的字符集(默认:页面字符集)target ???????????规定 action 属性中地址的目标(默认:_self)
form可传参数

◇input标签

<input type="属性名">
name: ???????????????????????????????表单提交时的“键”,注意和id的区别value: ???????????????????????????????表单提交时对应项的值 ???type="button", "reset", "submit"时, ???为按钮上显示的文本年内容 ???type="text","password","hidden"时, ???????为输入框的初始值 ???type="checkbox", "radio", "file", ???????为输入相关联的值checked: ???????????????????????????radio和checkbox默认被选中的项readonly: ???????????????????????????text和password设置只读disabled: ???????????????????????????禁用
input可传参数
type元素会根据不同的 type 属性,变化为多种形态 ???type属性值 ?????表现形式 ????????对应代码 ???????text ??????????单行输入文本 ???<input type=text" />password ???密码输入框 ??????????<input type="password" ?/>date ???????日期输入框 ???????<input type="date" />checkbox ???复选框 ???????????<input type="checkbox" checked="checked" ?/>radio ???????单选框 ???????????<input type="radio" ?/>submit ???????提交按钮 ???????<input type="submit" value="提交" />reset ???????重置按钮 ???????<input type="reset" value="重置" ?/>button ???????普通按钮 ???????<input type="button" value="普通按钮" ?/>hidden ???????隐藏输入框 ???????<input type="hidden" ?/>file ???????文本选择框 ???????<input type="file" ?/>
type属性

◇select标签

<select name="city" id="city"> ???<option value="1">北京</option> ???<option selected="selected" value="2">上海</option> ???<option value="3">广州</option> ???<option value="4">深圳</option></select>
multiple:布尔属性,设置后为多选,否则默认单选
select可传参数
disabled:禁用selected:默认选中该项value:定义提交时的选项值
option可传参数

◇textarea标签

<textarea name="memo" id="memo" cols="30" rows="10"> ?默认内容</textarea>
name:名称rows:行数cols:列数disabled:禁用 ???
textarea可传参数

HTML-常用标签

原文地址:https://www.cnblogs.com/sunch/p/9603806.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved