前端介绍开始(—)

web 的组成浏览器服务器:代替用户向服务器发送请求通信协议:规范数据传输及打包方式(http,https)
服务器:1 作用:1 接收用户请求并响应 2 存储数据3 具有安全性功能2 产品:1 Tomcat2 Aapache3 Nginx4 IIS3 技术:1 python web (django flash ,tornado)2 PHP3 JAVA4 ASP.net5 JSp (java serverlet page)4 浏览器:1 作用:1 代替用户向服务器发送请求2 作为响应数据的解释引擎,呈现图形化界面2 主流的浏览器产品:1 Chrome -- Google 公司2 IE    --    microsoft3 safari -- Apple4 Firefox -- Mozilla5 Opera --Opera3 浏览器引擎(内核)1 渲染引擎 - 解析 HTML 。css.控制而面渲染效果2 js 引擎 -- 解析js 脚本4 前端技术1 HTML    书写页面结构和内容2 CSS    设置网页中的元素的样式3 JS     实现网页的交互4 工具库,框架
2 html 概述1 html介绍HyperText Markup Language超文本        标记    语言2 超文本:具有特殊功能文本et:普通文本 a超文本 a 表示超链接普通文本 b超文本 b 表示加粗3 标记1 也叫标签。元素2 主要用来标记网页中的内容3 可以实现网页布局及JS交互4 HTML 在计算机中的表现形式网页文件在计算机中都是以.html/ .htm 后缀表示工具1 记事本2 EditPlus Sublime WebStorm Vscode运行工具:浏览器 以Chrome 浏览器为准调试工具:浏览器开发者工具 F121 HTML 中的标签都以<>为标志2 标签分类1 双标签:成对出现,有开始标签,有结束标签<html></html>2 单标签:<hr> 水平线<hr/>3 标签嵌套1 在嵌套结构中,外层标签称为“父元素‘,内层元素称为’子元素‘多层元素时,内部元素称为后代元素head网页头部信息:编码方式,网页名称网页选项卡的小图标,网页信息介绍引入外部资源文件body 网页的主体信息:所有需要呈现给用户的,需要显示在窗口中的内容,都应在body中书写4 标签属性标签属性主要是用来修饰当前标签的显示效果,对当前标签或者网页的补充设置语法:1 书写位置:标签属性都书写在开始标签中,与标签名之间使用空格隔开2 属性是由属性名和属性值组成的属性名= ‘属性值’属性值必须使用引号引起来,单双引号都可以3 多个属性时,属性之间使用空格隔开5 HTML 语法规范1 HTML 不区分大小写 (推荐使用小写)2 保持适当缩进,保证代码可读性3 保持适当注释,保证代码可读性6 HTML注释<!-- 注释内容 -->注意 :1 HTML 注释不能嵌套2 不能书写在标签内部的7 HTML 中的换行与空格1 HTML会忽略多余的空格,只显示为一个空格2 代码中
4 文档组成1 文档类型声明<!DOCTYPE html> 声明当前为HTML文档 ,这种H5 的声明方式    作用:    1 告诉浏览器文档为html文档2 按照H5的渲染方式解析网页书写位置:文档开头:<html>标签之前2 文档内容<!doctype html><html><head><meta charset='utf-8'><title>网页标题</title></head><body>网页主体</body></html>
5 常用标签1 标题标签1 作用:以标题的形式显示文本(加粗,字号不同)2 语法:<h1></h1> 一级标题....<h6></h6>注意:标题文本大小,从h1 至h6逐级减小2 段落标签1 语法:<p></p>2 可以通过标签属性 align = ''设置水平对齐方式取值 left/center/right默认左对齐,3 其他的文本标签1 文本加粗:<b></b> <strong></strong>2 文本斜体:<i></i> (italic)3 添加下划线:<u></u> (underline)4 添加删除线:<s></s> 说明:以上4种标签,涉及到样式,都可以使用css添加效果 加粗 倾斜 下划线5  添加上标:            <sup></sup>6 添加下标                <sub></sub>7 行内分区标签    <span></span>,一般嵌套在其他标签中,用来为特殊文本添加样式8  <label></label>普通文本标签4 格式标签1 换行标签<br> 等价于 <br/>2 水平线    <hr> 等价于 <hr/>5 字符实体1 &lt ; 表示 <2 &gt;  表示 >3 &nbsp ; 表示一个空格4 &copy ; 表示版权符号5 @yen ;  表示人民币¥6 块级分区标签语法:<div></div>作用:容器标签,长用于页面模块划分7 标签嵌套的规范:1 标签类型划分:1 块级元素:独占一行,不与其他元素共行h1 - h6 p div 2 行内元素:可以与其他元素共行显示b strong i u s span label sup sub 2 标签嵌套规范:1 块元素中可以嵌套任意类型的元素2 行内元素中尽量只嵌套行内元素3 特殊情况:段落标签中不可以嵌套其他块元素的
6 列表标签1 列表:从上到下排列数据的结构列表中的数据都带有项目符号2 语法:1  列表分类:1 无序列表2 有序列表3 自定义列表2 列表的组成1 无序列表由列表标签与列表项标签组成<ul> unordered list <li></li> list item</ul>注意:ul中嵌套li元素,每一个li元素表示一条数据2 有序列表由列表标签与列表项组成<ol> order list<li></li></ol>3 定义列表<dl><dt></dt><dd></dd></dl>4 列表属性只针对有序列表和无序列表1 有序列表 -ol1 type:取值:1 表示按照数字排序,默认项目符号a 表示按照小写字母排序A 使用大写字母作为项目符号i 使用小写罗马数字I 使用大写罗马数字2 start:设置项目编号从第几个开始取值:数字,表示从第几个开始2 无序列表 -ul1 .type :设置项目符号取值:    disc:默认实心圆点circle:空心圆square:实心正方形
7.图片与超链接1 URL2 路径分类:相对路径:从当前所在的文件夹开始查找绝对路径:从计算机的根目录开始查找3 图片标签:<img src =''>src中为图片的URL,可以是网络路径,也可以是本地路径

 

