01 HTML基础

1.web基础

• web标准:(万维网-w3c:)

    结构标准:HTML -- 决定网页上有什么内容
    表现标准:CSS -- 决定网页上内容的布局和显示方式
    行为标准:JavaScript -- 决定网页上动态的效果
  

• HTML

  html--超文本标记语言(可以用来标记文本, 图片, 视频, 音频, flash, 按钮, 输入框等内容).
  html不是编程语言,不会编译执行,语法错误也不会报错导致程序不能往后运行
  html语法不区分大小写

• HTML版本

  广义的H5:指HTML5+CSS3+js
  狭义的H5:HTML5

• 标签/标记

  • a.双标签(常规标签)
    <标签名 属性=属性值 属性=属性值>内容内容
  • b.单标签
    <标签名 属性=属性值 属性=属性值 />

  说明:
标签名:内置的命名,固定的,不能自己命名(注意:<和标签名之间不能留空白)
  属性:属性和标签名之间用空格隔开,以属性=属性值的形式存在,多个属性之间也用空格隔开
           (属性可以使html标准中的属性,也可以是自己定义的属性)
  标签内容:是指开始标签和结束标签之间的内容.标签的内容可以是任何内容.

(1)标题标签

hello world
hello world

效果同markdown语法中的#和##(标题大小跟h后的数字有关)

(2)段落标签

段落标签

,

• a.一个p标签对应一个段落,段落之间默认有空行.
• b.p标签里用回车,网页上显示出来的内容并不会换行. (空格只会生效一次)

(3)文本符号

  -- 空格
或者 -- 加粗

-- 换行

(4)超链接

网页上点击后可以跳转的标签都是超链接
href属性:跳转到对应的地址(可以使网络地址,也可以是本地地址)
a.网络地址
b.本地地址(当前工程里的其他htm文件路径)
c.如果为空,则刷新页面,回到页面顶部
d.选择器:让网页滚动到网页上的任意的位置
target属性:超链接的打开方式
a._self 在当前页面打开超链接(默认效果)
b._blank 在新的页面打开超链接
c._top 返回当前页顶部,但是前面的href要设置成#或者为空.

百度一下
百度一下

(5)图片

src属性:(本地地址,网络地址)

• 本地地址:
  a.绝对路径(相对于工程目录)
  b.相对路径
• 网络地址:超链接
  b.title属性:鼠标放上去时显示的提示信息
  c.alt属性:如果图片加载失败,则用alt中的文字替代显示

效果如图:

图片.png

2.列表

根据要显示的内容可以选定不同的列表样式

            

                
语文
                
数学
                
英语
            
        
        
            

                
成都
                
重庆
                
达州
            
        
        
            

                
羊肉火锅:
                
羊肉火锅不好吃
                
羊肉火锅真的不好吃
                
牛肉火锅:
                
牛肉火锅很好吃
                
牛肉火锅真的很好吃
            

如图所示

3.表格

table--代表一个表格( tr -- 代表一行, td -- 代表一列)
一个表格中可以有多行,一行有多列
表格的属性:

• a.border:设置整个表格中边框的宽度
• b.width:设置整个表格的宽度
• c.height:设置整个表格的高度(每一行均分)
• d.align:在table里面设置为center:让整个表格在其父标签中居中
      在tr里面设置center,使这一行中的单元格内容居中
      在td里面设置center,使得这个单元格的内容居中.其他无影响
• e.cellpadding:设置单元格内容与单元格的间距
• f.cellspacing:设置单元格和单元格之间的间隙
      注意:所有的属性值都必须用""括起来
• g.rowspan:跨行合并
• h.colspan:跨列合并
  实例:

            

                
电子邮件
                
[email protected]
                
手机号码
                

            
            

                
教育经历
            
            

                
起止时间
                
毕业院校/教育机构
                
专业课程
            
            

                

                

                

            
            

                

                

                

            
        

如图