1.什么是HTML?

HTML是一种超文本标记语言,而不是编程语言

2.什么是CSS?

css是层叠样式表,用于润饰文档的语言,能够将文档以更优雅的模式出现给用户

3.HTML和CSS、JavaScript的关系

html和css、js为网页三要素html:网页框架的构建   构造css:款式的设置    页面js:事件、动静、  行为  相应用户的操作

4.在VSCode软件下的快捷键:

正文:ctrl+/
换行:ctrl+enter
生成文档构造:shift+!回车即可
间接写HTML:5回车即可

5.HTML页面构造的具体介绍

(1)<!DOCTYPE html>html5规范网页申明,不加这一行的话,就示意页面采纳浏览器自身的解析规范,这样会造成页面在不同的浏览器可能会呈现不同的显示成果。h5的文档申明,申明以后的网页是依照html5规范编写的编写的。如果不写文档申明,则会导致有些浏览器会进入一个怪异模式,进入怪异模式后,浏览器解析页面会导致页面无奈失常显示,所以为了防止进入该模式,肯定要写文档申明。(2)<html lang="en">    a.html是根标签,一个页面中有且只有一个根标签,网页中的所有内容都应该写在html根标签中    b.属性lang是language的缩写,意思是语言,en代表的是英语,zh—CN代表中文    c.html根标签中只有两个子标签,head:浏览器的设置,body:可视区展现(3)<head></head>    head标签中的内容不会间接在网页中显示,是用来帮忙浏览器解析页面的(4)<meta charset="UTF-8">    a.meta标签用来设置网页的一些元数据,比方网页中的字符集,关键字,简介    b.meta是一个自完结标签,编写一个自完结标签时,能够在开始标签中增加一个    c.字符编码:浏览器会依据字符编码进行解析,常见的字符编码有:gb2312、gbk、unicode、utf-8(5)<meta name="viewport" content="width=device-width,initial-scale=1.0">    a.viewport:设施的屏幕    b.width=device-width:width属性管制屏幕设施的宽度,如果你的网站将被带有不同屏幕分辨率的设施浏览,那么将它设置为device-width能够确保它可能正确出现在不同的设施上。    c.initial-scal=1.0:确保网页加载时,以1:1的比例出现,不会有任何的缩放。(6)<title></title>    浏览器选项卡上的名字(7)<body></body>    设置网页的主体内容,网页中所有可见的内容,都应该在body中编写,在body里的内容都是显示在浏览器的视区内的。

6.实体

空格:&nbsp;小于号:&lt大于号:&gt版权:&copy注册商标:&reg

7.块级元素

(1)作用:搭建网页构造(2)罕用元素:htm、body、div、p、ht~h6、ul->li、ol->li、dl->dd/dt、header、footer、nav,artice、section、aside、adderss、(3)特点:    a.独占一行空间    b.默认宽度为100%(如果有父元素,则绝对于父元素来说,如果没有,则绝对于浏览器而言)    c.高度由子元素或内容决定(撑起来)    d.能够通过css指定其宽度    e.块级元素能够嵌套块级元素和行内元素

8.行内元素

