HTMLCSS入门教程--通过一个商城实例手把手教你学习PC端和移动端页面开发第2章HTML基础知识

本教程案例在线演示

有路网PC端
有路网移动端

免费配套视频教程

免费配套视频教程

教程配套源码资源

教程配套源码资源

网页开发工具

VSCode
或
WebStorm

HTML简介

HTML：Hyper Text Markup Language

html文本的内部基本结构

    
    
                
        
        
        

    

    

    
        
这是一个非常漂亮的网页
    

html的注释

  
      
          
      
      
          

          
        
这是我的第二个网页
  

         -->  

      
  

标题标签 ，段落标签，水平线，换行，加粗，斜体

    
    




一级标题标签
二级标题标签
三级标题标签
四级标题标签
五级标题标签
六级标题标签


第一次
今天天气真不错



    床前明月光

    疑是地上霜

    举头望明月

    低头思故乡









简介

    2008年设立人才实训中心

    2009年成为基地

列表标签

    
        
        
    
    
        
        

            
西红柿
            
大茄子
            
小辣椒
        

        

            
桃花源记
            
岳阳楼记
            
小石潭记
            
醉翁亭记
        

        
菜谱
        

            

                鱼香肉丝
                

                    
鱼
                    
香
                    
肉丝
                
            
            
宫保鸡丁
            
青椒肉丝
        

        

            
武松
            
景阳冈上的大虎英雄，战斗力99
            
后来打死西门大官人，后逃逸，出家为僧
            
武大
            
著名餐饮企业家，战斗力0
        

    

图像标签

常见的图像格式
JPG
GIF
PNG
BMP

图片的相对路径

所谓相对路径，就是相对于自己的目标文件位置。例如上面的例子，“11111111.html” 文件里引用了“11ha.jpg”图片，由于“11ha.jpg”图片相对于“11111111.html”来说，是在同一个目录的，那么在“11111111.html”文件里使用以下代码后：

只要这两个文件的相对位置没有变(也就是说还是在同一个目录内)，那么无论上传到Web服务器的哪个位置，在浏览器里都能正确地显示图片。

当图片在image文件夹里时：

src="image/11ha.jpg" alt="小女孩" />  

如果在image里很深的文件夹，也可以一直罗列下去：

如果html文件在比图片深一层的文件夹里：

如果html文件在比图片深两层的文件夹里，就在前面再罗列两个点“..”，深几层罗列几次。

图片在html文件上两级image文件夹中的renwu文件夹里

链接标签

链接文本或图像

href: 链接路径
target:链接在哪个窗口打开,常用值：_self、_blank