在前端中的html基础知识

php中世界最好的语言

发布时间：2018-03-19 11:59:39

2115人浏览过

来源于php中文网

原创

这次给大家带来在前端中的html基础知识，使用前端中html基础知识的注意事项有哪些，下面就是实战案例，一起来看一下。

HTML基本知识

学习html首先我们先看看HTML本质：

web框架本质

我们在学socket，我们创建一个socketserver，然后运行起来，有一个client客户端要连接socket服务端，连接上之后，如果两边都没有close，就一直不断开，可以不断的进行请求。

那我们说一个网站，我们在服务器端运行我们的网站，所有的客户端就可以通过浏览器访问我们写的网站，所以我们用的iis,apache等它们本质上就是一个socket服务端，而我们打开的浏览器就是client端，进行数据传输。

我们如果基于TCP,客户端和服务端连接之后，只要两边不close，也都可以一直不断的访问交互。但是网站浏览器浏览和这个是不一样的。浏览器访问了服务端，服务端给我们数据，浏览器得到了数据之后，连接就立马断开了，如果还想要拿数据，还得再次建立连接。即一次请求，一次响应，一次断开。

我们下面写一个socket服务端：

 1 import socket 2  3 def handle_request(client): 4     buf = client.recv(1024) 5     client.send(bytes("HTTP/1.1 200 ok\r\n\r\n",encoding="utf-8")) 6     client.send(bytes("Hello,Charles",encoding="utf-8")) 7  8  9 def main():10     sock = socket.socket(socket.AF_INET,socket.SOCK_STREAM)11     sock.bind(('localhost',8000))12     sock.listen(5)13 14     while True:15         connection,addr = sock.accept()16         handle_request(connection)17         connection.close()18 19 if name == 'main':20     main()

我们运行之后用浏览器访问起来：

所以服务器的本质根源就是这20行代码，建立socket连接。

其实我网站的显示内容本质上也就是一大堆的字符串，我们在send函数中发送了hello,clarles，在网站上就显示了那个内容，如果我们加上一些标签比如

Hello,Charles

那么浏览器中显示的就是如下：

那所以客户端和服务器端进行交互的时候，服务端返回的永远是字符串，这个字符串之所以我们在浏览器上能看到上图的样式，那是因为浏览器把这个字符串进行了解析。浏览器认识这种格式。

所以我们要学的html其实就是一套浏览器认识的规则，这个就是html本质。

而我们开发者要做的就是：

1.学习html规则|（充当模板的作用）

2.从数据库中获取数据，然后替换到html文件的指定位置,这个事情以后就由web框架来做

html标签知识

注释：

标签分类：

1.自闭合标签：

2.主动闭合标签：

测试

head内的标签

title

网页头部信息：

TItle

Link

1.css

2.icon:网站图标

Style

在页面中写样式

例如：

Script

1.引进文件

2.写js代码

...

body内的标签

标签一般分为两种：块级标签和行内标签

行内标签：a、span、select 等

块级标签：p、h1、p 等

各种符号

http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html

空格：小于号：youjiankuohaophpcn 大于号：zuojiankuohaophpcn

1.p和br

p表示段落，默认段落之间是有间隔的！

br 是换行

1231
32132

123132132

2.H 标签

h1

3.input系列:

a.text文本框：，显示效果：

b.password密码框:输入的密码是点,显示效果：

c. submit提交按钮:,显示效果：

用于表单的提交

d.button按钮:,显示效果：

仅仅只是一个按钮，没有办法进行表单的提交

e. radio单选框：,

name属性如果都相同，则互斥

value属性用于后台获取选择的值

f.checkbox多选框：

爱好

立即学习“前端免费学习笔记（深入）”；

医院网站系统

HTML医院网站系统基于PHP+MYSQL开发，在文章内容网站的基础上，预设了医院概况、新闻动态、环境设备、名医荟萃、专科介绍、就医指南、专家门诊值班表、网上挂号、医疗保健知识、在线咨询等医院网站常用的栏目和测试数据，采用适合医院网站的专用模版，增强了系统的针对性和易用性。系统具有文章、图文、下载、社区、表单、用户等基本系统模块和一系列网站辅助功能，用户也可根据自身特点任意创建和修改栏目，适合创建

下载

篮球：足球：排球：网球：

技能

python： php：

效果:

如果需要默认选中的话：加一个属性：checked="checked"

g.file上传文件：

如果你要用上传文件功能，你再form表单中一定要加一个属性：enctype='multipart/form-data'

h:reset内容重置:

4.textarea多行文本:

<span style="color: #ff0000">asdfasdf</span>

多行文本的默认值写在中间

5.select下拉框：

显示效果：

参数解释：

size设置一次显示多少个值
multiple可以多选，按住control键
selected="selected"：默认选择的值

分组显示：optgroup，但是这些江苏省，湖南省没有办法选中

效果如图：

6. a标签

作用：

跳转
锚点 :href="#某个标签的id"标签的ID不允许重复

Title 第一章第二章第三章第四章

第一章内容

第二章内容

第三章内容

第四章内容

这个就是一个锚的效果：点击第一章，跳转到本页面的第一章位置；点击第二章，跳转到本页面的第二个位置

7.img标签

没有图片显示的内容

注意：默认img标签，有一个1px的边框，在使用的时候应该先用border:0；把边框去掉

8.列表


    
    Title
    
        asdf
        asdf
        asdf
    
    
        asd
        asd
        asd
    
    
        asdf
            asdf12
            asdf12
        asdf
            asdf12
            asdf12

显示效果如图：

9.表格：


    
    Title
    
        
            主机名
            ip
            端口号
        
        
            localhost
            192.168.1.1
            8080
        
    
    
    
        
            
                主机名
                ip
                端口号
            
        
        
            
                localhost
                192.168.1.1
                8080

主机名	ip	端口号
localhost	192.168.1.1	8080

效果显示：

要注意代码的规范性！！

合并单元格：

表头1	表头2	表头3	表头4
1	1	1
2	2	2	2
3	3	3

行合并用：rowspan 列合并用：colspan

效果显示：

10.label标签：用于点击文字，使得关联的标签获得光标

用户名：

用id把input 和 label进行关联，原本如果只是写一个label和一个input，我们在点击用户名的时候，input没有被选中，如果用for关联了input里的id之后，我们点击“用户名”的时候也就选中input输入框

11.fieldset: 在一个框中然后插入标题