写点什么

html/css

2 人感兴趣 · 55 次引用

  • 最新
  • 推荐
https://static001.geekbang.org/infoq/15/15fd80365175b4d5908fea8626b05832.gif?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

每天一个 CSS 小特效,文字闪烁——【钢铁侠:爱你三千遍】

我是前端小刘不怕牛牛,<font color=skyblue>love you 3000</font>,愿你能遇到值得的人。今天分享一个唯美的文字闪烁CSS特效希望大家能喜欢

https://static001.geekbang.org/infoq/56/56b5d285bfcde341341043a9627928c9.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

如何使用 HTML 和 CSS 写一个登录界面

用户头像
宇宙之一粟
2022-03-18

最近一直想利用写个 Go Web 项目,但苦于自己一直没有前端知识,所以想也从小白的角度(其实也不算)来学习前端的那些知识,今天就来介绍一下 HTML 和 CSS 。

https://static001.geekbang.org/infoq/0e/0e862894bf1e8d8798fd87778d4a7fe0.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

「offer 来了」面试中必考的 15 个 html 知识点

对于前端开发人员来说, html 可能是最早接触的一门语言之一。基本上刚开始学前端,都会先学 html 。虽说它的内容看起来不多,但是在面试中,还是有一些考点需要我们去注意。下面就 html 在前端面试中的考点,进行介绍。一起来学习吧~🧐

https://static001.geekbang.org/infoq/10/10c2c31abee5d9cb57dccea1a57ec137.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

盘点 JavaScript 哪些常用的数组对象

用户头像
你好bk
2021-12-07

上一篇中我们盘点了 js 哪些最常用的内置对象,对Math、random以及Date对象进行了详细的讲解,这三个对象在往后的工作中也是发挥着举足轻重的位置,都是非常常用的对象,可以自己在编辑器中多加练习

https://static001.geekbang.org/infoq/e5/e5637d497a3a6c70bdcd3f397f5eda9a.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

JavaScript 中的这些内置对象

用户头像
你好bk
2021-12-06

上一篇中我们说了 js 中的作用域和预解析,感受了 js 发展的过程中一些特有的声明和语言文化,js 在运行的时候也是按照预解析的顺序来运行的,所以会出现某些语句声明不恰当报错的行为。每门语言的诞生和发展同样也绕不开它当下所诞生的背景和时代发展的历程

https://static001.geekbang.org/infoq/cd/cd19624b90d81de5c58ffd73615b7ff0.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

JavsScript 基础篇之函数定义的几种不同方式

用户头像
你好bk
2021-11-22

在上一篇中我们聊了聊数组的创建和获取数组中元素的方法,同时上一篇中我们主要利用数组来处理一些基本的运算,提升一下逻辑能力,对于刚入门的来说这些还是挺难的。不过没关系,你可以看看多缕一缕它们之间的关系,不需要死记硬背,以理解为主。慢慢熟悉就可

https://static001.geekbang.org/infoq/19/1904b6d86730c85f573cf8936926684e.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

javaScript 基础篇说一说循环应该怎么用

用户头像
你好bk
2021-11-13

上一篇中我们学习了 js 的第二篇运算符和表达式,在运算符和表达中我们简单的讲述了算术运算符、比较运算符和逻辑运算符等这些的内容,这些都是工作中比较常用的内容,也是逻辑中满足了最基本和最常用的这些运算。除此之外,我们讲述了流程控制中的内容。流程

JavaScript 基础篇运算符与表达式

用户头像
你好bk
2021-11-04

上一篇我们学习了 js 的第一篇基础——变量,在看变量之前,简单的了解了计算机的组成部分和浏览器 的组成部分,在js中了解了最基本的声明变量和使用变量,以及转换字符串和转换数字类型等,还有小细节的 例如 typeof 检测变量等需要重点掌握的,基础需要不停

初识 JavaScript 第一篇及解释器和编译器

用户头像
你好bk
2021-11-01

整个上一章节我们学习了布局的三篇,在布局中学习了流式布局和flex布局以及最后的rem布局,这些都是和布局相关的,因为移动端的流行,所以免不了需要前端中去兼容各种终端。故此方式还是挺多,各显神通。可以根据显示的业务场景或者自己团队比较擅长的布局方

https://static001.geekbang.org/infoq/83/83d6e12b784f44eb33218f3b83b33a1a.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

前端 flex 布局最全文档,工作学习中复习必备

用户头像
你好bk
2021-10-18

在上一篇中我们结束了流式布局,流式布局中主要是说了理论的知识比较多,最主要的还是移动端中的二倍图效果是非常重要。还有对于视口的效果,末尾之后我们又说了背景缩放的问题background-size,和特殊的样式例如兼容-webkit-等效果。基础还是需要好好学习。

为什么常用二倍图,流式布局中一倍图是否靠得住

用户头像
你好bk
2021-10-14

上一篇中我们结束了 css3 中的内容,回顾css3 我们深入的学习了css中的东西,在css的基础上c3又有了非常好的创新,这些都在日常的工作中特别的常用,所以需要好好温故而知新。h5c3的基础学完之后,就开始布局了,今天是布局的第一篇。先来看看流式布局。

https://static001.geekbang.org/infoq/ce/ce4e0dee7749bde9ebcd11cdeb66688f.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

css3 中的 3D 转换效果有哪些,浏览器私有前缀兼容写法

用户头像
你好bk
2021-10-11

这次基本上是 html5/css3 最后的一部分内容了,一共h5c3分为了三讲,今天是最后一讲内容。回顾上一篇我们基本上学习了 css3 中一大部分的内容,我们学习了基于transform的移动、旋转、缩放等常用的效果,还掌握了css3 2D转换的综合写法,不仅如此还学习了 an

