不成对出现的标签 <br> <hr> <meta><img><input..><option..><link>
<p>标签 段落标签 <h1>--<h6>仅仅用于标题文本,
<strong> 用于强调文本 强度更深 表示重要文本 <b>标签 视觉加粗效果 单纯为了产生加粗
<em>用于强调文本 <i>只是视觉斜体效果 <strong>比<em>强调更强
—->空格 >—>大于号 <—>小于号 "—>大于号
<span>对被用来组合文档中的行内元素 当对它应用样式时,才会产生视觉上的变化
<pre>文字的格式按源码的排版来显示,我们称之为预处理格式
<a>他有一个必不可少的属性 href
target属性 _self(在原来页面打开) _blank(新窗口打开)
_top(打开时忽略所有的框架)_parent(在父窗口中打开)
创建锚点和锚链接
锚点也是一种超链接,是页面内进行跳转的超链接
第一步:创建锚点 <a name = “锚点名称”></a>
第二步:使用创建好的锚点名称 <a href="#锚点名称">内容</a>
常见图片格式jpg png gif Gif只支持全透明)Jpeg/jpgPng半/全透明都支持
图片标签写法 :<img src="" alt="" width="" height=""/>
图片四要素:
src=""图片路径
alt="图片含义"
width=""图片宽度 和图片大小保持一致
height=""图片高度 和图片大小保持一致
title=""
路径知识:
相对路径、绝对路径:
相对路径:(Relative Path) 相对于该文件的路径;
绝对路径:(Absolute Path) 从磁盘出发的路径;
<img src=" ".....align=""/> align属性–设置图片与后面文字的位置关系
值–top、bottom、middle、absmiddle、left、right
/开头表示根目录;
./表示当前目录;(斜画线前面一个点)
../上级目录;(斜画线前面两个点)
直接用文件名不带/也表示同一目录
这些都是相对于当前文件的位置来说的,如果用绝对路径的话就是写全了。
<ul> 无序列表
无序列表是一个没有顺序项目的列此列表项默认粗体圆点进行标识
<ol>有序列表
有序列表也是一列项目,只是列表项目使用的是数字进行标记。 有序列表始于<ol>标签。每个列表项始于<li>标签
无序列表-列表符号:
type="circle"空心圆type=“disc”实心圆 默认值type="square"方块符
有序列表-列表符号
type="A" A B C D
type="a" a b c d
type="1" 1 2 3 4 默认值
type=”I” I II III type=”i” i ii iii 罗马数字标识
定义列表以 <dl>标签开始 每个定义列表项以 <dt>开始 每个自定义列表项的定义以 <dd>开始
<dl></dl>用来创建一个普通的列表,
<dt></dt>用来创建列表中的上层项目,
<dd></dd>用来创建列表中最下层项目,
<dt></dt> 和<dd></dd>都必须放在<dl></dl>标志对之间
<form>表单标签
<form>
<input type ="text"/>
</form>
<form action=“html.do" method="get">
username: <input type ="text" name="users"/>
<input type="submit" value="提交"/>
</form>
<input>标签的掌握
常用type类型:<input type="" name="" value=”“/>
type="text"单行文本输入框
type="password"密码(maxlength="")
type="radio"单项选择(checked="checked")
type="checkbox"多项选择
type="button"按钮
type="submit"提交type="image"图片提交
type="file"上传文件
type="reset"重置
type="hidden"隐藏
<lable>元素不会向用户呈现任何特殊效果。标签的for 属性应当与相关元素的 id属性相同。
<lable for="male">男: </lable> <input type="radio" name="sex" id="male"/>
<lable for="nv”>女:</lable><input type="radio" name="sex" checked="check">
<textarea>文本域标签 rows表示这个文本域有多少行 cols表示这个文本域有多少列
<select>
<form>
<select name="" id="">
<option value="1">1月</option>
</select>
</form>
<table>的border属性不能少
<tr>可以定义表格中的一行
<td> 表示一个单元格
border-collapse属性设置是否将表格边框折叠为单一边框:
border-collapse:collapse;
colspan左右合并
rowspan上下合并
第一部分总结:
非可视化标签:headmetastylescrpit...
可视化标签:imgdivspanaulli…
只有可视化标签,才能用css改变它
单标签:metalinkbaseimginputbrhr
双标签:htmlheadbodydivapspan..ullioldl….
常用可视化标签
div
一般用它来布局
a超链接标签
href*属性:设置跳转的网页地址
target属性:设置跳转的目标
结论:凡事页面可以点击跳转或者表单提交的文字,都用a标签
img
src*属性用来设置图片的url数据
alt提供给搜索引擎搜索的
width
height
结论 :显示图片
ul li
列表
结论:只要将来设计页面中有固定样式的列表,就用ul和li
tablecaptiontrtd (th)
慢慢已经被淘汰了 被ul li代替
如果是合并竖排的就是合并行(rowspan)
如果是合并横排的就是合并列(colspan)