html5中的一些标签学习(心得)


Posted in HTML / CSS onOctober 18, 2016

今天看手册学习到了HTML5很多属性。现在总结如下

<body bgcolor="BED1A2" text="FFFFFF" link="yellow" alink="red" vlink="blue">

Background用来设定页面的背景,后面是图片的地址

Bgcolor 用来设定页面的背景颜色。后面是颜色或者十六进制数字

Text 用来设定没有超链接的字体颜色

 Link用来设定超链接的字体颜色

 alink 用来设定超链接点击时的颜色

Vlink用来设定超链接点击过后的字体颜色

<a href=” 3water.com” > 三水点靠木</a>

<a name=” 3water.com”>页面跳转的地方</a>

<nav>用来将具有导航性质的链接划分到一起如

<nav>

<a href=” #” > 三水点靠木</a>

<a href=” #” > 三水点靠木</a>

<a href=” #” > 三水点靠木</a>

</nav>

 
H<sub>2</sub>SO<sub>4</sub>

<sub>是下标所使用的标签</sub>

<sup>是上标所使用的标签</sup>

分别从标题一到标题六。字体逐渐缩小,并自动换行

<h1></h1>

<h2></h2>

<h3></h3>

<h4></h4>

<h5></h5>

<h6></h6>

<img src="1.jpeg" width="500" height="auto">

Img是插入图片的标签,width为图片的宽度。Height为图片的高度可以为其填写数值,也可以填写auto(按比例缩放)src中“为图片的地址和后缀名”

<font size="5px" font color=”red”>这是一个关于三水点靠木的网站</font>

size定义字体的大小,后跟px(像素)

color定义字体的颜色

换行 <br/>

水平分割线<hr>

  <!-- 颜色为红色的水平线 -->

  <hr color="red"/>

  <!-- 对齐样式(左/居中/右)和水平线的宽度结合使用 -->

 <hr align="left/cener/right" />

 <!-- 宽度为50%的水平线 -->

 <hr width="50%"/>

 <!-- 高度为50像素的水平线 -->

 <hr size="50"/>

 <!-- 去掉阴影的水平线 -->

 <hr noshade="noshade">

附代码

XML/HTML Code复制内容到剪贴板
  1. <!doctype html>  
  2.   
  3. <html>  
  4.   
  5.  <head>  
  6.   
  7.   <meta charset="UTF-8">  
  8.   
  9.   <title>20161017</title>  
  10.   
  11.  </head>  
  12.   
  13.  <body bgcolor="BED1A2" text="FFFFFF" link="yellow" alink="red" vlink="blue">  
  14.   
  15.  <h1>枫桥夜泊</h1>  
  16.   
  17.  <h5>张继</h5>  
  18.   
  19.  <h3>月落乌啼霜满天,</h3>  
  20.   
  21.  <h3>江枫渔火对愁眠。</h3>  
  22.   
  23.  <h3>姑苏城外寒山寺,</h3>  
  24.   
  25.  <h3>夜半钟声到客船。</h3>  
  26.   
  27.  <a href=""www.baidu.com" >baidu</a></br>  
  28.   
  29. 跳转到页面的另外一个地方:</br>  
  30.   
  31.  <a name="www.baidu.com">111</a></br>  
  32.   
  33.   H<sub>2</sub>SO<sub>4</sub><br/>  
  34.   
  35. <img src="1.jpeg" width="500" height="auto"><br/>  
  36.   
  37. <img src="5.jpg" align=top> 实例  <br/>  
  38.   
  39. <img src="5.jpg" align=middle> 实例  <br/>  
  40.   
  41. <img src="5.jpg" align=bottom> 实例 <br/>  
  42.   
  43. 只有一行文字才可以放在图象的两边。   
  44.   
  45. <!-- 边框像素为15的图片 -->  
  46.   
  47. <img src="5.jpg" border=15/>  
  48.   
  49. <br/>  
  50.   
  51.   <font size="5px" font color="red">这是一个关于百度的网站</font><br/>  
  52.   
  53.   <font size="20px">这是一个关于百度的网站</font><br/>  
  54.   
  55.   <!-- 颜色为红色的水平线 -->  
  56.   
  57.   <hr color="red"/>  
  58.   
  59.   <!-- 对齐样式(左/居中/右)和水平线的宽度结合使用 -->  
  60.   
  61.  <hr align="left/cener/right" />  
  62.   
  63.  <!-- 宽度为50%的水平线 -->  
  64.   
  65.  <hr width="50%"/>  
  66.   
  67.  <!-- 高度为50像素的水平线 -->  
  68.   
  69.  <hr size="50"/>  
  70.   
  71.  <!-- 去掉阴影的水平线 -->  
  72.   
  73.  <hr noshade="noshade">  
  74.   
  75.  <div align=left border="1px" >  
  76.   
  77. 你知道我在等你吗<br>  
  78.   
  79. 你可能不懂   
  80.   
  81. </div>  
  82.   
  83.  </body>  
  84.   
  85. </html>  