https://static001.geekbang.org/infoq/e7/e786f47ea89ef84eb6ccb1d9cddf5102.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

一文说清楚 css3 具有颠覆意义的 2D 转换效果

用户头像
你好bk
2021-10-08

今天我们来说一说h5/c3的第二篇,回顾上一篇我们开始了h5/c3的第一篇,我们重新学了一下VsCode的基础应用以及里面的插件,插件也分为基础和进阶,不同学习阶段运用不同的插件会如虎添翼。在之后我们学习了html5中新增的语义化标签、还有新增的多媒体标签等。

https://static001.geekbang.org/infoq/26/265c0ff669b1c3af06205360cb8d501c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

详解 css 中清除浮动的四种方式,float 浮动怎么用更为合理

用户头像
你好bk
2021-09-11

在上一讲中我们基本上学习了 css 中经典的塌陷问题以及 margin 和 padding 具体指的是什么和怎么合理运用,除此之外,在上一讲的最后我们还了解了圆角边框和盒子阴影,更能熟悉的学习对于盒子更多非常规的时候怎么去贴合业务。掌握基础是非常重要的,所以需要

https://static001.geekbang.org/infoq/d1/d1062d2dcf2a292b4e613f41975973ff.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

html 创建表格有那些小技巧,表单中真的有这么多功能吗

用户头像
你好bk
2021-08-29

上一篇 html 我们聊了初识 html 的基本常识和所用的浏览器内核以及基础的标签等等,这次我们再聊一聊 html 的表格和表单等语法。这是html基础偏的最后一讲,下次就到了前端重要的样式部分了!注意:本系列文章适合新手小白入门学习。文章如有疏漏请指正。

https://static001.geekbang.org/infoq/71/71bbd6dc39a58f5e85553be3c592abce.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

初识 html,一文搞懂 HTMl 骨架标签都有哪些含义及浏览器内核

用户头像
你好bk
2021-08-26

初识html(大概两篇),下面会从浏览器以及web标准和相关标签来说明整个html结构和由来。注:本系列文章适合新手小白入门学习。文章如有疏漏请指正。

https://static001.geekbang.org/infoq/3d/3dc9eaab744b216cf3bcf2e9d89aff48.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

无需 JavaScript 可以实现的 9 个网页功能

用户头像
devpoint
2021-06-18

HTML是超文本标记语言,它能够轻松地为网页创建元素,可以使用标签、属性、添加脚本等等。同时 HTML 比想象的更有用,在有些场景下可以不需要 JavaScript。今天跟大家分享9个不需要 JavaScript 能够实现的小功能。

https://static001.geekbang.org/infoq/76/7688346f82df69f36a4b1c0b44cc36f0.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】css 控制鼠标点击事件(pointer-events)

用户头像
德育处主任
2021-02-03

pointer-events  是CSS3的一个属性,支持的值非常多,其中大部分都是和SVG有关。对于前端日常开发而言,只要了解 none 这个值就已经够我们玩一段时间了。

https://static001.geekbang.org/infoq/90/9027c139ebd9cb9fca68957cf54d6b0c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

localStorage 和 sessionStorage 本地存储

用户头像
我是哪吒
2021-01-30

大家好,我是魔王哪吒,很高兴认识你~~

https://static001.geekbang.org/infoq/33/3359540ae8bac1ebbf475b676ab0ab56.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】不规则阴影

用户头像
德育处主任
2021-01-28

利用css3的滤镜(filter)实现。纯css,不需要插图!

https://static001.geekbang.org/infoq/6b/6b7d143bf9227bcf8155fc5ae3b94552.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【纯 CSS】画 多国国旗

用户头像
德育处主任
2021-01-26

分享一个纯CSS实现多国国旗的网站:CSS Flags

https://static001.geekbang.org/infoq/9f/9fcbe382676769b6dafe94bd68e040ad.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

席卷图文学习前端 Flex 布局

用户头像
我是哪吒
2021-01-26

哪吒人生信条:如果你所学的东西 处于喜欢 才会有强大的动力支撑。

https://static001.geekbang.org/infoq/f5/f59294a07aaf2c398d35de2eeedce040.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【Skeleton】布局

用户头像
德育处主任
2021-01-26

一个只有400多行代码的CSS栅格系统。

https://static001.geekbang.org/infoq/d9/d9e5358c25be11c4d8ca5a3c19d0c021.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】角标(伪元素)

用户头像
德育处主任
2021-01-25

利用伪元素( ::before 和 ::after )制作,这样可以不影响主元素,也不用依赖其他html元素。

https://static001.geekbang.org/infoq/d2/d206929c935ea3a76990d20bdd93e5ee.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】文字毛玻璃效果(简单版)

用户头像
德育处主任
2021-01-25

用文本阴影和字体透明颜色就可以做出毛玻璃的效果。这是一个纯css的方式。

https://static001.geekbang.org/infoq/39/39bb4a1ed79e33b0b1536fb3b1b113a2.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】页面顶部阴影

用户头像
德育处主任
2021-01-24

纯css,利用伪元素实现。不需要使用图片。

https://static001.geekbang.org/infoq/99/9908fe08f6d7452a6977190ea8428479.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】红砖背景

用户头像
德育处主任
2021-01-23

主要是通过两个不同颜色的三角形,合成一个长方形。再通过做2层这种长方形,调整好相应的位置。

https://static001.geekbang.org/infoq/7c/7c14ae47ed4fb73c3e241c493aac87b6.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

【CSS】带边框的三角形(position)

用户头像
德育处主任
2021-01-21

思路是将2个三角形叠加起来,外层的三角形稍微大一些。

html/css_html/css技术文章_InfoQ写作社区