HTML简单语句

目录

HTML

基本格式

基本结构

常用标签

基本标签

表单标签

超链接标签:a

布局标签

标题标签

段落标签

列表

表格

容器标签

fieldset

框架标签


HTML

中文名:超文本标记语句

全称:Hyper Text Markup Language

超文本:以文本展示非文本的内容

标记:有特殊含义的标签

基本格式

方式1:<标签名 属性区> 内容区

方式2:<标签名 属性区/>

方式1可以在其中嵌套标签,方式2不可以嵌套别的标签 多个属性直接使用空格隔开

注释语法:

基本结构

        作用:表示当前文档类型为html文件

                html:网页根标签包含网页中的所有内容

	            
		
		网页标题
	
	
		   这块是给用户看的     
	

常用标签

基本标签

文本展示标签:font

图片展示标签:img

音频:audio

视频:video

换行:br

水平分割线:hr

		
		
		

影狐狸

表单标签

input:输入

        type:输入类型

                text:文本输入,默认的类型

                password:密码输入

                radio:单选按钮,注意,name属性值相同则为一组,要求需要value值,

                checkbox:多选按钮

                button:按钮

                submit:提交按钮

                reset:重置按钮

                file:文件上传 

                placeholder:提示字,属性值自定义

                name:标签名称,属性值自定义

                value:值,在类型为按钮时,表示按钮上显示的内容

例如:

		简单注册
	
		
		
账号:
密码:
性别:

爱好
RAP


你的国籍:


如何评价





是隐藏域,用户看不见的

HTML简单语句_第1张图片

 select:选择器

                         multiple:设置可以多选(在win系统中需要按住ctrl)

                                 size:展示的子项数量

                        子项:option

                                属性: selected:默认选中

你的国籍:
		

textarea:文本域

                rows:行

                 cols:列        设置一个文本域,可用行列控制大小

	如何评价
		

HTML简单语句_第2张图片

form:

            1. enctype:上传类型

                        application/x-www-form-urlencoded不上传文件就使用该类型,该类型为默认执行

                        multipart/form-data 上传文件使用该类型

            2. method:请求方式

                        get:显式请求

                                如:http://127.0.0.1:8080/?username=1234&password=123456 注意:不能超过100个字符 经验:get用于下载

                         post:隐式请求

                                注意:上传数据量无限制 经验:post用于上传或密码相关

             3.action:接收请求的地址


		
账号
密码

账号
密码

显式提交

  隐式提交

超链接标签:a

链接网页:语法

 显示的字

百度一下
去demo3

点击即可跳转到该链接

锚点:

最顶
......
语句

如图点击 语句 就会在同一个页面跳转到 最顶 的位置

例2

01
.....
第一个

点击01就会跳到第一个

布局标签

标题标签

h1,h2,h3,h4,h5,h6

        

A

A

A

A

效果HTML简单语句_第3张图片

段落标签

    先帝创业未半而中道崩殂,今天下三分,益州疲弊,此诚危急存亡之秋也。然侍卫之臣不懈于内,忠志之士忘身于外者,盖追先帝之殊遇,欲报之于陛下也。诚宜开张圣听,以光先帝遗德,恢弘志士之气,不宜妄自菲薄,引喻失义,以塞忠谏之路也。

宫中府中,俱为一体,陟罚臧否,不宜异同。若有作奸犯科及为忠善者,宜付有司论其刑赏,以昭陛下平明之理,不宜偏私,使内外异法也。

 HTML简单语句_第4张图片

一个   代表一个空格

列表

ul 无序列表

ol有序列表

	
  • 第一个选项
  • 第二个选项
  • 第三个选项
  • 第四个选项
  1. 第一个选项
  2. 第二个选项
  3. 第三个选项
  4. 第四个选项

效果:

HTML简单语句_第5张图片

表格

                align="center"居中

table:表格 tr:行 td:单元格th:特殊单元格

标签就是Table Heading,意思是表格标题。标签在使用时,跟标签没有什么区别,如果非要说有点区别的话,那就是一般只用在第一个下。在浏览器中显示时,标签被显示为加粗的字体,其它的跟普通的也没有区别。

例:

	
第一行
第二行第一个 第二行第二个 第二行第三个
第三行第一个 第三行第二个 第三行第三个 第三行第四个
第四行第一个 第四行第二个 第四行第三个 第四行第四个
第五行第一个 第五行第二个 第五行第三个
第六行第一个 第六行第二个

 border="1" 黑框框大小

cellspacing="0" 框框之间的距离

HTML简单语句_第6张图片

容器标签

将某个东西包裹起来

例:

            

 将图片居中

fieldset

例:

管理员登录

HTML简单语句_第7张图片

表现出这种格式

框架标签

frameset

 frame

                上面两个都过时了,。

iframe


链接


也可以

iframe标签可以实现html主页面嵌套html子页面,子页面可以是一个功能页面

其他细节

1.所有标签都有id,class属性,一个网页中id属性值不能重复 一个网页中class属性值允许重复

2. 所有标签都有onclick(点击)事件,意味着所有标签都可以当做按钮

你可能感兴趣的:(初顾茅庐,html,前端,css)