h5入门基本标签的认识和掌握

最新推荐文章于 2024-07-20 08:51:01 发布
最新推荐文章于 2024-07-20 08:51:01 发布
阅读量925 收藏
点赞数
文章标签： h5 标签
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Arthur__Wong/article/details/52683834
版权

Day1:

H5深入学习课程

-HTML+CSS3 -->简单，杂而多，多测试多项目

-JS/JQ -->原生Js ->JQ ->项目

-Ajax -->PHP/原生Ajax+JQ-Ajax->项目

-H5 –>移动端（IOS，Android，WebApp，微信）->移动端项目


h5中标签的分类主要有 （JS中称为结点也称为元素）

块标签：骨架

内联标签（行内标签）：填充骨架

 

<></>

H5：标签

JS：节点、元素


主用atom编程，其中使用的快捷输入来自github插件安装到atom 


H5版本声明

<!DOCTYPE html>

 

中文编码

<meta charset="UTF-8">

 

搜索引擎优化

Meta标签中的name设置 keywords description

 

 

img 专门用于显示图片 ,img可是设置宽高 。

  可替换标签：显示的内容不是由标签内的内容决定的，

  而是由其属性决定的。e.g：img,video...

  特征：1.可设置宽高

 

 

Form表单

Action里面写的是后台文件名

前后台文件放到服务器文件上（www）127.0.0.1


<!-- 设置浏览器兼容模式 -->
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

<!--  Html标签分为两种-->
  <!--
  1.块标签
  a。独占一行
  b。可以设置宽高
  -->
  <!--
  1.div：无语义标签->通俗点，什么都可以显示->一般用于做容器
  -->
  <div style="background:red;height:100px;width:100px;">i am div</div>test


  <!-- h1-h6 -->
  <!-- h${我是标题$}*6 -->
  <h1 style="background:red;">我是标题1</h1>
  <h2>我是标题2</h2>
  <h3>我是标题3</h3>
  <h4>我是标题4</h4>
  <h5>我是标题5</h5>
  <h6>我是标题6</h6>


  <!--ordered list-->
  <!-- ol>li*3 -->
  <ol style="background:red;">
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ol>


  <!--unordered list  -->
  <ul style="background:red;">
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>


  <!--ul/ol/li 都是块标签  -->


  <!--define list  -->
  <dl style="background:red;">
    <!--define title  -->
    <dt>台风鲇鱼</dt>
    <!--defien description  -->
    <dd>今年国庆</dd>
  </dl>


  <!--dl/dt/dd 都是块标签  -->


  <!--Lorem10 随机十个单词  -->
  <!-- Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus, accusamus. -->


  <!-- table -->
  <!-- table是由行构成的，行是由列构成的->二维结构 -->
  <table border="1">
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
    </tr>
  </table>


  <!--段落标签  -->
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Excepturi, rerum?</p>
  <p style="text-indent:2em;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis, omnis.</p>




  <!--换行标签  -->
  <br>
  <br />








  <!--行内标签，在一行内显示
  a。在一行内显示
  b。不能设置宽高
  -->


  <!--span  无语义行内标签，一般作为容器,内容撑开宽高，换行会增加间距-->
  <span>我是span</span>test<span>666</span>




  <!--行内元素的对齐方式？  -->


  <!-- 链接 -->
  <!--
  target属性:
  _blank ： 在新窗口中打开链接
  _parent ： 在父窗体中打开链接
  _self ： 在当前窗体打开链接,此为默认值
  _top ： 在当前窗体打开链接，并替换当前的整个窗体(框架页)
  -->
  <!--title 链接说明  -->
  <a href="http://www.baidu.com" title="百度一下" target="_blank">百度</a>


  <!--页面内跳转，锚点  -->
  <a href="">H5+css</a>
  <a href="#js">js</a>
  <a href="">php</a>
  <a href="">移动端</a>




  <div id="js">锚点</div>
  <div></div>
  <div></div>


  <!--img 专门用于显示图片 ,img可是设置宽高 。
  可替换标签：显示的内容不是由标签内的内容决定的，
  而是由其属性决定的。e.g：img,video...
  特征：1.可设置宽高
  -->
  <!--‘.’ 表示当前路径  -->
  <!--‘..’ 表示根路径 -->
  <!--alt 图片加载失败后的说明 title 图片的提示  -->
  <img src="" alt="" title="" style="width:100px;height:100px;">


  <!--var，strong，em 表示强调  -->
  <!--倾斜  -->
  <var>我是强调</var>
  <!--加粗  -->
  <strong>我是强调</strong>
  <!--倾斜  -->
  <em>我是强调</em>


  <!--var、strong、em:一般情况下会被降级使用span  -->


  <!--i，b   h5新增标签  -->
  <i>斜体</i>
  <b>加粗</b>








  <!--表单：一般用于向服务器提交信息  -->
  <!--method:get/post  -->
  <!--form块标签，input行内标签  内部基本是行内标签-->
  <!--input 可替换行内标签，可设置宽高  -->
  <form action="index.php" method="post">
      用户名：<input type="text" name="username" style="width：100px;height:50px;">
      密码：<input type="password" name="pwd">
      <input type="submit" value="登陆">
      <!--文件浏览  -->
      <input type="file">
      <!--单选框  -->
      <input type="radio" name="sex">男
      <input type="radio" name="sex">女
      <!--多选框  -->
      <input type="checkbox">HTML
      <input type="checkbox">JS
      <input type="checkbox">JQ




      <input type="button" value="按钮"> <br>
      <input type="submit" value="登陆"> <br>
      <input type="reset" value="重置">




      <!--文本域   cols 列 rows 行  -->
      <textarea  cols="5" rows="40"></textarea>


      <!--下拉列表  -->
      <select>
        <option value="">北京</option>
        <option value="">上海</option>
        <option value="">广州</option>
        <option value="">深圳</option>
      </select>






  </form>

