美文网首页
HTML5 基础第二讲

HTML5 基础第二讲

作者: fc4e54758f8d | 来源:发表于2016-05-13 17:41 被阅读103次

    今天主要讲解URL,图像,链接,表格,列表;相对于昨天今天更佳注重的是手写代码;

    URL简单介绍

    什么是URL?
    URL (Uniform Resource Locator) :统一资源定位器,用来标识网络中的任何资源;不管是我们的电脑还是服务器,都可以当作一个存储空间,用于存储我们的文件那么每当我们需要访问对应的文件的时候,我们就必须得知道我们的文件所处的地址,所以这是引入了我们的url,

    url的分类?
    1.绝对路径--指的是文件从最高级目录下开始的完整的路径,无论当前路径是什么,使用绝对路径总是能找到要链接的文件;
    2.相对路径--指的文件的位置是相对于当前文件的位置。它包括目录名,或指向一个可以从当前目录出发找到该文件的路径;
    3.根相对路径--指的是去掉绝对路径的协议头部,服务器域名后的部分;

    图像的简单介绍

    常用图像的分类?
    1.JPEG格式,文件压缩厉害,不支持透明;
    2.gif格式,文件压缩失真,但是却具有动画效果,由一组图片组成;
    3.png格式,又可分为三种格式,8位,24位,32位,24位不支持透明,但是支持动画,图片清晰度高;

    图片标签的使用!
    <img src="图片地址,可以是绝对地址也可以是相对地址" alt="图片加载失败的提示语,有利于seo优化">

    图片标签的常用属性:width,hegiht;和其他标签一样,设别百分比和px;

    链接标签的简单介绍
    使用a元素创建一个超级链接,语法如下:
    <a href="" target="">文本</a>
    href 属性,链接地址,点击a标签后加载的页面;
    target属性,取值有_blank,_self,默认是_self,表示点击之后当前页面直接加载,_blank表示打开一个新的页面加载对应的链接;

    链接的表现形式:
    1,下载资源,如果链接地址是一个压缩包地址,那么就是直接是下载;
    <a href="DAY02.zip">下载</a>
    2,打开一个链接
    <a href="http://www.baidu.com">百度一下</a>
    3,打开邮箱
    <a href="mailto:zouhao@lamco.com.cn">打开邮箱</a>
    4,没有作用的a,及打开空链接
    <a href="#">打开空链接</a>
    5,链接到js
    <a href="javascript:....">交接js</a>
    6,回到对应的地方
    <a name="zouhao">上面</a> <a href="#zouhao">回到上面<a>

    表格的简单介绍

    表格的作用?
    表格通常使用在统计数据这样的场景下,当然在我们web前端还有部分布局样式符合表单的我们使用表单布局;

    表格里面常用的标签
    1,table 表格标签;主要属性有width,height,bgcolor,align,border,cellpadding, cellspacing;
    2,tr 表格的行
    3,td 表格的单元格, 主要属性width,height,valign,align,colspan,rowspan;
    4,caption 表格的标题
    5,thead 表格的标头
    6,tbody 表格的主要内容
    7,tfoot 表格的尾部

    关于表格的使用我们最好自己代码试试这些属性,这里不做过多的说明;

    列表

    列表的分类:
    1,有序列表
    2,无须列表
    3,定义列表

    有序列表

    <ol type="列表类型" start="起始编号"> <li>…</li> <li>…</li> … </ol>
    属性type取值有1,A,a,i,I分别代表数字,大写字母,小写字母,小写阿拉伯数字,大学阿拉伯数字;
    start属性表示开始的值

    无须列表

    <ul type="列表类型" > <li>…</li> <li>…</li> … </ul>
    type决定了样式,这个可以直接网上搜搜,学习的时候一定知道怎么去学习;

    定义列表

    <dl> <dt>计算机</dt> <dd>用来计算的仪器 ... ...</dd> <dt>显示器</dt> <dd>以视觉方式显示信息的视备</dd> </dl>
    这种列表大部分适用于解释型的操作;

    今天的主要内容就这么多了,明天再继续!

    相关文章

      网友评论

          本文标题:HTML5 基础第二讲

          本文链接:https://www.haomeiwen.com/subject/kocmrttx.html