css如何设置超链接不可点击?
css可以通过pointer-events、color、cursor属性设置超链接颜色、鼠标样式和链接失效实现超链接不可点击效果。
设置超链接不可点击的css样式:
12345a{ pointer-events:none; color:#afafaf; cursor:default;}
上述样式详解:
pointer-events:none;设置链接失效,pointer-events属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的target。
color:#afafaf;样式设置链接颜色为灰色。
cursor:default设置鼠标在链接上的样式。
示例
1234567891011121314151617<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="tex ...
不同类型的请求及其作用,API的分类
不同类型的请求及其作用:
GET:从服务器端读取数据
POST:向服务器端添加新数据
PUT:更新服务器端已经存在的数据
DELETE:删除服务器端数据
REST API: restful
发送请求进行CRUD哪个操作由请求方式来决定
同一个请求路径可以进行多个操作
请求方式会用到GE/POST/ PUT/DELETE
2.非 REST API: restless
请求方式不決定请求的CRUD操作
一个请求路径只对应一个操作
一般只有GET/POsi
提示:1,REST API 又叫 restful,非 REST API 又叫 restless;2,CRUD:代表着增删改查操作;3,REST 和 非REST 的区别就是一个接口请求方式的不同,后台数据库可以进行不同的操作;
推荐一个假的rest api:链接地址:https://github.com/typicode/json-server
使用简单说明:1,首先下载(成功);
2,点开readme.md,找到Getting started(入门指南)
3,打开控制编辑器的终端控制台( ...
16个实用JavaScript代码片段DOM,Cookie,数组,对象
850561f5f541e4f7f89a26a5364a8d05902b0e18cb0e36a8f70ccc805d2ecf6bdc04fe68bb2ac2399be4ac4bea766da3b0ab0e50dfb9c254a2e9d039ffc9604743cf02ead4a9597780db2c0474c87cad2560c5a047be27067796d04de667bc14dd5931a8703ae2c49aa46141c7d796103df02ccdd5d12a9526c022cefcb4dbc9cbb3c2580172655d3a9a6d67cb842b88023d83400bb11a40b1d9f230116dd2bfbce141fdbf84f91a4ce2860d5ee39c3876f428620c0379eccb182608d1a3e40a22566226df8bb514b4a5e4e26bccb7145252698d5f1f3dd29882772cfbdd2fda8118ed31dda211f35491e29af74dfe858c209bbbd58c27dc5 ...
javascript中添加数据到数组中,以及点击某一项数据从数组中删除方法
850561f5f541e4f7f89a26a5364a8d05961dca1b1a96a58925ccb970ff5b5bf4536a4a4062edf5debfc799ce046fdea4292b165ef02e3e2117e09e58a18fa1ccada09c5bfed6963ddec0b7729dbc0f8e2840c9110610c3cf8c329daccd40cbc0e23c5d2e47ece472a15ebe1e6acd16e49e38a2eedfea4e955aa8d8ab62bdea14c5201409af54fc99bedab16758e02a221f8bdb9c6c1364824c0c1e651600a38a83331d16afc774b6fe6b6ec17a06f74ee73ed82663aafc2039af82d185195360c1a7947e0659d4743e2ca19f802426417b588954b85eed368e8cddcdcf645e18345c45546890056dcb29cbb3d0b126bcf0a56a0de98b89394 ...
javascript删除数组和添加数组数据元素的几个方法
在JavaScript中,除了Object之外,Array类型(数组)恐怕就是最常用的类型了。与其他语言的数组相比,JavaScript中的Array非常灵活。这种灵活性有利有弊,好处是其富有创造性,可以提供各种灵活的解决方案;坏处是容易脑子不够用,因为事实上,它太灵活了,灵活到无法控制的抓狂。
前面调侃了几句,回归正题,这里要总结几个在JavaScript中删除Array元素的方法,分别是利用length属性、delete关键字、pop()栈方法、shift()队列方法、splice()操作方法、forEach()或filter()迭代方法和prototype原型方法。
length属性
JavaScript中Array的length属性非常有特点一一它不是只读的。因此,可以通过设置这个属性来达到从数组的末尾移除项或添加新项的目的。
1234var colors = ["red", "blue", "grey"]; // 创建一个包含3个字符串的数组colors.length = 2;console.log(colors ...
centos7操作系统环境采用nodejs-websocket搭建websocket服务器
850561f5f541e4f7f89a26a5364a8d0509c0c2740ff75d7fc51f5138590c0d345ed18e0dd6130e0dfb7ce518e4ae98bf9c66ce67419a886b1b3b3317dfd06555f5d37b3fdb3804c0991f396a18ff9ef4eebf95a5707c0ef041513b659f8de03ba23e20f21d4a076511fd50841aaeaeb45ef29c4787c47bdcbdbf9336cda65a4d23e2a512f38997008932f1c15b6677ea0dc487d871218a48c449f007db38ffa7fb445846992f43feaa85bfd1401cb2c73dfb7ffc6e4209ed0625af88dddc6e69c7bf72791d7b13a56a5ccc917787230db0e5b7d9f304c6273f6d72004af07d39499a3455ea7b7133ba5894530612b91197a05588e2ff72d8f ...
flex布局
flex(Flexible Box)布局(弹性布局)是W3C在2009年提出的一种新的布局方案。
当你设置了flex布局之后 子元素的float、clear和vertical-align属性将失去作用。
相对于传统的display属性 + position属性 + float属性布局,更容易实现一些功能。
可以简便的完整的响应式的支持g各种页面布局。
123div{ display:flex;}
flex的几个属性:
一、flex-direction1、row(默认值):主轴为水平方向,起点在左端。2、row-reverse:主轴为水平方向,起点在右端。3、column:主轴为垂直方向,起点在上沿。4、column-reverse:主轴为垂直方向,起点在下沿。
1234flex-direction:row;flex-direction:row-reverse;flex-direction:column;flex-direction:column-reverse;
二、flex-wrap1、nowrap(默认):不换行。2、wrap:换行,第一行在上方。3、wra ...
CSS中px,em,rem,%,vw,vh单位之间的区别详解
这篇文章主要介绍了CSS 中px、em、rem、%、vw、vh单位之间的区别,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值。
1 、pxpx就是pixel(像素)的缩写,相对长度单位,相对于屏幕分辨率。
2、em参考物是父元素的font-size,具有继承的特点。浏览器默认字体是16px,整个页面内1em不是一个固定的值。
字体大小同样都是1.5em,但是效果却截然不同,按照W3C提供的公式,我们可以计算下: class为id1的div字体大小继承自父元素body:16px1.5em = 24px class为id2的div字体大小继承自父元素id1:24px1.5em = 36px class为id3的div字体大小继承自父元素id2:36px*1.5em = 54px
em相关补充知识:
通常情况下,用户的浏览器默认渲染的文字大小是 16px。
用户可以通过重新定义根标签(或者父元素标签)的 font-size 属性来重新定义默认的文字大小
在响应式布局中,页面中的所有元素都使用额 em 单位值,em 是一个相对的大小 ...
大前端学习路线图
这是一篇非常详细的且经典的前端学习路线图
下面会按顺序分模块给大家展示学习内容,让大家学习的时候有成就感,学习更平滑;
第一阶段:PC端页面制作与动画特效学完第一阶段就可以配合UI设计师进行项目开发完成pc端网页的布局制作与样式设计实现。
一、html+css搭建页面
HTML语义化标签
Html标签规范
Css样式基础
Css高级及布局方案
二、PhotoShop切图流程
Photoshop基本使用
了解各种图片格式及优缺点
图片切图流程
PSD格式源文件切图流程
设计图转页面布局实际操作
三、Css3动画特效
Transition过渡
Transform变形
Animation动画
3D特效制作
第二阶段:移动端页面制作与响应式实现这一阶段主要是移动端网页的布局制作与样式设计实现。可以适配各种手机尺寸,并能利用响应式惊醒移动端与PC端适配。
一、移动端概念与布局
移动端概念,如:PPI、像素比
Viewport视口
移动端适配方案
移动端尺寸单位,如:rem、vw
移动端布局实际操作 ...
大前端是什么?
大前端是什么?简单来说,大前端就是所有前端的统称,比如Android、iOS、web、Watch等,最接近用户的那一层也就是UI层,然后将其统一起来,就是大前端。大前端最大的特点在于一次开发,同时适用于所有平台,开发者不用为一个APP需要做Android和iOS两种模式而担心。大前端是web统一的时代,利用web不仅能开发出网站,更可以开发手机端web应用和移动端应用程序。
大前端为什么出现?由于node的出现,前端工程师不需要依赖于后端程序而直接运行,从而前后端分离起来。所以当开发一个新产品的时候服务只需要写一次,但是面向用户的产品可能有很多,例如网站、Android客户端、iOS客户端和微信小程序等。由于各个平台使用的技术栈都不一样,代码无法复用,非常浪费人力、物力。那么有没有什么技术能够解决这一痛点呢?大前端应运而生,其实大前端的主要核心就是跨平台技术,有了跨平台技术,各个平台的差异性就抹平了,开发者只需要一套技术栈就可以开发出适用于多个平台的客户端。
跨平台方案简介目前的主流跨平台方案:Cordova/phoneGap、React Native、Weex、微信小程序、 ...