html5基础知识第二章标签

时间:2023-01-01 12:25:59

以下内容是学习期间整理,有些语句是便于理解,便于快速入门写的。并不权威html5基础知识第二章标签

标题标签:
h1~h6 随着数字越大,字体越小,理论上h1只有一个
<body>
	<h1>我是标题标签h1</h1>
	<h2>我是标题标签h2</h2>
	<h3>我是标题标签h3</h3>
	<h4>我是标题标签h4</h4>
	<h5>我是标题标签h5</h5>
	<h6>我是标题标签h6</h6>
</body>

段落标签(p):
<p>段落标签</p>

字体标签(font):
学习css以后就不用这样写
字体 ========= face="微软雅黑";
字体大小 ========= size="12px";
字体颜色 ========= color="#000";
<font face="微软雅黑" size="14px" color="red">font文字标签</font>

span标签:
对某个文字修饰,用的比较少
<span>非段落标签</span>

超链接(a):
超链接一般都自带下划线,可以通过css样式的text-decoration:"none"消除掉
能在当前页面不跳转的尽量不跳转,跳转不利于搜索
<a href="#">超链接,刷新页面</a><br />
<a href="http://blog.csdn.net/qq_19558705">在当前页面上打开新页面</a><br />
<a href="http://blog.csdn.net/qq_19558705" target="_blank">在新标签页面打开</a><br />
<a href="javascript:void(0)">超链接,不刷新页面,比第一种好</a><br /><br />

strong/b标签:
文字加粗,b单纯的加粗, strong 除了加粗以外,还利于搜索引擎的优化
<p><b>b标签加粗</b>段落标签<strong>strong标签加粗</strong></p>

marquee滚动标签:
<marquee>我是滚动标签marquee,默认是向左移动</marquee>
<marquee direction="right">我是有方向的滚动标签向右移动</marquee>

图片标签(img):
图片标签四要素:src (图片来源);width(图片宽度);height(图片高度);alt(图片介绍);
其实显示图片只需要src即可,但为了利于搜索引擎的优化建议把后面三项加上
<img src ="与html文件同级的本地图片.jpg" width="1440" height="900" alt="" title="大家好"/>
<img src = "images/123.gif" width="250" height="311" alt="" title="=。="/>

三种列表(ul,ol,dl):
ul:无序列表
disc是实心圆点
circle是空心圆点
square是实心正方型点
一般用ul li {list-style:none;}消除前面的点
ul非常有用,可以用于做导航等;老实说初学html5的时候只觉得ul li标签很有用,可以做导航,做轮展图;现在用插件比较多,为了项目的快速开发。比如做导航可以用Mmenu(Mmenu学习)轮展图可以用bootstrap的插件,瞬间觉得之前学的都白学了。其实基础还是要有的,不出错还好,出错都不造怎么开始找问题。之前因为一个简单的jquery问题花了近两小时。html5基础知识第二章标签
<ul type ="disc">
	<li>111</li>
	<li>222</li>
	<li>333</li>
</ul>

ol:有序列表
A,a,I,i都可以
<ol type="A">
	<li>项目1</li>
	<li>项目2</li>
	<li>项目3</li>
</ol>

dl:自定义列表
<dl>
	<dt>自定义列表项1</dt>
	<dd>列表项1</dd>
	<dd>列表项2</dd>
	<dt>自定义列表项2</dt>
	<dd>列表项3</dd>
	<dd>列表项4</dd>
</dl>

特殊符号:
空格 ======== &nbsp;
大于号 ======== &gt;
小于号 ======== &lt;
版权符号 ======== &copy;
引号 ======== &quot;

a标签 锚点技术(现在一般用js完成):
<!doctype html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>锚点-demo</title>
		<meta name="Keywords" content="a标签锚点">
		<meta name="Description" content="">
		<style type="text/css">
			*{margin:0;padding:0;}
			body{font-family:"微软雅黑";color:#fff;}
			a{margin:auto;}
			.box1,.box2,.box3,.box4{width:600px;height:400px;border:1px solid #666;margin:auto;}
			.box1{background:#066;}
			.box2{background:#f66;}
			.box3{background:#c03;}
			.box4{background:#369;}
		</style>
	</head>
	<body>
		<a name="top"></a>
		<a href="#box1">box1</a> | <a href="#box2">box2</a> | 
		<a href="#box3">box3</a> | <a href="#box4">box4</a>
		<div class="box1"><a name="box1">box1</a></div><a href="#top">top</a><br /><br />
		<div class="box2"><a name="box2">box2</a></div><a href="#top">top</a><br /><br />
		<div class="box3"><a name="box3">box3</a></div><a href="#top">top</a><br /><br />
		<div class="box4"><a name="box4">box4</a></div><a href="#top">top</a><br /><br />
	</body>
</html>

本人学的是后台java开发,前端只是简单的学习,如有不对的地方可以留言。ITDragonhtml5基础知识第二章标签

更多干货等你来拿 http://www.itit123.cn/