转载于:https://www.cnblogs.com/Skyda/p/9732894.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/367137.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python数据结构与算法13_python 数据结构与算法 (13)

python 数据结构与算法 (13)选择排序 (Selection sort) 是? 种简单直观的排序算法. 它的? 作原理如 下.? 先在未排序序列中找到最?(?)元素, 存放到排序序列的起始位 置, 然后, 再从剩余未排序元素中继续寻找最?(?)元素, 然后放到已排 序序列的末尾. 以此类推, 直到所有元…

算法10-----分糖果

1、题目&#xff1a; N个孩子在队伍中&#xff0c;每个孩子都有一定的等级值&#xff0c;相邻两个孩子等级高的拿到的糖果数量要比等级低的多&#xff0c;且每个孩子至少有一个糖果&#xff0c;所以最少队伍一共需多少糖果。 There are N children standing in a line. Each ch…

小程序如何发红包

咳咳&#xff0c;直入主题。敲黑板&#xff0c;请看下面一段对话。 产品&#xff1a;我想要小程序发红包这个功能 程序员&#xff1a;目前不支持啊 产品&#xff1a;我不管&#xff01; 程序员&#xff1a;做不到啊&#xff0c;这。。。 产品&#xff1a;我不管&#xff01;我不…

如何实现REST资源的输入验证

如何实现REST资源的输入验证 我正在使用的SaaS平台具有一个RESTful接口&#xff0c;该接口可以接受XML有效负载。 实施REST资源 对于像我们这样的Java商店&#xff0c;使用JAX-B从XML Schema生成JavaBean类是有意义的。 在像Jersey的JAX-RS环境中&#xff0c;使用JAX-B处理X…

Linux系统下,MySQL以及禅道的安装/卸载

1、MySQL卸载&#xff1a; &#xff08;通过yum命令卸载之前安装的mysql&#xff0c; find命令找到mysql文件&#xff0c;再用rm –rf 强制删除/var/lib/mysql&#xff09; 2、MySQL安装&#xff1a; &#xff08;使用yum命令安装mysql&#xff0c;安装完成后启动数据库&#x…

python类对象点处折行_史上最全的Python面向对象知识点疏理(对象是类的实例)

(对象是类的实例)面向对象技术简介类:用来描述具有相同的属性和方法的对象的集合。它定义了该集合中每个对象所共有的属性和方法。对象是类的实例。class类变量&#xff1a;类变量在整个实例化的对象中是公用的。类变量定义在类中且在函数体之外。类变量通常不作为实例变量使用…

winform 点击全选

代码如下&#xff1a; #region 全选//chkAll_Checked即全选控键的点击事件private void chkAll_CheckedChanged(object sender, EventArgs e){if (chkAll.Checked){chkSun.Checked true;chkMon.Checked true;chkThu.Checked true;chkTue.Checked true;chkWed.Checked true…

今天的考核题目: 你知道React和Vue的区别吗? skr,skr

React 和 Vue 的区别 博主面了几家公司&#xff0c;看简历上写着使用Vue.js框架&#xff0c;就会问&#xff0c;你能说一说 vue 和 react的区别吗 &#xff1f;react 听过&#xff0c;没用过&#xff0c;所以就只能尴尬的说不怎么了解react。这不&#xff0c;最近刚学了react …

Play和Grails Java框架的优缺点

