day29-总结（html篇）

初识html5

web基础：

• 1.web标准：
  结构标准：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标签

---p标签
---input标签

补充：HTML语法中，不区分大小写(HTML\html\HtMl都可以)

html网页最基本架构

• html标签代表整个网页

• head标签中的内容一般都看不见，并且里面的子标签是固定：
  title标签 --- 设置标题
  meta标签
  link标签
  style标签
  script标签
  base标签

html的文本标签

• 1.标题标签(h1-h6)

        
我是标题1
        
我是标题2
        
我是标题3
        
我是标题4
        
我是标题5
        
我是标题6
错误的标签

• 2.段落标签(p)
  a.一个p标签对应一个段落
  b.p标签的内容结束后会和其他的内容之间默认有一个空行

        
python1805
        
python1805

• 3.文本符号
    ---空格
  其他的查手册

        
    python1805

• 4.换行标签(br)

        
床前明月光
疑是地上霜

• 5.超链接(a)

        百度一下

• 6.文字加粗(b/strong) strong带有强调的效果

        
举头望明月
低头思故乡

• 7.文字倾斜(i/em) em带有强调的效果-->

        
李白

• 8.水平线

html中的图片和超链接

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

• 2.超链接
  网页上点击后可以跳转的标签都是超链接
  href属性：跳转地址
  本地地址：当前工程的其他的html文件路径
  网络地址：跳转到对应的网页
  空串/#：刷新页面回到顶部
  选择器：让网页滚动到网页上的任意的位置
  target属性：
  _self：在当前页面中打开href的地址
  _blank：在新的页面中打开href的地址
  a.点击文字跳转(本地地址，网络地址)

        百度一下
        回到顶部
        主页

• b.点击图片跳转

html中的列表

• 有序列表 ol

        

            
语文
            
数学
            
英语
        

• 无序列表 ul

        

            
成都
            
遂宁
            
绵阳
        

• 自定义列表 dl

        

            
城市：
            
成都
            
重庆
        

html中的表格

table表格属性

• 1.border：设置整个表格中边框的宽度
• 2.width：设置表格的宽度
• 3.height：设置表格的高度
• 4.align：center 让整个表在其父标签中居中
• 5.bgcolor：背景颜色
• 6.cellpadding：设置内容和单元格之间的间距
• 7.cellspacing：设置单元格和单元格之间的间隙

tr属性：

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

td属性：

• 1.width：设置列宽
• 2.align：center 让单元格内容居中
• 3.bgcolor：背景颜色

            
信息表
            

                
姓名
                
成绩
                
是否留级
            
            

                
小明
                
90
                
否