(1)作用:在构造中填充网页内容(2)罕用元素:span、a、img、strong、b、i、em、sub、sup...(3)特点:    a.与其余行内元素共享一行空间    b.高度由本身决定    c.因为不必搭建网页构造,所以也无需通过css指定其宽度    d.a标签        a:链接内部或外部网址 href="相对路径./../ /绝对路径:http://ip:端口号/我的项目/文件名"(https://)      经典利用:锚点 定义锚点、链接锚点        1.给一个跳转按钮,也就是触发跳转的按钮 返回顶部<a href="#">回到顶部</a>        2.要跳转到的地位:<div id="center">找到我</div>        3.<a href="#center">返回顶部</a>       target:定义点击后页面加载的地位 默认取值_self                                                 _blank 在新窗口关上/新标签页     e.img标签       img :放图片       src 放图片地址       width  图片宽度       height 图片高度       alt 图片加载呈现问题时给用户展示的内容       title 鼠标悬停时的文字提醒

9.块级元素与行内的区别 面试题(80%)

  (1).经典:块级元素独占一行,行内元素与其余元素共享一行  (2).宽高:块级能够间接设置宽高,行内不能够间接设置宽高。  (3)img 、input 属于非凡的行内元素,也称为置换元素,img和input能够设置宽高,然而为行内元素,须要用display扭转元素属性来设置  (4).块级元素能够蕴含块级与行内,行内只能蕴含行内

10.web的第一门编程语言

JavaScript

11.列表元素

(1)无序列表:给一堆数据增加列表语义,并且这一堆数据中所有的数据都没有先后之分     a.ul、li 相当于班级与同学的关系、城市    b.<ul type="value">         <li></li>      </ul>    c.type取值        disc 实心 默认值        circle 圆心 空心        square 实心 方块(2)有序列表:给数据增加列表语义,并启动这一堆数据中所有的数据都有先后之分(排行榜)    a.<ol type="value">        <li></li>    </ol>    b.type取值:        数字        大写字母        小写字母        罗马字母大写        罗马字母小写(3)定义列表:dl-dt/dd(没有那么重要)        先通过dt标签定义列表中的所有题目,而后再通过dd标签给每个题目增加形容信息

12.表格标签

(1)一对table标签就是一个表格    (2)一对tr标签就是表格中的一行    (3)一对td标签就是一行中的一个单元格(4)<table>        <tr>            <td>内容<td>        </tr>    </table>(5)留神:        a.表格标签有一个border边框属性, 这个属性决定了边框的宽度. 默认状况下这个属性的值是0, 所以看不到边框        b.表格标签和列表标签一样, 它是一个组合标签, 所以table/tr/td要么一起呈现, 要么一起不呈现, 不会单个呈现        c.如果给td标签设置widht/height属性, 会批改以后单元格的宽度和高度, 不会影响整个表格的宽度和高度        d.表格的宽度和高度:默认是依照内容的尺寸来调整的,手动扭转table的width/height属性        e.单元格的宽高:td的width、height        (行内款式:style="color:red;background-color:red";)(6)表格内单元格的程度、垂直对齐        程度:align   table(表格程度对齐形式)、tr(以后单元格内容的程度对齐形式)、td(以后单元格内容的程度对齐形式)        垂直:valign  tr/td(以后单元格内容在垂直方向的对齐形式)(7)表格的外边距与内边距属性        a.cellspacing外边距:单元格和单元格之间的间隔 默认状况下是2px        b.cellpadding内边距:单元格的边框和文字之间的间隙(调整表格内容与边框的间隔)默认状况下是1px(8)单元格合并        a.colspan  程度方向上的单元格合并,合并列        b.rowspan  垂直形式上的单元格合并,合并行

3.form表单

(1)<form action="提交的服务器接口地址">        <表单元素>     </form>     留神:表单元素肯定要写在表单中(2)根本表单元素        a.明文输入框             <input type="text" name="account" placeholder="请输出用户名">                name:表单提交时,会作为参数的名称,联合输出的值进行匹配,组成参数名=参数值的构造                placeholder:提醒        b.暗文输入框 加密操作            <input type="password" name="password" placeholder="请输出明码">        c.单选框             <input type="radio" name="xx" value="xxx" checked>             互斥操作:给每一个单选框设置雷同的name属性,还必须设置雷同的值            checked:默认选中        d.多选框             <input type="checkbox" name="xxx" value="xxx" checked>            checked:默认选中         e.提交按钮            <input type="submit">            作用: 将表单中曾经填写好的数据, 提交到近程服务器            交到服务器地址(action属性:服务器地址)            留神:若想将表单数据提交到后盾,表单元素须要有name属性        f.一般按钮             <input type="button" value="xxx">        g.图片按钮             <input type="image" src="">        h.重置按钮 清空表单中曾经填好的数据            <input type="reset" value="xx">