美文网首页
day1-HTML基础

day1-HTML基础

作者: PeppaTang | 来源:发表于2018-08-13 20:12 被阅读0次

    1.web标准(万维网-w3c):
    结构标准:HTML --- 决定网页上有什么东西(能够显示什么内容)
    表现标准: CSS --- 决定网页上内容的布局和显示方式
    行为标准: JavaScript(js) --- 决定网页上动态的效果

    2.认识HTML
    HTML是超文本标记语言(可以用来标记文本、图片、视频、音频、flash、按钮、输入框等内容)。

    HTML不是编程语言,不会编译执行,语法错误也不会报错导致程序不能往后运行。

    3.HTML版本
    广义的H5:指HTML5+CSS3+js
    狭义的H5:HTML5

    4.HTML编程
    a.HTML标记语言对应的文件的后缀,一般都是html

    b.HTML的结构:整个html是通过不同的标记来组成

    5.标签/标记
    a.双标签(常规标签)
    <标签名 属性=属性值 属性=属性值>标签内容</标签名>
    b.单标签(自闭合标签)
    <标签名 属性=属性值 属性=属性值 />
    <标签名 属性=属性值 属性=属性值>

    说明:
    标签名:HTML标准中固定的(注意:<和标签名之间不能有空白)
    属性:属性和标签名之间用空格隔开,以属性=属性值的形式存在,多个属性之间也用空格隔开
    (属性可以是HTML标准中的属性,也可以是自定义的属性)
    标签内容:是指开始标签和结束标签之间的内容。标签的内容可以是任何内容(可以是字符串,也可以是其他任何标签)
    <a></a> --- a标签
    <p></p> --- p标签
    <input> --- input标签

    补充: HTML语法中,不区分大小写(HTML\html\HtMl是一样的)

    列表

    有序列表

    <ol>
    <li>语文</li>
    <li>数学</li>
    <li>英语</li>
    </ol>

    无序列表

    <ul>
    <li>成都</li>
    <li>重庆</li>
    <li>北京</li>
    </ul>

    自定义列表

    <dl>
    <dt>城市:</dt>
    <dd>成都</dd>
    <dd>重庆</dd>
    <dd>合肥</dd>
    <dt>省份:</dt>
    <dd>四川</dd>
    <dd>安徽</dd>
    <dd>湖南</dd>
    </dl>

    城市:
           成都
           重庆
           合肥
    省份:
           四川
           安徽
           湖南
    

    图片和超链接

    1.图片标签(img)

    a.src属性:图片的地址(本地地址、网络地址)
    本地地址:相对路径(相对于工程目录)
    注意:本地图片需要放到工程目录下的img文件夹下
    b.title属性:图片的标题(鼠标停留在图片上,隔一段时间才显示出来)
    c.alt属性:图片加载失败后显示的提示信息

    <img id="image1" alt="图片加载失败" title="山治" src="img/luffy.png"/>      
    

    超链接(a)

    网页上点击后可以跳转的标签都是超链接

    href属性:
    跳转地址(本地地址,网络地址)
    网络地址:跳转到对应的网页
    本地地址: 当前工程的其他的html文件路径
    选择器:让网页滚动到网页上的任意的位置

    target属性
    _self(默认的): 在当前页面中打开href的地址
    _blank: 在新的页面中打开href的地址

    表格

    table -- 标签代表这个表格
    tr -- 代表的是一行
    td -- 代表的是列(一个td对应一个单元格)

    table属性:

    1.border:设置整个表格中边框的宽度
    2.width:设置整个表格的宽度
    3.heigt:设置整个表格的高度(每一行的高度是一样的)
    4.align:center -- 让整个表在其父标签中居中
    5.bgcolor: 背景颜色
    6.cellpadding="100": 设置内容和单元格之间的间距(了解)
    7.cellspacing: 设置 单元格和单元格之间的间隙

    tr属性:

    1.height: 设置单独的某一行的高度
    2.align:center -- 让当前行里面的所有的单元格中的内容居中
    3.bgcolor: 背景颜色

    td属性:

    1.width: 设置某一列的宽度
    2.align:center -- 让某一个单元格中的内容居中
    3.bgcolor: 背景颜色

    rowspan:合并行
    colspan:合并列

    相关文章

      网友评论

          本文标题:day1-HTML基础

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