HTML CSS JS总结

1,常用的标签

        1.标题标签<h1><h1>

        2.段落标签<p>

        3.换行标签<br/>

        4.文本格式标签  (1)加粗:<strong></strong>或<b></b> (2)倾斜:<em></em>或<i></i>         (3)删除线:<del></del>或<s></s> (4)下划线:<ins></ins>或<u></u>

        5.<div>和<span>标签

        6.图像标签  <img src="图片路径" alt="替换文本"/>

        7.超链接 <a href="链接地址">文本或图像</a>

        8.列表标签 (1)有序列表: <ol><li>列表项</li></ol>(2)无序列表:<ul><li>列表项</li></ul>        (3)自定义列表 <dl><dt>标题</dt><dd>数据项</dd></dl>

2、标签分类

  • 块级元素

    • 独占一行,

    • 可以设置宽高,如果不设置,默认占据父元素宽度的100%,

    • 块可以嵌套 块 和 行

    • 标签:div,h1-h6 ul ol dl li p table form

  • 行级元素:

    • 在行内显示,与其他行内元素并排显示,一行排不下了才折行显示,

    • 内容撑开宽高,不可以设置宽高(img、input除外),

    • 行标签通常嵌套行标签

    • 标签:span a em strong input img

    • 特殊标签:img 和 input ,行内块状标签,兼具两种类型标签的特点

3、css的引入方式有几种?

        1、内嵌: <head><style></style></head>

        2、外部样式:一个独立的css文件 ,页面中引入。

4、选择器类型

1、标签选择器,通过标签来选择页面元素。直接写标签名,会把页面中所有的相同标签的都选中

h1{
​
 属性:值;
​
}

2、id选择器

通过自定义的id属性来选择元素,id唯一,不可重复id=”id名”

#id名{
 属性:值;
}

3、类选择器

通过自定义的类属性,通过类名来选择元素,类可以重复,可以多个,class=”类名”

.类名{
​
 属性:值;
​
}

5、定位分为哪几类

        定位分为相对定位、绝对定位、固定定位和粘性定位。

        相对定位:相对于该元素原始的位置进行定位,不会脱离文档流,后续元素不受影响。

        绝对定位:相对于已经使用了定位属性的祖先元素进行定位,如果祖先元素没有使用定位属性,以(0,0)进行定位, 脱离文档流,后续元素会受影响。

        固定定位:相对于浏览器进行定位,脱离文档流 。

        粘性定位:相对定位+固定定位,必须设置一个阈值(top,left,bottom,right)

6、什么是浮动?

 float:left | right :让标签在 水平方向上靠左或者靠右停放,碰到父容器的边缘或者是前一个浮动元素的边缘为止;

  浮动对行内和块状元素的效果:

1、行内元素浮动,会变成不独占一行的块状元素,可以设置宽和高。

2、块状元素浮动,依旧是块状元素,不会独占一行;可以让块状元素水平排列,用来布局。
 

7、JavaScript引入方式有哪些?有哪些变量?

 内部脚本:将JS代码定义在html页面的<script></script>中。     
 外部脚本:将JS代码定义在js文件中,通过<script></script>标签引入。

 var:声明变量,全局作用域/函数作用域,允许重复声明。
 let:声明变量,块级作用域,不允许重复声明。
 const:声明常量,一旦声明,常量的值不能改变。

9、JS常见的事件有哪些?

   1、鼠标事件:

     mouseenter:鼠标进入一个节点时触发,进入子节点不会触发这个事件,不支持冒泡

     mouseleave:鼠标离开一个节点时触发,离开父节点不会触发这个事件,不支持冒泡

    contextmenu:按下鼠标右键时(上下文菜单出现前)触发,或者按下“上下文”菜单键时触发。

     mousedown:按下鼠标键时触发。

        2、键盘事件:

     keydown:按下键盘时触发,当键盘按下任何一个键的时候发生(包括系统键)

    keypress:按下有值的键时触发,即按下 Ctrl、Alt、Shift、Meta 这样无值的键,这个事件不会触发。对于有值的键,按下时先触发keydown事件,再触发这个事件。

     keyup:松开键盘时触发该事件。

        3、表单事件:

                (1)input事件  当<input>、<select>、<textarea>的值发生变化时触发。

                (2)change事件 当<input>、<select>、<textarea>的值发生变化时触发。它与input事件的最大不同,就是不会连续触发,只有当全部修改完成时才会触发,另一方面input事件必然伴随change事件。

                (3)焦点事件  focus:元素节点获得焦点后触发,该事件不会冒泡。blur:元素节点失去焦点后触发,该事件不会冒泡。

                4、其它事件:load事件、DOMContentLoaded 事件、unload卸载事件、scroll事件 、resize事件

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值