以上就是小编为大家带来的html5中的一些标签学习(心得)全部内容了,希望大家多多支持三水点靠木~

HTML / CSS 相关文章推荐
收集的22款给力的HTML5和CSS3帮助工具
Sep 14 HTML / CSS
CSS3悬停效果案例应用
Nov 21 HTML / CSS
一款基于css3的列表toggle特效实例教程
Jan 04 HTML / CSS
css3利用transform变形结合事件完成扇形导航
Oct 26 HTML / CSS
css3动画鼠标放上图片逐渐变大鼠标离开图片逐渐缩小效果
Jan 27 HTML / CSS
HTML5 WebGL 实现民航客机飞行监控系统
Jul 25 HTML / CSS
基于HTML5 audio元素播放声音jQuery小插件
May 11 HTML / CSS
html5各种页面切换效果和模态对话框用法总结
Dec 15 HTML / CSS
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
May 18 HTML / CSS
用canvas显示验证码的实现
Apr 10 HTML / CSS
iframe与window.onload如何使用详解
May 07 HTML / CSS
解析CSS 提取图片主题色功能(小技巧)
May 12 HTML / CSS
HTML5+CSS3实现机器猫
Oct 17 #HTML / CSS
html5将图片转换成base64的实例代码
Sep 21 #HTML / CSS
CSS3 画基本图形,圆形、椭圆形、三角形等
Sep 20 #HTML / CSS
html5本地存储 localStorage操作使用详解
Sep 20 #HTML / CSS
使用Html5实现异步上传文件,支持跨域,带有上传进度条
Sep 17 #HTML / CSS
a标签下载链接的简单实现
Sep 13 #HTML / CSS
HTML5新增加的功能详解
Sep 05 #HTML / CSS
You might like
php递归实现无限分类生成下拉列表的函数
2010/08/08 PHP
PHP中全面阻止SQL注入式攻击分析小结
2012/01/30 PHP
详解PHP中strlen和mb_strlen函数的区别
2014/03/07 PHP
php实现对象克隆的方法
2015/06/20 PHP
php 替换文章中的图片路径,下载图片到本地服务器的方法
2018/02/06 PHP
Javascript学习笔记5 类和对象
2010/01/11 Javascript
jquery 单引号和双引号的区别及使用注意
2013/07/31 Javascript
jQuery过滤选择器详解
2015/01/13 Javascript
Jquery实现顶部弹出框特效
2015/08/08 Javascript
Es6 写的文件import 起来解决方案详解
2016/12/13 Javascript
JS匹配日期和时间的正则表达式示例
2017/05/12 Javascript
原生JS实现的跳一跳小游戏完整实例
2019/01/27 Javascript
Vue项目实现简单的权限控制管理功能
2019/07/17 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
浅析vue-router实现原理及两种模式
2020/02/11 Javascript
Python操作MySQL简单实现方法
2015/01/26 Python
python机器学习理论与实战(四)逻辑回归
2018/01/19 Python
python3+PyQt5实现文档打印功能
2018/04/24 Python
详解解决Python memory error的问题(四种解决方案)
2019/08/08 Python
使用selenium和pyquery爬取京东商品列表过程解析
2019/08/15 Python
Python环境Pillow( PIL )图像处理工具使用解析
2019/09/12 Python
使用Python的datetime库处理时间(RPA流程)
2019/11/24 Python
pytorch masked_fill报错的解决
2020/02/18 Python
keras 指定程序在某块卡上训练实例
2020/06/22 Python
Python 爬取淘宝商品信息栏目的实现
2021/02/06 Python
matplotlib之pyplot模块坐标轴标签设置使用(xlabel()、ylabel())
2021/02/22 Python
美国专业消费电子及摄影器材网站:B&H Photo Video
2019/12/18 全球购物
英国顶尖手表珠宝品牌独家授权经销商:HS Johnson
2020/10/28 全球购物
酒店管理专业学生求职信
2013/09/27 职场文书
就业推荐自我鉴定
2013/10/06 职场文书
感恩老师的演讲稿
2014/05/06 职场文书
学生安全责任书范本
2014/07/24 职场文书
依法行政工作汇报材料
2014/10/28 职场文书
教师群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
小学班主任经验交流材料
2014/12/16 职场文书
读《人生的智慧》有感:闲暇是人生的精华
2019/12/25 职场文书