HTML

行级标签:  在一行中顺序排列, 从左向右
块级标签:  独占一行, 上下排列
行内块:    本质上是个行级元素,  但是有一些块级元素的特性 
  • <hr>

  • <br>

  • <h1>-<h6>

  • <div> <a>

  • <p>

  • <img>

  • <input>

  • < textarea >

  • < select >

  • <ol>--<ul>

  • < table >--<tr>---<td>---<th>

  • < form >

idea设置启动浏览器:

1.头部标签

<title>

<meta>

为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:
<meta name="description" content="免费 Web & 编程 教程">
定义网页作者:
<meta name="author" content="Runoob">
每30秒钟刷新当前页面:
<meta http-equiv="refresh" content="30">

<link>

<link> 标签定义了文档与外部资源之间的关系。
<link> 标签通常用于链接到样式表
<link rel="stylesheet" type="text/css" href="css1.css">

<style>

<style> 标签定义了HTML文档的css样式文件引用.
在<style> 元素中你也可以直接添加样式来渲染 HTML 文档

<script>

<script>标签用于加载脚本文件,如: JavaScript

2.body标签

<hr>分割线

noshade:颜色是否有阴影(纯色)
size:高度( 厚度,不同于height,不带单位时--默认px )
width:宽度(不带单位时--默认px)
align:对其方式
<hr>
<hr />
<hr noshade="noshade">3
<hr noshade="noshade" size="50">4
<hr noshade="noshade" size="50" width="50">5
<hr noshade="noshade" size="50" width="50%">6
<hr noshade="noshade" size="50" width="50%" align="left">7

<br>换行

123<br>
456<br> 789

<h1>

<h1><h2><h3><h4><h5><h6>是一系列的标签
只有<h1>---<h6>, 不存在<h7>…
<h1>…<h6>被称为标题标签,  用来定义标题.
<h1> 定义最大的标题。<h6> 定义最小的标题。
注意: <h1>只能在一个html文本中出现一次,并且不得出现在<h2>-<h6>之后

<h>属性

Left:左对齐内容(默认值)
Center:右对齐内容
Right:居中对齐内容

<div>

<div> 可定义文档中的分区或节(division/section)。
<div>是块级标签,会自动换行
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。
<div>是最常用的布局标签

属性

Left:左对齐内容(默认值)
Center:右对齐内容
Right:居中对齐内容

<a>

<a> 标签定义超链接,用于从一张页面链接到另一张页面
<a> 元素最重要的属性是 href 属性,它指示链接的目标

属性(重要)

target属性:
超链接属性target的value值时默认是_self。
_self:它使目标文档显示在超链接所在框架或者窗口中(原窗口打开)。
_blank:在新窗口打开(新窗口打开)。
_parent:在父窗口打开。
_top:在顶级窗口打开。
同组值:通过单击一个窗口中的不同链接控制另一窗口内容变化 ; 浏览器会找与target值相符的框架或者窗口中的文档,有则在其中显示文档。如果不存在,浏览器打开一个新窗口。

<p>段落

<p> 标签定义段落。
<p> 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。

<img>

<img>为图片标签,在html文档中引入图片资源
<img>是单标签
<img>行级标签
<img src="'" alt="加载错误" width="200" height="200" />
src指向图片路径
alt表示图片未显示成功情况下加载的字段
wdth宽度
height高度

<input>

<input>是一个输入框。
<input>是一个单标签。
<input>是一个行级元素。

输入框的type属性(重要)
Button		按钮
Checkbox	定义复选框。
file			文件上传
hidden		隐藏
image		图片
password	密码
radio		单选框
reset		重置按钮,用于form表单
submit		提交
text			单行文本

checkbox 复选框

radio  单选框

reset:重置按钮(重置按钮会清除表单中的所有数据),用于form表单; 
submit:提交,用于form表单

输入框的其它属性
Min: 最小值
Max: 最大值
Multiple: 多文件上传
Required: 必须填写提示
Placeholder: 输入提示
Readonly: 输入框只读

多文件上传

提示

只读

<textarea>多文本

属性

Cols:列
Rows:行
Maxlength:最大
Placeholder:提示
Required:必填
Readonly:只读

0

<select>下拉选择

<select>和<option>需要配合使用

option: selected(选中状态)
select : multiple(multiple ="multiple" 允许多选)
select : size(size ="4"下拉可见数4)

<ol>有序列表

<ol> 标签定义有序列表。
<ol> 标签要结合<li>标签使用
<ol> 标签常用于列表渲染

type属性 : 规定在列表中使用的标记类型(1,A,a,I,i)。
start属性 : 规定有序列表的起始值
reversed  : 规定列表顺序为降序。(9,8,7...)

<ul>无序列表

<ul> 标签定义一个无序列表
<ul>  标签要结合<li>标签使用
<ul>  标签常用于列表渲染
<ul> 唯一区别于<ol>在于无序性

 

type属性
disc:默认。实心圆。
circle:空心圆。
square:实心方块

<table>表格

<table>标签定义html表格
<table>有一系列子标签
子标签<tr>定义行
子标签<td>定义单元格
子标签<th>定义表头
注:另外<thead><tbody><tfoot>也是<table>的子标签,主要作用是把一个<table>表格分为”页头,主体,页脚”三个部分,然后再进行行(<tr>)以及具体单元格的编辑

<thead><tbody><tfoot>必须结合起来使用
<thead><tbody><tfoot>它们的出现次序是:<thead>、<tfoot>、<tbody>
必须在 <table> 元素内部使用这些标签。
依旧包含<tr><td><th>等子元素
<thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。
<tbody> 标签表格主体(正文)。该标签用于组合 HTML 表格的主体内容。
<tfoot> 标签定义表格的页脚(脚注或表注)。该标签用于组合 HTML 表格中的表注内容。

<table>:
border : 规定表格边框的宽度
cellpadding : 规定单元边沿与其内容之间的空白。
cellspacing : 规定单元格之间的空白
frame : 规定外侧边框的哪个部分是可见的
rules : 规定内侧边框的哪个部分是可见的。
<tr>
align 属性规定表格行中内容的水平对齐方式(left, right , center)。
<td><th>
rowspan: 规定单元格可横跨的行数。
colspan: 规定单元格可横跨的列数

<form>表单

<form>标签可以向服务器传输数据
<form>表单在网页中主要负责数据采集功能,也就是和里面包含的数据将被提交到服务器。
<form>表单有三个基本组成部分:
表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。
表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。
表单按钮:包括如提交按钮、复位按钮和一般按钮。

<form>标签重要属性:
1. action 属性:定义在提交表单时执行的动作。
向服务器提交表单的通常做法是使用提交按钮,
如果省略 action 属性,则 action 会被设置为当前页面。
2.method 属性:规定在提交表单时所用的 HTTP 方法(GET 或 POST):
<form action="***" method="GET"> 或
<form action=="***" method="POST">
HTML 表单包含表单元素,表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。

附件:

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值