一、互联网的原理

1、概述

html:用来制作网页。

互联网原理:上网即请求数据。

用户通过在浏览器上输入一个网址,通过HTTP协议向服务器发送请求,服务器做出响应,将相关的网页数据传输到本地计算机,在浏览器上渲染出来。

数据:文字、图片、视频、音频等。

2、服务器

服务器:server

作用:保存我们的数据

服务器必须24小时在线,掉线了数据访问不到,就不能正常访问网页。

可以通过个人的计算机里面的一些软件(ftp)来远程控制服务器。

3、浏览器

浏览器:browser。

作用:HTTP请求的发起、接收,都是由浏览器来完成的。

浏览器有很多厂商提供,全球五大浏览器:IE、谷歌(Chrome)、火狐(Firefox)、苹果(Safari)、欧朋(Opera)。

从服务器接收的数据会存放在一个临时的文件夹。接收我们缓存的数据。

临时文件夹作用:第二次访问同一个网站速度会变快,因为第一次浏览的时候,大部分文件已经缓存的本地。

4、http请求

HTTP:Hypertext Transfer Protocol,超文本传输协议。

HTTP协议包含了请求和响应两个部分。都是要依赖浏览器。

控制台:F12

HTTP请求发送的方法:直接输入网址,点击超级链接。

请求:request,浏览器根据网址向对应的服务器发送请求。

响应:response,服务器根据请求响应文件,将页面传输给客户端,在浏览器中进行网页的渲染。

访问页面时,会同时发出多个http请求,包含网页的图片、视频、音频等文件。

二、纯文本和html

1、纯文本

最简单的案例:记事本文件就是纯文本文件。扩展名是.txt。

查看文件扩展名的方法:

计算机→工具→文件夹选项

特点:纯文本文件里面只保存文字内容。

与Word文档对比:

Word文档:不止保存文本内容,还保存样式。同样的内容,大小要远大于txt文件。

txt文件:只保存文本内容,不保存样式。大小只是文字内容的大小。

txt文件它只能在同一个电脑修改样式,便于本机查看,但是保存的时候,不保存样式。

2、html

html、css、js都是纯文本文件。纯文本文件可以用任意的纯文本编辑器进行编辑。

最基本的编辑器:记事本。常见的编辑器:记事本、Editplus、notepad++等。

专门制作网页的软件有:Dreamweaver、Sublime 高效率程序书写工具、Webstorm 高级项目编程工具

html:Hypertext Markup Language。超文本标记语言。作用:用来制作网页。

超文本:Hypertext ,html语言用文本来给文本添加语义,用到的文本就叫做超文本。在网页里面不显示。

<h1>欢迎新同事</h1>
<p>欢迎来到新工作环境</p>
<p>好好学习,天天向上</p>

语义:人类的语言有标题和内容。计算机不认识我们人类的话。

html标签作用:给我们的文本增加语义。标签本身就是超文本。

问题:h1标签的作用是什么?

答案:不是给文本添加加粗加大字体的样式,给我们的文本添加一个主标题的语义。

真正控制文字样式的是css。

<style>

      h1{

          font-size: 20px;

          color:red;

      }

</style> 

3、sublime

安装的版本是sublime 2.0版本,是集成了多个插件汉化的傻瓜版本。

使用方法:直接解压到任何位置(避免安装到C盘),然后发送到桌面快捷方式。双击进行使用。

快捷键:

ctrl+N       新建文件

ctrl+s     保存文件

标签名+tab 快速生成标签对

html:xt+tab   快速生成一个html骨架

p*数量+tab 快速生成一定数量的同种标签。

按住滚轮拖动 选中多行进行同时编辑

shift+ctrl+D 复制光标所在行

ctrl+X    删除光标所在行

shift+ctrl+↑ 上移当前行

shift+ctrl+↓ 下移当前行

4、hbuilder

快捷键:

ctrl+N       新建文件

ctrl+s     保存文件

标签名+tab 快速生成标签对

html:xt+tab   快速生成一个html骨架

p*数量+tab 快速生成一定数量的同种标签。

按ctrl + alt + c,进入多行编辑模式,再用鼠标按住左键一划就行了,编辑完毕之后,再次按下ctrl + alt + c,退出多行编辑模式

Ctrl+Shift+d 复制上一行

ctrl+X    删除光标所在行

查找(8)
  搜索条 Ctrl + F
  搜索框 Ctrl + H
  查找文件 Ctrl + T
  隐藏搜索条 ESC

运行 Ctrl + R

向上向下移动:ctri+向上、向下箭头

