Web前端学习笔记

HTML学习day01

  • 一、了解软件架
      • 1.C/S
      • 2.B/S
      • 3.B/S软件的优缺点
  • 二、HTML
    • HTML标签相关
      • 1.HTML标签
      • 2.HTML标签大小写问题
      • 3.HTML标签属性
      • 4.HTML颜色值的设置
      • 5.HTML注释
      • 6.HTML代码格式
      • 7.HTML实体字符
      • HTML主体结构
  • 三、head标签中常用的标签

一、了解软件架

1.C/S

1)C客户端(client)/S服务器(server)
2)特点:
a:C/S软件通常需要特定的客户端来使用
b:可以通过任意的协议进行通信
c:C/S软件的客户端有数据处理和存储的能力,可以把应用软件的计算和数据分配在客服端和服务器端。

2.B/S

1)B浏览器(browser)/S服务器(server)
2)特点:
a:B/S软件不需要特定的客户端
b:和服务器进行通信使用HTTP协议
c:将所有的数据都存储在服务器上

3.B/S软件的优缺点

1.B/S结构相比C/S结构使用起来比较方便,不需要下载特定的客户端
2.B/S结构维护、升级更方便
3.成本低,不用开发特定的客户端
4.数据相对安全,因为都存储在服务器上,而服务器的保存地方不知道
5.应用服务器运行数据负荷较重

网站从“静态内容”的展示转向“动态内容”的传递
a.静态网站
用户只能在网站中浏览不用做任何的数据性交换
b.动态网站
采用的数据库的开发模式

二、HTML

HTML标签相关

1.HTML标签

标签是HTML的基本单位,同样也是重要的组成部分,通常使用两个尖括号来表示"<>"
格式:
1)双标签

<p>内容p>

2)单标签

<hr />

2.HTML标签大小写问题

标签大小写无关, 内容 和 内容是一样的,HTML标签推荐使用小写

3.HTML标签属性

1.HTML属性一般都出现在HTML标签中,是HTML标签的一部分。
2.标签可以有属性,包含了额外的信息,属性的值一定实在双引号中。而且标签还可以存在多个属性
3.一般属性有属性名和属性值成对出现
4.语法格式:<标签名 属性名1 ="属性值" 属性名2 ="属性值 …多个…">
例如:(背景和颜色)

4.HTML颜色值的设置

1.浏览器支持颜色名称集合,颜色值是一个关键字或者一个RGB格式的数字
2.使用英文单词作为颜色值:
如:red 红色 、green 绿色 、blue 蓝色 、pink 粉丝……
3.六位的十六进制颜色值: RGB
a:#oof---------------#oo oo ff
b:前两位表示红色 中间两位表示绿色 最后两位表示蓝色

5.HTML注释

1.注释的好处
a)方便查找、对比其他程序员快速了解你写的代码,方便以后自己再回头看代码的理解和修改
b)注释的内容不会被浏览器解析出来
c)格式:

6.HTML代码格式

1)任何回车或者空格在代码中都不会起作用,所以在编写HTML代码时,都可以使用回车后者空格进行排版,这样可以使代码清晰便于团队合作、必须保持严格缩进规则,缩进一tab建为准

7.HTML实体字符

  空格
< < 左键括号
> >右尖括号
© 版权符号
部分代码
 <body bgcolor = "greed" text = "#00z">
        <h1>这是我的第一个HTML页面h1>
        <hr />
        <p>人民有信仰 国家有希望p>
        
        
        <p>热爱生活 热爱自己</p>
        <p>@©p>
        body>

网站界面
Web前端学习笔记_第1张图片

HTML主体结构

<!DOTYPE html> 
<html>
	<head>
		
	head>
	<body>
	
	body>
html>

1.最顶部声明
a:声明是文案的第一成份,位于文档的最顶部
b:该标签告诉浏览器所使用的HTML规范(H5的规范,所以浏览器都兼容)
2.以开始 ,以结束,中间包含头部标签 以及主体标签

三、head标签中常用的标签

标签中常用的标签(一部分)

<head lang = "en">
        
        <title>图书库title> 
        <meta charset = "UTF-8"/> 
        <meta http-equiv = "content-type" content = "text/html; charset = UTF-8" /> 
        
        <meta http-equiv = "refresh" content = "5; url = http://www.baidu.com"/> 
        
        
        <meta name = "keywords" content = "书库,图书,漫画书,中考书籍,高考书籍,励志书,书籍作者,清华大学出版社,人民大学出版社"/>
        <meta neme = "description" content = "纸本古籍图书库 免罚日公告 文献传递 馆际互借 学习资料 论文查询 电子书查找"/>
        <link /> 
        
        <link rel = "icon" type = "image/png" href = "./img/Wechat.png"/>
        
        <link rel = "stylesheet" tpye = "text/css" href = "./css.css"/>
        
        <style>
            a{
                
                color:black;
                font-size: 50px;
            }
        style>
        
        <script>
            //加载js样式
            //在此区间可以写JavaScript
            alert("404");
        script>
    head>

你可能感兴趣的:(Web前端基础,前端,html,服务器)