美文网首页
HTML标签介绍

HTML标签介绍

作者: 一个老实人 | 来源:发表于2018-06-19 17:31 被阅读0次

html:(hyperText markup language) 超文本标记语言。

<html>
</html>
在一个html文件只有一个根标签

注意:以下是我的笔记,有些标签我并没写尾标签。我只为了方便自己使用查看

"&nbsp ;": 空格
"&lt ;" :小于符号
"&gt ;":大于符号

ol标签(order list):有序列表

><ol type="1">
     <li>xx</li>
     <li>xx</li>
</ol>

在<ol> 标签中type属性可设置排序的类型 默认的是 1 
reversed:是倒序,
<ol type="I" reversed="reversed" >

start:从2开始 
<ol type="1" start="2">
如果你是以字母排序,start:也是数字
<ol type="a" start="2">

ul标签(unorder list):无序列表

<ul>
       <li>xx</li>
       <li>xx</li>
       <li>xx</li>
</ul>
他只有一个-type-属性可修改
disc:全写(discircle)默认的  实心圆的意思
<ul type="disc">
他还有2个值
<ul type="square"> //方块
<ul type="circle"> //空心圆

img 标签:加载图片

设置加载图片的宽高
<img src="<图片地址>" style="width: 200px; height: 200px">
alt(图片占位符):相当于提示文字,如果图片加载成功是看不来有什么效
图片加载失败的时候才可以看出效果
<img src="img/123.jg"  alt="哈哈">
title(图片提示符):把鼠标放在上的时候,会出现文字信息
<img src="img/123.jg" title="哈哈">

a标签(anchor):可以跳转链接

href(超文本引用):全称 hyperText reference 
<a href="链接地址">点我跳转</a>

可以在a标签中应用图片这个图片就有了点击功能
<a href="链接地址">
     <img src="img/123.jpg">
</a>
可以设置他的宽高背景颜色等等属性
<a href="链接地址" style="width: 100px;height: 100px;background-color: #ff4400;display: block">
target:这个属性设置为_blank的时候,当用户点击后就会新开一个页面加载
<a href="链接地址" target="_blank">asd</a>

他还可以记录某一个标签的位置:
<div id="asd" style="width: 100px; height: 100px; background-color: forestgreen">demoOne</div>
<br> X 100//假设这里有100个换行
<div id="zxc" style="width: 100px; height: 100px; background-color: red">demoTwo</div>
<br> X 100//假设这里有100个换行

如果我点击one 就会跳到id为asd的位置
<a href="#asd">one</a>
如果我点击two 就会跳到id为zxc的位置
<a href="#zxc">two</a>

电话功能
<a href="tel:电话号码">点我打电话</a>
发邮件功能:

强制执行javascript代码
下面的javascript叫 "协议限定符",在这个这个后面就可写javascript代码,当你点击后就可以强制执行javascript
<a href="javascript:while(1){alert('哈哈')}">点我</a>

form(表单):可以向后端发送数据

method: get/post
<form method="get" action="接口链接">
       <p>
          username:<input type="text" name="userName">
       </p>
       <p>
           password:<input type="password" name="Password">
       </p>
提价按钮:
       <input type="submit">
   </form>
----------------------------------------------------
单选
<form method="get" action="">
设置input的type=radio可以设置单选按钮 最重要的是要设置>name的值要一样,value就是你设置当前单选对象的值
如果想变成多选把radio 改成checkbox
       aaa<input type="radio" name="star" value="aaa">
       bbb<input type="radio" name="star" value="bbb">
       ccc<input type="radio" name="star" value="ccc">
<input type="submit">
</form>
----------------------------------------------------
在input中为了可以让用户体验跟好,可以设置默认选项checked
aaa<input type="radio" name="star" value="aaa" checked="checked">
----------------------------------------------------
在form还有个select组键,他和option一起使用,可实现下拉菜单,注意要设置name属性,没有特殊的要求可以不设置value option对应的就是它默认的value。
<form method="get" action="">
      <select name="name">
           <option>a</option>
           <option>b</option>
           <option>c</option>
           <option>d</option>
       </select>
       <input type="submit">
   </form>
如果想给每个option设置单独的name 和 value ,
<option name="xxx" value="1">a</option>
注意如果是想给option 设置单独设置 name 属性,一定要把select中的name 属性去掉。

相关文章

  • HTML标签介绍

    html:(hyperText markup language) 超文本标记语言。 在一个html文件只有一个根标...

  • HTML标签介绍

    别看了,都是我从MDN抄来的。 和 是两个不同的标签,不能作为 或其他 元素的子元素。是HTML5中的标签。 ...

  • html 标签介绍

    标签h1 最小到 h6 hr 水平线 文本格式化 连接 每秒刷新一次 页面 给标题上加图片 图片 img 表...

  • HTML常用标签

    HTML常用标签介绍

  • 从屌丝到架构师的飞越(HTML篇)-HTML基础

    一、介绍 超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本...

  • HTML常用标签介绍

    1、基本标签 HTML 文档的元信息,常用属性 charset 此特性声明当前文档所使用的字符编码,...

  • HTML常用标签介绍

    1.iframe标签: iframe标签用于在一个页面当中嵌套页面。但目前已经很少用了,基本都是在一些旧项目才会看...

  • HTML常用标签介绍

    HTML文档标签 定义文档类型 定义HTML文档 定义文档头部 定义文档主体 布局标签(包含...

  • HTML常用标签介绍

    html中标签有很多,主要分为三组,分别是块级元素、内联元素、内联块级元素。 块级元素 常见的块级元素有 ~ 、 ...

  • HTML常用标签介绍

    Lets do it 与 之间的文本描述网页 与 之间的文本是可见的页面内容 与 之间的文本被显示为标...

网友评论

      本文标题:HTML标签介绍

      本文链接:https://www.haomeiwen.com/subject/lbraeftx.html