day1 hbuilder的使用的更多相关文章

  1. Day1 了解web前端

    Day1  了解web前端 一.职业发展路线: 前端页面制作.前端开发.前端架构师 二.1)前端工程师主要职责:   利用HTML/CSS/JavaScript等各种Web技术进行客户端产品的开发.完 ...

  2. 【原创分享·支付宝支付】HBuilder打包APP调用支付宝客户端支付

    前言 最近有点空余时间,所以,就研究了一下APP支付.前面很早就搞完APP的微信支付了,但是由于时间上和应用上的情况,支付宝一直没空去研究.然后等我空了的时候,发现支付宝居然升级了支付逻辑,虽然目前还 ...

  3. xampp与Hbuilder、phpstorm配置

    1.xampp的安装就不用多说了,安装完按之后出现这个界面. 2.点击中间那个按钮,运行三个选项,全部正常之后是这样的,这样xampp就不用管了,但是要记下安装的路径,之后需要用 3.首先说Hbuil ...

  4. NOIp2016 Day1&Day2 解题报告

    Day1 T1 toy 本题考查你会不会编程. //toy //by Cydiater //2016.11.19 #include <iostream> #include <cstd ...

  5. 前端工具HBuilder安装Sass插件

    HBuilder自带未安装的less插件,但是sass插件却没有,需要自己安装,步骤如下: 1.安装sass,参考: http://www.w3cplus.com/sassguide/install. ...

  6. Hbuilder快捷键

    Hbuilder编辑器功能挺强大,体积相对来说比较小,下面是一些常用到的快捷键,尽快熟练使用,成为不用鼠标的大神!哈哈哈!!! alt+↓ 跳转到下一个可编辑区: ctrl+enter 向下换行: c ...

  7. Hbuilder开发HTML5 APP之WebView

    WebView就是原生的WebView,HBuilder在其上封装了一层,便于Javascript的调用,结构如图: 也可以实现这样的结构: 注意:WebView的使用属性HTML5+规范,所以必须等 ...

  8. day1

    day1.py ][][: ][: ): : ]['lock'] = 0 json.dump(userlist_message, open(userlist, 'w')) break #输错次数到3次 ...

  9. HBuilder从下载到使用

    听别人谈论这货,于是决定长长见识,见见世面,便屁颠屁颠到网上下一个,满怀好奇的研究了一下.对用过eclipse这款软件的人来说,上手非常容易. ☆ 准备工作 ① 确认自己的电脑连接网络,能下载东西. ...

随机推荐

  1. oracle基本命令笔记

    最近由于工作原因,再次接触oracle,因此重新来熟知下oracle基本的命令. --改密码 1.运行——键入“cmd” 回车2.键入“sqlplus/nolog” 回车3.键入“conn/as sy ...

  2. NOIP 2018 day1 题解

    今年noip的题和去年绝对是比较坑的题了,但是打好的话就算是普通水准也能350分以上吧. t1: 很显然这是一个简单的dp即可. #include<iostream> #include&l ...

  3. Dom4j与sax 简单对比

    Dom4j与sax之间的对比 dom4j不适合大文件的解析,因为它是一下子将文件加载到内存中,所以有可能出现内存溢出,sax是基于事件来对xml进行解析的,所以他可以解析大文件的xml,也正是因为如此 ...

  4. 转:Java中Scanner类和BufferReader类之间的区别

    原文地址:https://blog.csdn.net/u014717036/article/details/52227782 java.util.Scanner类是一个简单的文本扫描类,它可以解析基本 ...

  5. 《Redis 垃圾回收》

    推荐一首歌 - <纸短情长> 花粥 很好听 一:redis的垃圾回收 - 为了可以使用更多的内存,redis有一套自己的键值淘汰机制. - 修改 maxmemory参数,限制Redis使用 ...

  6. 用canvas把页面中所有元素的轮廓绘制出来

    function plot(){//绘制函数 // 创建一个canvas画布 const canvas=document.createElement("canvas"); canv ...

  7. 【pyqtgraph】pyqtgraph-鼠标互动

    pyqtgraph绘图库官方文档学习-鼠标互动(mouse interaction) 鼠标互动 大多数使用pyqtgraph数据可视化的应用程序都会生成可以使用鼠标进行交互式缩放,平移和配置的小部件. ...

  8. nmap常用参数

    总结: 主机发现 -sn    防止NMAP端口扫描 -SP    TCP 半连接扫描,默认是通过80端口来发现主机的 -SA    ACK ping 扫描 -SU    UDP ping 扫描 不好 ...

  9. 自然语言处理nlp工具

    1.结巴 适合语言:python 应用场景:中文分词较好 不适用于命名实体识别.信息抽取 2.nltk 适合语言:python 应用场景:不适用于中文分词,效果较差 提供了一些用于方便的方法

  10. Tcpdump MySQL Query

    在MySQL线上环境我们一般只打开了binary log,slow log,有时我们需要查看general log呢?因为该log记录所有的请求,打开该日志肯定给磁盘造成很大压力,IO能力有所下降,所 ...