文章目录
HTML标签
(1)一般的常见标签:
<strong>加粗标签</strong><b>加粗标签</b>
<em>斜体标签</em><i>斜体标签</i>
<ins>下划线标签</ins><u>下划线标签</u>
<del>删除线标签</del><s>删除线标签</s>
<div>块级标签</div>
<span></span>
<h>标题标签</h>//标题标签一共六个,分别为h1-h6
<p>段落标签</p>
插入图片单标签<img src="url" />
强制换行单标签</br>
生成水平向标签</hr>
<a href="" target"" >超链接标签</a>
//在target中_self为在当前页面打开
//_blank为在额外窗口打开。
其中超链接标签中不仅仅可以添加文字,图片,音频等也可以添加超链接标签,放在a标签之中即可。
加粗标签、斜体标签、下划线标签和删除线标签推荐用strong em ins 和del 。但在实际操作过程中我们更偏向于用结构和样式相分离,用css修改样式更符合习惯。
div和span则是我们之后经常用到的块级标签。hr标签同样不常使用。
需要注意的是:浏览器会移除源代码中的空格和空行,所有的连续空格都会被算作一个空格。需要注意的是,HTML代买中所有连续的空行(换行)也会被显示为一个空格。所以我们需要特殊字符来辅助显示,例如 (空格符)
<a href=”#名字”>锚点链接</a>
//点击超链接中文字后会自动转到锚点位置。
<p id=”名字”></p>
(2)表格标签
<table>
<tr>
<td>我是单元格</td>
</tr>
</table>
在表格标签中,tr标签用于定义表格中的行,必须嵌套在table标签之中。
td则用于定义表格中的单元格,必须嵌套在tr标签当中。
表格的属性:
<table align=" " border="" cellpadding="" cellspacing="">
</table>
<table cellpadding="" cellspacing="" width="">
</table>
在table中这五个标签定义了表格的属性:
1.align定义了表格相对周围元素的对齐方式
2.border规定表格单元是否有边框,默认为没有边框
3.cellpadding规定单元边沿与其内容之间的空白,默认为1像素
4.cellspacing规定单元格之间的空白,默认为2像素
5.width则规定了表格的宽度
另外,将表格标签嵌套在thead和tbody标签中会使结构更加清晰。
合并单元格:
首先确定需要跨行合并还是跨列合并,然后找到目标单元格,写上合并方式,这里以跨列合并为例。最后删除多余的单元格即可。
(3)列表标签:
无序列表
<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
...
</ul>
注意:
1.无序列表顾名思义,各个列表项之间没有顺序级别之分,是并列的。
2.ul中只能嵌套li标签,直接在ul标签中输入其他标签或者文字的做法是不被允许的。
3.li与之间相当于一个容器,可以容纳所有元素。
4.无序列表会带有自己的样式属性(例如li之前的圆点),但在实际使用时,我们会使用css来设置。
有序列表
<ol>
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
...
</ol>
列表的注意点大致相同,参照ul注意点即可
自定义列表
<dl>
<dt>标题</dt>
<dd>解释1</dd>
<dd>解释2</dd>
</dl>
(4)表单标签:
<form action="" method="" name="" >
<input type="">
</form>
form之中的元素到时可以直接提交到后台进行数据处理。input为单标签,type属性设置不同的属性值同来指定不同的控件类型。
type属性值如下:
(5)label标签:
<label for="yes">正确</label>
<input type="radio" name="yes" id="yes" />
label标签为input标签定义标注,当点击label标签内的内容是,浏览器会自动将光标转到对应的表单元素上来增加用户体验。
(6)下拉菜单&表单元素
<select>
<option select="seleceted">选项1</option>
<option>选项1</option>
...
</select>
注意,在下拉菜单中select中至少包含一对option,在option额中定义select=“selected”时,当前即为默认选中项。
<textarea row="3" cols="20">
文本内容
</textarea>
1.通过textarea标签可以轻松地创建多行文本输入框
2.cols,rows分别显示每行字符数和每行行数,但实际中还是css用的较多
浏览器概览
浏览器:浏览器是用来检索、展示以及传递Web信息资源的应用程序。Web信息资源由统一资源标识符( Uniform Resource Identifier,URI)所标记,它是一张网页、一张图片、一段视频或者任何在Web上所呈现的内容。使用者可以借助超级链接( Hyperlinks),通过浏览器浏览互相关联的信息。
浏览器的种类很多,但是主流的内核只有四种,各种不同的浏览器,就是在主流内核的基础上,添加不同的功能构成。
(1)Trident内核
代表产品为Internet Explorer,又称其为IE内核。Trident(又称为MSHTML),是微软开发的一种排版引擎。使用Trident渲染引擎的浏览器有:IE、傲游、世界之窗浏览器、Avant、腾讯TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等 [3] 。
(2)Gecko内核
代表作品为Mozilla Firefox。Gecko是一套开放源代码的、以C++编写的网页排版引擎,是最流行的排版引擎之一,仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9 [3] 。
(3)WebKit内核
代表作品有Safari、Chrome。WebKit是一个开源项目,包含了来自KDE项目和苹果公司的一些组件,主要用于Mac OS系统,它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高,导致一些编写不标准的网页无法正常显示 [3] 。
(4)Presto内核
代表作品Opera。Presto是由Opera Software开发的浏览器排版引擎,供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎,包括加入动态功能,例如网页或其部分可随着DOM及Script语法的事件而重新排版 [3] 。
主流浏览器分类:
(1)IE浏览器
IE浏览器是微软推出的Windows系统自带的浏览器,它的内核是由微软独立开发的,简称IE内核,该浏览器只支持Windows平台。国内大部分的浏览器,都是在IE内核基础上提供了一些插件,如360浏览器、搜狗浏览器等 。
(2)Chrome浏览器
Chrome浏览器由Google在开源项目的基础上进行独立开发的一款浏览器,市场占有率第一,而且它提供了很多方便开发者使用的插件,因此该浏览器也是本书开发的主要浏览器。Chrome浏览器不仅支持Windows平台,还支持Linux、Mac系统,同时它也提供了移动端的应用(如Android和iOS平台) 。
(3)Firefox浏览器
Firefox浏览器是开源组织提供的一款开源的浏览器,它开源了浏览器的源码,同时也提供了很多插件,方便了用户的使用,支持Windows平台、Llnux平台和Mac平台 [4] 。
(4)Safari浏览器
Safari浏览器主要是Apple公司为Mac系统量身打造的一款浏览器,主要应用在Mac和iOS系统中 。