初识HTML

<!doctype html> //!doctype是防止出现乱码
<html>
   <head>
       //在学习网页前我们首先要了解一些基本的概念
        Internet  代表的是网络
        www 万维网
        url 网址
        DNS 域名解析系统
        Http超文本传输协议
        https ssl+http可进行加密传输
        web 网页
        w3c 万维网联盟       

    //head是一个头部标签它是用来定义css样式的以及程序员来写一写注释之类的
    //不会显示在浏览器上
       <title></title>放的是网页的标题要包含在head标签内
   </head>
   <body>
     //身体标签是用来写网页的东西的会在浏览器中显示
     HTML中的标签又分为两类 双标签和单标签/又叫自结束标签/体标签
     在HTML中的标签有
     1:网页中的段落小标题 
        <h1></h1>
        <h2></h2>
        <h3></h3>
        <h4></h4>
        <h5></h5>
        <h6></h6>
        //html中的标签分为6个段落标签
      2<b></b><strong></strong>设置字体加粗显示
         <i></i><em></em>标签设置字体倾斜
         <s></s><del></del>标签设置字体删除线
         <u></u><ins></ins>标签设置字体下滑线
      3:在HTML中的体标签
         <br/>换行标签
         <hr/>分隔线标签
      4:在HTML中的字体标签
         <span></span>
         段落标签
         <p></p>
         字体标签
         <font></font>
         时间标签
         <time></time>
         时间标签有两个属性
         datetime属性 和pubtime属性
         datetime属性一般是设置时间的 pubtime属性默认是pubtime
      5:在html中我们为标签中的内容设置属性和样式
         一般我们是这样讲
         html控制的是网页的结构 
         css控制的是网页的表现
         javascript控制的是网页的表现
         什么是结构内结构就是一个框架就是你的表现和行为都要放在结构里面
         就好像是一个房子里面什么也没有
         css就像是房子里的家具和装修
         js就像是我们人在使用这些东西
      6:网页中的img标签它是在网页中引用图片的标签
         <img></img>
         该标签中包含两个主要的属性一个是 src属性,一个是 alt
         src属性是解析图片的路径用的
         而图片的路径又分为绝对路径和相对路径
         绝对路径你又可以将它理解为带盘符的路径和一个完整的网址
         相对的路径就是相对有目录而言的
         alt添加对图片的描述的在图片不显示的时候会显示alt的描述也可以讲时让搜索引擎更好
         的解析图片
      7HTML中的块状元素
         <div>我是一个块元素我独占一行</div>
      8:在HTML中的特殊的字符标签
         &lt 小于号< , &gt 大于号 > , &copy 版权符号 &reg 注册商标 &deg 摄氏度 &rmp 和号 &nbsp是空格     
      9:html网页中的属性
         width 图片的宽度

         height 图片的高度 

         vspace 垂直边距

         hspace 水平边距

         src 图片的路径
  
         alt 图片的描述

         border 图像边框的宽度

         align 
        
           它包含多个属性left 左对齐
                     right 右对齐
                     top 图像顶端和文本第一行文字对齐其它的位于图像的下面
                     middle 图像的中部和文本的第一行文字对齐其他的位于图像的下方
                     此外它还有 center属性值等......
                       
       10:图片的三种格式 gif png jpf
         gif 它支持动画是无损的图片格式支持 全透明和全部透明 颜色图像的颜色不能超过256中
         png 它不支持动画它支持alpha透明(全透明 ,半透明 ,全不透明)颜色图像的颜色不能超过256中
         jpg  有损的图像格式可以保存超过256中颜色的图像类似于照片   
         三种格式的的基本使用情况
         小图片考虑gif或是png-8 半透明的考虑是png 类似照片类的图像考虑jpg
   </body>
<html>

案例演示:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>每日提升一点点</title>
		<style>
			mark{
				background-color: aquamarine;
			}
		</style>
	</head>
	<body>
		<!--
        	作者:offline
        	时间:2020-07-10
        	描述:> huang 
        -->
        <h2 align = "center">书单</h2>
        <img src="picture/u=3140948597,2600938108&fm=15&gp=0.jpg" alt="影响力" width="80px"/>
        <hr color=#7FFFD4 size="2"/>
        <p align="left">&lt;影响力&gt;&copy;作者:[]罗伯特.B.西奥迪尼<time dataetime="2020-07-10" pubtime="pubtime"></time></p>
        <font size="3"face="微软雅黑">商人运用<mark>影响力</mark>来兜售商品,推销员运用影响力诱惑你乖乖地把金钱捧上
            在这本书中,作者为我们解释了为什么有些人极具<ins >说服力</ins>,而我们总是容易上当
            受骗 隐藏在冲动地顺从他人行为背后的<b>6大心理秘笈</b>,正是这一切的根源。</font>
        <hr color=#7FFFD4 size="2"/>
        <img src="picture/u=3007191037,3154212419&fm=15&gp=0.jpg" alt="怪诞心理学" width="100px"/>
        <p>&lt;怪诞心理学&gt;&copy;理查德·怀斯曼</p>
        <hr size="2" color="aqua"/>
        <font align="right" face="微软雅黑" size="3">作者是英国著名的大众心理学教授、超级畅销书作家,
            也是英国各大报刊杂志最常引述的心理学家,拥有“英国大众心理学传播第一教授”的头衔
            内容简介:本书通过大量案例、现场试验解读日常生活中存在的种种怪诞现背后的心理秘密,
            剖析了那些不易察觉的非理性行为。诠释了生活的本质与真相,并为读者提供了相应的应对措施,
            从而帮助读者更好<strong>了解自己、读懂他人、透现社会,做到“见怪不怪</strong>”“以怪治怪生活的”“非常态”为“常态”,
            更好的驾驭学习、工作和生活</font>
        <hr size="3" color="aqua"/>
        <img src="picture/u=818825824,3790821517&fm=26&gp=0.jpg" alt="小狗钱钱" width="110px" />
        <p>&lt;小狗钱钱&gt;&copy;欧洲首席金钱教练博多·舍费尔</p>
        <hr color="red" size="3"/>
        <font face="微软雅黑">一口气看完了此前储备的理财书籍——《小狗钱钱》,这是有着“欧洲巴菲特”之称的欧洲首席金钱教练博多·舍费尔创作的理财童话,也是欧洲最畅销的理财书籍。
            告别以往理财书喋喋不休的沉闷说教,本书采用让人耳目一新的讲故事形式,深入浅出地解释“金钱法则”。
            主人公—12岁小女孩吉娅,在会说话的小狗“钱钱”的帮助下逐步改变以往错误的财富观,认识到从小养成理财好习惯的重要性,
            并利用梦想储蓄罐、梦想相册、成功日记等工具坚定地走在实现财务自由的道路上,还因此结识了汉内坎普夫妇、金先生、陶穆太太、海内女士等理财道路上的“贵人”,
            在他们以及堂哥马塞尔、朋友莫妮卡的支持下最终成长为小小“金钱魔法师”,完成了自己此前列的“梦想清单”上的所有项目!</font>
        <hr color="red" size="3"/>
        <a href="https://blog.csdn.net/qq_45973003/article/details/107239373">跳转到我的博客</a>
        <br/>
        
	</body>
	
</html>

初识HTML_第1张图片

你可能感兴趣的:(html5,css,html,js,css3)