HTML基础

一、简介

　　1、HTML：超文本标记语言；“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素

　　2、一个HTML文件由<!DOCTYPE html>、head、body三部分组成。其中<!DOCTYPE html>用于申明规范（W3C规范）

二、head部分

　　1、<meta>共有两个属性:name属性

　　　　#keyword参数用来定义搜索关键字

　　　　<meat name="keywords" ,content="定义关键字，某某">

 

　　　　#description参数，用于在搜索界面中，对网站进行简介

　　　　<meat name="description" ,content="网站内容简介">　　

 

　　2、<meta>共有两个属性:http-equiv属性

　　　　#两秒后刷新并且跳转百度，如不写URL则表示刷新当前页面

　　　　<meat http-equiv="Refresh" ,content="2;URL=http://www.baidu.com/">　　

　　3、设置页面标签

　　　　<title>Fiirst Pag</title>　　#设置标签名

　　　　<link rel = "icon" href=../img/favicon,ico>　　#为标签设置小图标　　

 三、body部分

　　1、基本标签（两个一样的标签能在同一行就是内联标签，否则就是块级标签）

　　　　<hn></hn>　　# n为[1,6],标题由小到大（块级标签）

　　　　<p></p>　　  # 段落标签，包裹的内容被换行，并且中间空一行

　　　　<br>　　　　 # 换行标签

　　　　<b></b>　　  # 加粗（内联标签） strong标签也是加粗

　　　　<strike></strike>　　# 定义加删除线文本定义

　　　　<em></em>　　# 斜体

　　　　<sup></sup> <sub></sub>　　#上角标、下角标

　　　　<hr> 　　　　# 水平线

　　2、图形标签<img>

　　　　<img src = "路径" height="300px" width="300px" alt="图片加载失败" title="鼠标放上面，显示该信息">

　　3、超链接<a></a>

　　　　#　　target="_blank"表示跳转时新建一个页面。

　　　　<a href="地址" title="鼠标放上面，显示该信息" target="_blank">点击</a>

 

　　　　# 使用a标签页面内定位

　　　　<a href="#abc">点击跳转到1号位置</a>

　　　　<div id="abc">1号位置</div>

　　4、列表标签

　　　　<ul></ul>　　　　# 无序列表

　　　　<ol></ol>　　　　# 有序列表

　　　　# 自定义列表

　　　　<dl>

　　　　　　<dt>　　　　# 标题

　　　　　　<dd>　　　　# 列表项

　　　　</dl>

　　5、表格标签

　　　　border:表格边框 cellpadding：内边距 cellspacing：外边距 width：宽度，单位像素（一般用css）

　　　　rowspan：单元格竖夸多少行 colspan：单元格横跨多少列

<table>

    <thead>

        <tr>

            <td>一列<td>

            <td>二列<td>

        <tr>

    </thead>

    <tbody>

    　    <tr>


                <td>第一行1<td>


                <td>第一行2<td>

            </tr>


    </tbody>　

</table>
View Code

 

　　6、表单标签：用于向服务器传输数据

　　　　1、input元素：文本字段、复选框、单选框、提交按钮等等

　　　　　　

# method 代表发送的方式，不写默认为get enctype是发送文件
<form action="URL" method="post" enctype="mulitpart/from-data">

    # 将name的值作为key，用户的输入作为value；以字典的方式转送给服务器
    用户名:<input type="text" name="uname">
    密码:<input type="password" name="pwd">

    #单选框，将sex和用户选择的对应的value组成键值对发送给服务端
    男<input type="redio" name="sex" value="1">
    女<input type="redio" name="sex" value="2">

    #复选框，将hobby和用户选择的多个对应的value组成键值对发送给服务端
    足球<input type="checkbox" name="sex" value="1">
    羽毛球<input type="checkbox" name="hobby" value="2">
    篮球<input type="checkbox" name="hobby" value="3">

    # 发送文件
    <input type="file" name="file_name">

    <input type="submit" value="提交">
</form>
View Code

　　

 　　　　2、select元素：

　　　　　　1、下拉选择 #multiple代表多选 size="2"显示连个

　　　　　　　　<select name="language" multiple size="2">

　　　　　　　　　　<option value="Python">Python</option>

　　　　　　　　　　<option value="Java">Java</option>

　　　　　　　　　　<option value="C++">C++</option>

 　　　　　　　　</select>

 　　　　　2、下拉分类选择　　　　　　

　　　　　　　　<select name="Province">

　　　　　　　　　　<optgroup label=湖南省>

　　　　　　　　　　　　<option value="CS">长沙</option>

　　　　　　　　　　　　<option value="YY">岳阳</option>

　　　　　　　　　　</optgroup>

　　　　　　　　</select>

 

posted @ 2017-08-27 00:27  Peaunt  阅读(220)  评论(0)  编辑  收藏  举报