Arthur__Wong
关注
13 ArcGIS API for JavaScript开发入门文档
X北辰北的博客
09-04 4838
写在前面 这篇文章写在我用ArcGIS API for JavaScript(后面统称为"ArcGIS JS API")开发了两年项目后的某一天夜里。写这篇文章主要是两个目的吧，第一个原因肯定是为后面越来越多的从事WebGIS开发的GISer提供一个学习路线，当然，我提供的这个学习路线仅仅是一个参考；第二个原因就是我想写文章了，八月份一直忙着做项目，忘记了更新博客。 什么时候适合读这篇文章呢 在校期间无聊想学WebGIS开发之前 当你参加Esri全国开发者大赛(目前最新的名称应该是"易智瑞全国.
一文掌握 Keras
aliceyangxi1987的博客
09-22 302
今天我们来学习一下 Keras。 Keras 是一个用 Python 编写的高级神经网络 API，能够用 TensorFlow 或者 Theano 作为后端运行。是由 Francois Chollet 在 Google 工作时开发的，用于构建深度学习模型。 Keras 是为了实现快速实验和快速原型设计的，让开发者能够用最短的时间把想法转换为实验结果。用 Keras 可以非常快速地上手深度学习，搭建...
H5的常用标签
m0_64955492的博客
12-26 6836
目录 一、文本标签 二、图片标签和超链接标签 三、音频和视频标签 四、列表、容器标签 五、表格标签 六、表单 一、文本标签 1、标题 <h1></h1>~<h6></h6> 2、段落 <p align=" "></p> 3、换行 <br/> 4、水平线 <hr align=" " width=" " hieght=" " /> 5、强调 <b></b&g...
H5初认识
gaston的博客
12-10 485
1.H5并不是新的语言,而是html语言的第5次重大修改 2.支持所有主流浏览器 chrome,firefox,safari....IE9及以上,但是IE8及以下不支持h5. 3.改变了用户与文档的交互方式：多媒体：video audio canvas 4.增加了其他的新特性：语义特性 使代码更加规范，本地存储特性，网页多媒体，二维三维，特效（过渡,动画） 5.相对h4 1.进步：抛弃了一些不合理...
H5入门教程
最新发布
weixin_43416590的博客
07-20 1319
action属性表示后端的服务器地址，name表示名称，method表示数据提交的方式，与网络请求有关，一般有get和post两种。元素可分成很多类，具体可以参考如下的网址：https://developer.mozilla.org/en-US/docs/Web/HTML/Element，但是一些教程为了简单，按照块级元素和行内元素分类，这个分类具体可以参考如下网址：https://blog.csdn.net/weixin_46561196/article/details/115510852。
HTML5认知
tpl_01
08-07 491
性能不是问题，HTML5更具长期性。 如今大部分的yi
H5标签了解
qq_40132994的博客
09-21 432
CSS颜色的指定方式： 所有浏览器都支持： 16进制颜色 ：#rrggbb rgb :rgb(红，绿，蓝)每个参数定义亮度（0–255）之间或用百分比部分浏览器支持： rgba ：rgba(红，绿，蓝，alpha）alpha参数介于（0.0–1.0明度 hsl ：hsl(色相，饱和度，亮度） hsla ：hsla（色调，饱和度，亮度，透明度） 预定义/跨浏览器的颜色名称 ：颜
认识H5中Web Storage
Hei, Welcome To vickie's Blog，Good Good Study, Day Day Up ~
04-05 1366
认识h5中Web Storage Cookie的缺点 Web Storage对象 sessionStorage对象
H5前端学习之一HTML和CSS基础认识
小星星~的博客
02-13 674
初学前端
Html和CSS入门(笔记)—HTML
weixin_44595042的博客
02-26 1664
Html和CSS入门 第一章 Html介绍 1-1 代码初体验-Hello World网页 1-2 Html和CSS的关系 1-3 认识 Html标签 1-4 标签的语法 1-5 认识html文件基本结构 1-6 认识head标签 1-7 了解HTML的代码注释 第二章 认识标签（第一部分） 2-1 语义化，让你的网页更好的被搜索引擎理解 2-2 &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;body&
HTML课程入门
scf1542的博客
11-30 711
第1章 HTML课程 Day1 课程介绍 1. HTML的认识（了解） 2. HTML入门（掌握） 3. HTML标签（掌握） 4. 超连接 a（掌握） 一、HTML介绍（了解） 本章的学习知识内容： 什么是HTML？ 动态网页与静态网页 HTML，XHTML HTML的历史 HTML的开发工具 浏览器的认识 1.1 什么是HTML？ 我们可以在浏览器里打开任意一个网站页面，它就是一个HTML，当然你所见到的网页都离不开HTML，作为专业的前端工程师，HTML是必学的技能之一，那么我先来
技术小白浅谈对HTML5的认知和应用
weare_lucky的博客
02-22 371
浅谈对HTML5的认知和应用 在一次跟做前端开发的朋友聊天中，我开始了解前端，也开始对前端的开发产生了兴趣，由于现在互联网在人们生活中应用的范围越来越广，也决定了互联网未来的发展会越来越重要，因此我也想成为一名程序员，步入互联网的行业，所以我自己从网上开始了解相关的资料，自学的过程中更是感觉到编程当中的奇妙和乐趣，更是坚定了要成为一名程序员的决心，至此我加入了H5逆战班的学习当中。 我从一个无知小...
html5 常用 标签
weixin_30684743的博客
11-21 124
一、主体结构 header 页面头部，不同与<head></head> aside 边栏 nav 外部链接集合 section 章节或段落 article 类似文章、摘要或留言POST等形式的记录（一般搭配内嵌头部、尾部、底部结构使用） hggroup 类似子标题，标题信息、可选标题、TAG标签这样...
html5行内元素_HTML5标签
weixin_36275231的博客
01-20 313
HTML5新增了27个标签，废除了16个标签，依据现有的标准规范，按照优先等级将其定义为结构性标签、级块性标签、行内语义性标签、交互性标签4大类。下面一起来看一看。HTML5一、结构性标签结构性主要负责web的上下文结构的定义，确保HTML文档的完整性，包括以下标签；1、section：用于表达书的一章或一节内容；2、header：页面主体上的头部；3、footer：页面主体的尾部；4、nav：用...
HTML开发之（块级标签，行内标签，行内块标签）
weixin_33690367的博客
05-15 807
显示模式的特性： 主要分为两大类： 块级元素：独占一行，对宽高的属性值生效；如果不给宽度，块级元素就默认为浏览器的宽度，即就是100%宽； 行内元素：可以多个标签存在一行，对宽高属性值不生效，完全靠内容撑开宽高！ 其中还有一种结合两种模式有点的显示模式： 行内块元素：结合的行内和块级的有点，不仅可以对宽高属性值生效，还可以多个标签存在一行显示； 行内标签：包含a、span、em、...
H5标签分类
hongxheng的博客
09-24 829
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标签分类</title> </head> <body> 标签，被称为元素，也可以称为容器，作用：存储内容 内容：包含文字、图片、音频...
HTML5 ＜span＞ 标签
thgj0006的博客
04-25 1241
span> 用于对文档中的行内元素进行组合。 标签没有固定的格式表现。当对它应用样式时，它才会产生视觉上的变化。如果不对 应用样式，那么 元素中的文本与其他文本不会任何视觉上的差异。 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
html5 g标签,[H5]HTML5标签<canvas>
weixin_36300491的博客
06-19 953
[H5]HTML5标签包括创建canvas、canvas绘制图形、canvas绘制图片和createJS介绍。[index.html]Canvas标签#canvasID {width: 400px;height: 400px;background-color: #66CCFF;}#divID {width: 500px;height: 500px;background-color: cadetbl...
html5标签元素分类(块/行内/行内块)，和特点
zc010107的博客
11-22 217
块状元素/行内元素/行内块元素
易企秀H5页面制作教程：从入门到精通
微信H5页面制作并不复杂，只要熟悉工具和基本步骤，即使是没有经验的小白也能轻松上手。记得使用谷歌浏览器以获得最佳体验，同时手机端也有相应的制作工具客户端，便于随时随地进行创作。通过这个简易教程，你应该对...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值