初始web

华子目录

  • 前后端与全栈
  • BS架构
  • 网页开发原则
  • 前端三剑客
  • 初始html
  • html的基本框架
    • 如何使用vscode创建网页
    • 网页基本框架
    • html基本标签

前后端与全栈

前端:给用户看的内容 – 荧幕前(负责显示)
后端:在后台处理数据 – 荧幕后(负责处理)
全栈:前后端都会 能独立开发一个完整的网站(全能型)

BS架构

B:browser,浏览器
S:server,服务器
平时浏览页面可见到的前端部分 – 浏览器
真正实现操作 进行数据增删改查的后端部分 – 服务器

网页开发原则

1.对于设计者来说容易实现
2.对于编程者来说容易开发
3.对于管理者来说容易维护
4.对于浏览者来说容易使用

前端三剑客

  • html:是网页基本组成写给用户看的内容(图片 文字 视频)–>人类身体
  • css:负责美化网页/优化网页性能(字体大小 排版)–>人类衣服 装饰品
  • JavaScript:脚本语言 用来动态效果 前后端交互传输信息 -->人类行为/技能

初始html

html是超文本标记语言,是构成web页面的基本元素,是一种规范,一种标准
什么是超文本呢?
超文本是比普通文字的文本要强悍些,可以放图片,音乐,视频,排版,超链接等等。
注:html是标记语言不是编程语言,可以把html当做一个拼图,里面的代码称为标签,我们要做的就是把一个个正确的标签放到合适的位置上就可以了,其中html5是html的一个版本,该版本增加优化了很多内容,几乎现在市面上流行的浏览器都能很好的支持html5

html的基本框架

如何使用vscode创建网页

1.先创建一个空文件夹
2.鼠标右击,选择使用vscode打开
3.再在vscode中创建一个后缀名为html的文件
4.Ctrl+s保存文件

网页基本框架

1.标签:写在html包裹的代码

  • 单标签:一般是功能标签,有特殊的功能含义(单身狗)
  • 双标签:一般包裹内容,显示东西(情侣)
    2.生成html框架:!+ tab键或enter键/html:5
    注:注释:,快捷键:Ctrl+/
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">  
    <title>Documenttitle>  
head>
<body>
    
body>
html>

基本框架:
html --> 是一个网页核心 基本上所有的内容都被他包裹
head --> 头标签 里面写的内容 主要是给浏览器看网页的介绍 样式
body --> 身体标签 主要给用户看的

html基本标签

1.标题标签

<h1>内容h1>
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">  
    <title>练习title>  
head>
<body>
    <h1>大龙虾h1>
    <h2>海鱼肉h2>
    <h3>麻辣粉h3>

body>
html>

初始web_第1张图片
注:

  • h1-h6标签用于表示网页内容的标题 标签中的文字默认会出现不同程度的加粗与增大
  • 搜索引擎非常看重h1标签内容 重要的内容放在h1里 一般只能放置一个 否则会适得其反

2.段落标签
比例式占据网页大小

<p>内容p>
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">  
    <title>练习title>  
head>
<body>
    <p>干啥共青团认为有阿嘎个人和狠人认规范十多个很多事跟的是跟的是规划电风扇改设定个个蛇身瓦房店市股份大使馆的双方各为p>
    <p>fddghdhfegfdsggfffgdfdshdsffgdfghjrtyughjhjfghjhjgh更好地复工后复工后即可的复工后即可的复工后即可的复工后即可复工后即可复工后即可的复工后即可p>
body>
html>

总结:
p标签是双标签,段落标签,放一段段文字,段落之间是有间隙的因为段落自带换行

你可能感兴趣的:(前端)