首页 前端知识 HTML的常用文本框和基本语法

HTML的常用文本框和基本语法

2024-03-06 09:03:50 前端知识 前端哥 723 772 我要收藏

一:HTML的概念

HTML指的是超文本标记语言,是一种用于创建网页的标准标记语言。HTML使用标签来描述网页中的各种元素,比如标题、文本、图像、链接等。 HTML文件可以通过浏览器读取和渲染,使用户能够查看网页内容。 HTML也包含了一些元数据,如标题、描述和关键字等,这些元数据可以帮助搜索引擎更好地理解和索引页面内容。 HTML的标准由万维网联盟(W3C)制定和维护。

用处有哪些?

HTML(超文本标记语言)是用于创建网页的标准标记语言。它使用标记标签来描述网页的结构和内容,并且可以在网页上添加图像、音频、视频和其他形式的媒体。以下是HTML的一些主要用途:

1. 创建网页结构: HTML用于创建网页的基本结构,包括标题、段落、列表、表格等。

2. 格式化文本: HTML可以用于格式化文本,包括加粗、斜体、下划线等。

3. 插入媒体: HTML可以用于插入图片、视频、音频等媒体。

4. 超链接: HTML可以使用超链接连接网页之间的内容和其他网站。

5. 表单: HTML可以用于创建表单,用于收集用户信息和提交数据。

6. 搜索引擎优化: HTML可以使用标签和元数据来优化网站的搜索引擎排名。

总之,HTML是网页开发的基础,使用HTML可以创建各种复杂的网页,从而提供各种各样的功能和体验。

二:HTML的基本语法

1.先创建一个html文件,本人在pycharm中执行

创建好之后就有一些基本的框架了

第一行为文本形式,第二行为使用的语言,en代表英语

第三行和第六行为头文件,utf-8为字符编码

第五行为标题,<body>为身体,是写内容的地方

基本语法认识

补充:

<br>换行

<hr>用以条横线分开

基本语言1

首先需要一个标题来写网页描述

格式:

<title>李白</title>

我这里以李白的将进酒为例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
       <title>李白</title>
<!--    这里的<hr>为加横线-->
    <hr>
</head>
<body>
    <h1>将进酒</h1>
     <!--    里的<br>为换行-->
    <p1>君不见黄河之水天上来,奔流到海不复回。<br>
君不见高堂明镜悲白发,朝如青丝暮成雪。<br>
人生得意须尽欢,莫使金樽空对月。<br>
天生我材必有用,千金散尽还复来。<br>
烹羊宰牛且为乐,会须一饮三百杯。<br>
岑夫子,丹丘生,将进酒,杯莫停。<br>
与君歌一曲,请君为我倾耳听。<br>
钟鼓馔玉不足贵,但愿长醉不愿醒。<br>
古来圣贤皆寂寞,惟有饮者留其名。<br>
陈王昔时宴平乐,斗酒十千恣欢谑。<br>
主人何为言少钱,径须沽取对君酌。<br>
五花马、千金裘,呼儿将出换美酒,与尔同销万古愁</p1>

</body>
</html>

网页效果

<a>网址</a>自定义名字

可以点击

例如:

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

基本语法2

input的方法

<input type="选择你要的形式" name="给客服看的" value="客服看的" placeholder="填充的虚拟内容">

常用的方法:

HTML对格式的要求底,一般不会报错

注释:快捷加ctrl  /

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的网页标题</title>
</head>
<body>
<!--这里是将数据提交的一个库,因为开源所以可以直接使用-->
<form action="http://httpbin.org/get" method="get">
<!--这里指的是一个标签-->
    <label>用户:
<!--        name="username" value=""这些值是给客服看到,不写也可以-->
    <input type="text" name="username" value="" placeholder="请输入你的名字">
</label><br>
<label>密码:
    <input type="password" value="" placeholder="请输入你的密码">
</label><br>
<label>日期:
    <input type="date" value="请输入日期">
</label><br>
<label>性别:
    <input type="radio" name="sex" value="1">男
    <input type ="radio" name="sex" value="2">女
</label><br>
爱好:
<label><input type="checkbox" name="like" value="1"></label>篮球
<label><input type="checkbox" name="like" value="2"></label>足球
<label><input type="checkbox" name="like" value="3"></label>排球<br>
<!--    <select>的方法是选择框-->
    城市:
    <select name="city">
        <option value="1">北京</option>
        <option value="1">天津</option>
        <option value="1">上海</option>
        <option value="1">其他</option>

    </select><br>
<!--    <textarea>这里的方法是一个文本框-->
    个性签名:<br>
<!--    cols=为行  rows=为列-->
    <textarea name=like cols="30" rows="10" ></textarea>
    <br>
<!--    submit是用来提交数据的-->
    <input type="submit" value="提交表格">
</form>
</body>
</html>

网页形式:

转载请注明出处或者链接地址:https://www.qianduange.cn//article/3311.html
标签
评论
发布的文章

JQuery简介与解析

2024-03-01 12:03:31

在Vue 3项目中使用 echarts

2024-03-29 15:03:05

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!