HTML基本知识学习

HTML

1.HTML书写规范

浏览器作用是读取Html,并用网页将他显示出来,浏览器不会显示Html标签,而是通过标签来解释页面的内容。

<!DOCTYPE html><!--约束声明-->
<html lang="en"><!--html标签表示html的开始 lang="zh_CN"表示中文 html一般分为两个部分,分别是:head和body-->
<head><!--表示头部信息,一般表示三个部分title标签,css样式,js代码-->
    <meta charset="UTF-8">
    <title>标题</title><!--表示标题-->
</head>
<body>
</body>
</html>
  • 大小写不敏感

  • 标签拥有自己的属性:

    (1)基本属性

    (2)事件属性

  • 标签又分为:单标签和双标签(例如:

    ;
    )

2.HTML的标签

标题标签

<h1>标题</h1>
<h2>标题</h2>
<h3>标题</h3>

段落标签

<p>段落标签</p>

段落标签,前后各空一行

HTML链接与图像

<a href="http://www.baidu.com/" target="_blank">百度</a>
<a href="http://www.baidu.com/" target="_parent">百度</a>

href 属性中指定链接的地址,target属性_parent是在本网页打开,_blank创建一个网页打开。

<img src="C:\Users\15438\Desktop\123.jpg"/>

HTML属性

<body bgcolor="yellow">
<h1  align="center">居中</h1>
</body>

align对齐方式的属性,bgcolor背景颜色的属性。

列表

无序列表

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

效果:

  • Coffee
  • Milk

有序列表

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

效果:

  1. Coffee
  2. Milk

表格

<table border="1"width="300"heigth="300">
    <tr>
        <td align="center"><b>1.1</b></td>
        <th>1.2</th>
        <th>1.3</th>
    </tr>
    <tr>
        <td>2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
    <tr>
        <td rowspan="2" colspan="2">3.1</td>
        <td>3.2</td>
    </tr>
</table>

table 标签是表格标签

border设置表格标签

width设置表格宽度

heigh设置表格高度

tr 是行标签

td是单元格标签

align设置对齐方式

b加粗标签

合并单元格

rowspan="2"合并行两个单元格

colspan="2"合并列两个单元

块标签

HTML

元素是块级元素,它是可用于组合其他 HTML 元素的容器。

元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。

如果与 CSS 一同使用,

元素可用于对大的内容块设置样式属性。

元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 元素进行文档布局不是表格的正确用法。
元素的作用是显示表格化的数据。

内联元素

HTML 元素是内联元素,可用作文本的容器。

元素也没有特定的含义。

当与 CSS 一同使用时, 元素可用于为部分文本设置样式属性。

表单

<form action="https://www.baidu.com/">

        <h1 align="center">用户注册</h1>
        <table align="center">
            <tr>
                <td>用户名</td>
                <td><input type="text" value="默认值"/></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" name="password" value="abc"/></td>
            </tr>
            <tr>
                <td>确认密码</td>
                <td><input type="password" name="password2" value="abc"/></td>
            </tr>
            <tr>
                <td>性别</td>
                <td>
                    <input type="radio" name="sex" checked="checked" value="boy"/>男
                    <input type="radio" name="sex" value="girl">女
                </td>
            </tr>
            <tr>
                <td>兴趣爱好</td>
                <td>
                    <input type="checkbox" name="habit" checked="checked"/>Java
                    <input type="checkbox"/>C++
                </td>
            </tr>
            <tr>
                <td>国籍</td>
                <td>
                    <select name="country">
                        <option selected="selected">中国</option>
                        <option>美国</option>
                        <option>小日本</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>自我评价</td>
                <td>
                    <textarea rows="10" name="text" cols="20">我才是默认值</textarea>
                </td>
            </tr>
            <tr>
                <td>
                    <input  type="reset"/>
                    <input type="submit"/>
                </td>
            </tr>
        </table>

表单提交数据没有发送给服务器三种情况:
1.没有name
2.单选、复选(下拉列表都要写value属性)
3.表单项不在form标签中
GET请求特点是:
1.浏览器地址是:action属性【+?请求数据】
2.不安全
3.他有数据长度的限制
POST请求的特点:
1.浏览器地址栏中只有action属性值
2.相对GET安全
3.没有长度限制

posted @ 2020-11-10 20:01  cwstd  阅读(196)  评论(0编辑  收藏  举报