博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浅谈HTML
阅读量:4099 次
发布时间:2019-05-25

本文共 2495 字,大约阅读时间需要 8 分钟。

html

1. 什么是html

hyper 超级 text 文本 markup 标记 language 语言

超文本标记语言,俗称网页

2. html 文件结构

以 *.html 或 *.htm 结尾的文本文件

  1. 标签一般成对出现:<标签名> </标签名>
  2. 最外层的标签<html></html> 其它标签必须在它之内
  3. doctype 用来说明html的版本
    例如:版本是html5

        2行

 

版本是html4:

        3行

 
  1. <html> 标签由 <head> 和 <body>子标签组成

        5行

		

head标签主要用来引入外部的样式和脚本文件, 还可以用来定义编码和标题

主要的是网页中与内容无关的部分

body标签里放的是要显示的内容部分

建议开发使用的浏览器: firefox(火狐), chrome(谷歌)

不建议 ie6 ie7 ie8

3. 常用标签

3.1 标题标签

...

标题从1到6,字号依次减小

3.2 段落标签(正文)

可以起到内容换行的作用, 普通文本是不会自动换行的

3.3

分隔符


不需要结束标签, 加一道横线

换行符 
不需要结束标签, 起到换行的作用

 

3.4 标签的属性: 格式 : 属性名="属性值"

可以用来定义标签的宽、高、颜色等等
例如:

        2行

内容

表示段落内容靠右对齐

        2行


表示分隔符颜色变为红色

3.5 特殊转义字符(实体)

< 表示 <
> 表示 >

3.6 图片标签 img

src 属性代表图片路径
更多注释内容
alt 是图片访问不到时的提示文字
width 表示宽度(单位是像素)
height 表示高度(单位是像素)

注意:路径建议使用相对路径,不要使用绝对路径(e:... c:...)

3.7 超链接 a 【重点】

href 属性 表示跳转的目标
方式1:两个网页之间跳转:

        2行

超链接提示文字

方式2:网页内跳转 (锚点)

        2行

超链接提示文字

方式3:图片作为超链接

3.8 列表

有序列表 (order)

        4行

  1. 列表项

无序列表 (unorder)

        4行

  • 列表项

3.9 表格【重点】

        6行

其中 thead, tbody, tfoot 里又可以分为行与列

<tr> 表示行 '' 表示列
比如要在tbody再分两行两列

        9行

			第一列第二列				第一列第二列	

例:

        28行

编号 姓名
1 张三
2 李四

第一列 第二列
第一列 第二列

生成表格的父子关系,4行3列

table>tbody>tr4>td3

同时生成thead和tbody 需要用() 把他们分组,平级的用+连在一起

table>(thead>tr>td3)+(tbody>tr4>td*3)

给table加属性的快捷写法

table[border=1][width=100%]>tbody>tr2>td2

        16行

行1列1 ss
行2列1 行2列2 行2列3

        14行

行1列1 行1列2
行2列2

<td>类似的'',他们都是代表一列,但''其中的文本默认是居中并加粗

3.10 表单【重点】

都是用来收集用户录入的信息
<input type="text"> 文本框标签
<input type="password"> 密码框
<input type="radio"> 单选按钮

例子:

        7行

未婚 已婚 离婚

<input type="checkbox"> 复选按钮

        9行

读书 玩游戏 听音乐 敲代码

<input type="email"> 输入邮件地址

<input type="date" value="日期初始值"> 日期选择标签
<input type="time" value="时间初始值"> 时间选择标签

<input type="file"> 文件选择框

<input type="button" value="按钮文字"> 按钮

<input type="reset" value="重置"> 重置按钮 把页面所有填写的内容重置到初始状态
<input type="submit" value="提交"> 提交按钮 把表单填好的信息发送给服务器
<button type="button|reset|submit">按钮文字</button>

下拉列表标签

        7行

如果希望某个option默认被选中,在option上添加属性selected

写法1: selected
写法2: selected="selected"

文本域标签 适合输入多行文本内容

3.11 取值是布尔值的属性

checked 配合单选按钮、复选按钮使用
selected 配合option标签使用
readonly 表示只读,可以配合大部分表单标签使用
disabled 表示禁用,跟只读类似,不能修改,
而且在表单提交时,不会发送disabled属性的数据
加在按钮上,禁用这个按钮
required 是否必填,如果空值,不允许提交表单

转载地址:http://yhksi.baihongyu.com/

你可能感兴趣的文章
C++实现 简单 单链表
查看>>
数据结构之单链表——C++模板类实现
查看>>
Linux的SOCKET编程 简单演示
查看>>
正则匹配函数
查看>>
Linux并发服务器编程之多线程并发服务器
查看>>
聊聊gcc参数中的-I, -L和-l
查看>>
[C++基础]034_C++模板编程里的主版本模板类、全特化、偏特化(C++ Type Traits)
查看>>
C语言内存检测
查看>>
Linux epoll模型
查看>>
Linux select TCP并发服务器与客户端编程
查看>>
Linux系统编程——线程池
查看>>
基于Visual C++2013拆解世界五百强面试题--题5-自己实现strstr
查看>>
Linux 线程信号量同步
查看>>
C++静态成员函数访问非静态成员的几种方法
查看>>
类中的静态成员函数访问非静态成员变量
查看>>
C++学习之普通函数指针与成员函数指针
查看>>
C++的静态成员函数指针
查看>>
Linux系统编程——线程池
查看>>
yfan.qiu linux硬链接与软链接
查看>>
Linux C++线程池实例
查看>>