框架通过为程序员提供一些有用的功能来简化应用程序开发过程。 由于开发人员的普遍使用&#xff0c;Java框架经常被开发人员使用。 您可以在市场上找到各种Java开发框架。 新手开发人员经常在论坛上发布一个常见问题&#xff1a;“哪种Java框架是最好的&#xff1f;” 首先&am…

C++小项目-吃豆子游戏

GMap.h #pragma once //保证头文件只被编译一次#include "stdafx.h"#define MAP_LEN 19 //逻辑地图大小 (逻辑地图由行、列各为19的方块组成)#define P_ROW 10 //大嘴出生地的横逻辑坐标 #define P_COLUMN 9 //大嘴出生地的列逻辑坐标 #define E_ROW 8 //敌人出…

argb888与rgb888转换程序_一文了解各平台RGB565和RGB888区别

原标题&#xff1a;一文了解各平台RGB565和RGB888区别用过AM335x平台的小伙伴应该知道&#xff0c;OK335xS开发平台的LCD接口是RGB888模式的&#xff0c;而OK335xD开发平台的LCD接口是RGB565模式的。如果把xS的镜像烧写到xD平台上&#xff0c;那么LCD会显示颜色异常。这是为什么…

d4d#9 玩Docker只要浏览器就够了,PWD是个神奇的网站

本文是d4d系列的第9篇&#xff0c;在这一篇中给大家介绍一个学习Docker最为快捷高效的方式&#xff0c;你不需要自己搭建环境&#xff0c;也不用担心把自己的开发环境搞乱&#xff0c;你需要的只是一个浏览器&#xff0c;就可以立即开始学习Docker的常用命令&#xff1b;你甚至…

基于 Docker 打造前端持续集成开发环境

知乎: https://zhuanlan.zhihu.com/p/37961402本文将以一个标准的 Vue 项目为例&#xff0c;完全抛弃传统的前端项目开发部署方式&#xff0c;基于 Docker 容器技术打造一个精简的前端持续集成的开发环境。 前置知识&#xff1a;1. CI&#xff08;持续集成&#xff09;&#xf…

哪个内存更快?Heap或ByteBuffer或Direct?

Java正在成为新的C / C &#xff0c;它被广泛用于开发高性能系统。 对像我这样的数百万Java开发人员来说非常好&#xff01; 在这个博客中&#xff0c;我将分享我可以用Java完成的不同类型的内存分配实验以及您从中获得的好处。 Java中的内存分配 Java提供哪种类型的内存分配…

java没有打印mysql日志_0216 aop和打印数据库执行日志

需求maven依赖p6spyp6spy3.8.7com.google.guavaguava28.2-jreorg.springframework.bootspring-boot-starter-data-jpaorg.springframework.bootspring-boot-starter-webmysqlmysql-connector-javaruntimeorg.projectlomboklomboktrue打印sql配置要点&#xff1a;驱动配置 appli…

php数组基础

php中&#xff0c;数组的下标可以是整数&#xff0c;或字符串。 php中&#xff0c;数组的元素顺序不是由下标决定&#xff0c;而是由其“加入”的顺序决定。 定义&#xff1a; $arr1 array(元素1&#xff0c;元素2&#xff0c;。。。。。 ); array(1, 5, 1.1, “abc”, tr…

1.格式化输入输出

1.格式化输入input() input()函数&#xff0c;通常只能返回一个数据类型&#xff0c;那么怎么可以进行多个变量的复制呢&#xff1f;看下面这段代码。 1 str1, str2 eval(input("请输入两个字符串&#xff1a;")) 2 print(str1, str2) 3 4 num1, num2 eval(input(…

canvas像素点操作 —— 视频绿幕抠图

原文地址 主要内容 上篇文章学习了canvas像素点的获取 —— 传送门&#xff0c; 今天学一下canvas像素点操作。 一个方法&#xff1a;putImageData putImageData 用法&#xff1a; context.putImageData(imgData, x, y, dX, dY, dWidth, dHeight);参数描述imgData规定要放…

Java中的迭代器设计模式–示例教程

迭代器模式是一种行为模式&#xff0c;用于提供遍历一组对象的标准方式。 Iterator模式在Java Collection Framework中得到了广泛使用&#xff0c;其中Iterator接口提供了遍历集合的方法。 根据GoF&#xff0c;迭代器设计模式的意图是&#xff1a; 提供一种在不暴露其基础表示…

random

1 import random2 3 result random.randint(1, 7) # 随机生成1到7的整数4 result random.random() # 随机生成[0,1)的浮点数5 result random.randrange(1, 7) # 随机生成1到7的整数6 result random.choice([1, 2, 3, 4]) # 从列表中随机选择一个元素7 result random.c…