HTML介绍以及基础标签、CSS

版权声明:转载请注明出处 https://blog.csdn.net/liyunxiangrxm/article/details/82965197

HTML

html基本结构

  • html : 是不区分大小写
  • html是由开始,由结束,在这之间是分和两部分
  • 是给html页面增加一些辅助或者属性信息,里面的内容会最先加载。
  • 标签里面存放的才是真正要显示的数据

HTML语法

标签

带有特殊含义的网页的标记元素
格式:<开始标签> 标签体 </结束标签>

分类

带标签体的标签          如:  <p> XX </p>
不带标签体的标签      如: <br/>
标签应该成对出现

属性

写在开始标签上的  名=“值”对代表该标签的属性 <font color=“red”></font>。
一个标签可以有多个属性,多个属性之间使用空格隔开。
注意:属性值最好使用单引号或者双引号引起来。

注释

<!--我是注释-->

文本标签

  • 标题(h1~h6)
  • 水平线(hr)
  • 段落§
  • 上下标(sup和sub)
  • 换行(br)
  • 原样输出(pre)
  • 有序列表ol li
  • 无序列表ul li
  • 项目列表标签(dl dt dd)
  • 行内标签(span)
  • 块标签

HTML链接和图像

链接标签

跳转:<a href = "资源路径" target="_blank">
邮件:<a href="mailto:email"></a> 
定位:<a name=“#标记名”></a> 和 <a name="标记名" >

图像标签:

<img src=”1.jpg” align=” middle” border=”3” alt=”图片说明文字” username="#Map"/>
 <map name=“Map” >    使用作为热点图的
          <area shape="rect" coords="50,59,116,104" href="1.html" />
          <area shape="circle" coords="118,203,40" href="2.html" />
  </map>

tabel表格

 - 标题标签:<caption>,给表格提供标题。 
 - 表头标签:<th>,一般对表格的第一行或者第一列进行格式化,就是粗体显示。并不常用。 
 - 行标签:<tr> 
 - 单元格标签:<td>,加载行标签的里面。可以简单理解为,先有行,在行中在加入单元格。

HTML表单

表单

表单,在网页中主要负责数据采集的功能,
比如你可以采集访问者的名字和e-mail地址、调查表、留言簿等等。

组成

表单标签:  <form action=“” method=“” enctype=“”></form>
表单域    : <input type=“” name=“” /> 
表单按钮: <input type="submit" name="..." value="...“/> 

常见的表单域

文本字段     <input type=“text” name=“” value=“”/> 
密码字段、   隐藏字段 type = "password"
单选按钮      type=radio 单选按钮必需要分组,分组的方法就是给标签name属性,name属性的值必须一样。
多选按钮     type =checkbox,多选按钮的name属性必须一致。
文件选择框	 type=“file”  
下拉列表      <select ><option>
文本输入域   <textarea> 根据cols定义它的列,rows定义文本框的行数
按钮	type=“button”

css

CSS引入方式

在这里插入图片描述

在这里插入图片描述

CSS选择器

在这里插入图片描述

盒子模型

在这里插入图片描述

相对定位、绝对定位

在这里插入图片描述

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/liyunxiangrxm/article/details/82965197