day 48-css-part1
CSS（Cascading Style Sheet，层叠样式表css是前端的优化器,如果说我们的html是把前端的大体骨架搭起来的话,那么我们的css就是在这个骨架的基础上进行修饰,使之更有立体感,更光鲜亮丽,就类似于一个人在解决了基本衣食住行之后,会去追求更有品质的生活是一样的概念.其实我们的学习...
CSS中的各种格式化上下文-FC（BFC）、IFC、GFC、FFC）
什么是FC？FC是Formatting Context的缩写，中文名：格式化上下文。是 W3C在CSS2.1 规范中的一个概念。FC是指页面中一篇渲染区域，渲染区域内使用的格式化上下文的渲染规则，决定了该区域以及其子元素如何定位。当然，使用同的渲染规则，也会对其他元素的起到相互关系的作用。主要有哪些...
CSS父元素高度随子元素高度变化而变化
<html><body><head> <style> #menu{width:1000px;overfloat:hidden;} /* width:1000px;overfloat:hidden; 父元素高度随子元素变化而变化 */...
CSS系列学习笔记(一)
前端三大件html、css 、javascriptid选择器：唯一的标签,权重最高的<div id='abc'></div> 只能有一个div id叫abc类选择器：class 用的比较广范 比较多标签选择器：div{} <div></div> 都会...
学点css基础
中午时间学点css，附带http://www.w3cschool.cc/css/css-tutorial.html这个链接！中午的时间学了这些东西！如下图:附带代码： <!DOCTYPE html> <html lang="en"> <head> <...
css3 2D动画的基本用法和介绍
<style> body{height:400px;border:1px solid #000;} .box{width:90px;height:30px;border:1px solid;border-radius:8px;background:linear-gradi...
jquery css hover
<script type="text/javascript"> $(function () { $("#<%=btnSubmit.ClientID%>").css("background", "#ff0000"); ...
【技能】使用纯CSS+html写出方向箭头，简单慷慨，好看
使用纯CSS+html写出方向箭头，贴出来就能够用，100%原创<html> <head> <title></title> <...
纯CSS实现各类气球泡泡对话框效果
原文 纯CSS实现各类气球泡泡对话框效果一、关于纯CSS实现气泡对话框首先，来张大图：上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有哦。看到这里，你是不是跟我一样，有些惊叹CSS的潜力呢。关于这张图片，暂时先放到一边，下面我要...
纯CSS实现tooltip提示框，CSS箭头及形状之续篇--给整个tooltip提示框加个边框
在前面一篇中我们介绍了纯CSS实现tooltip提示框，通俗的讲也就是CSS箭头及形状不过注意一点是，他始终是一个元素，只是通过CSS实现的，今天我们要说的是给这个“tooltip提示框”整体加一个边框，下面是是一篇完成的截图（不了解的可以看看：纯CSS实现tooltip提示框，CSS箭头及形状）：...
如何用纯 CSS 创作气泡填色的按钮特效
效果预览在线演示按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。https://codepen.io/comehope/pen/eKqZjy可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。https:/...
前端每日实战：72# 视频演示如何用纯 CSS 创作气泡填色的按钮特效
效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。https://codepen.io/comehope/pen/eKqZjy可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。https://scr...
css3之动画
animation属性属性描述@keyframes 动画名动画关键帧animation动画的6个属性animation-name动画的名称animation-duration动画的周期时间animation-timing-function动画的速度曲线animation-delay动画的开始时间an...
简单CSS 布局
CSS LayoutCSS Layout 是对上下左右布局的一个简单封装，主要针对自己项目里面方便使用。坚持组合大于继承的原则，复杂的布局也是由简单布局组成的，当你用习惯了，完全在布局上面不用再去写CSS 啦~所以不习惯margin/padding-top/right/bottom/left-*的同...
用CSS3动画，让页面动起来
以前就听说过有个库，叫animate.css，但是自己并没有在实际项目中使用过，这次正好要做个招聘页面，得以利用一下这个库，在经常会卡顿的UC浏览器中也能流畅执行。扫描下面的二维码，可以看到在线的demo页面：如果对CSS3动画的一些基础概念不是很熟悉，可以参考《CSS3中的动画效果记录》。一、an...
css全局样式
@charset"utf-8";*{margin:0;padding:0;} //去默认内外边距的简易写法body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea...
零基础学前端之CSS边框
我们学习如何应用CSS给元素添加边框。CSS边框属性，允许我们指定一个元素边框的样式、宽度和颜色。我们先来学习元素边框的样式。border-style 属性指定了要显示什么样的边框。允许使用以下的值：dotted，定义一个点状的边框dashed ，定义一个虚线边框solid，定义一个实线边框doub...
CSS中link与import的区别
一、import的用法1，在html文件中<style type="text/css">@import url(http://www.dreamdu.com/style.css);</style>2，在css文件中@import url("CSS文件");对@import u...
千姿百态,瞬息万变,Win11系统NeoVim打造全能/全栈编辑器(前端/Css/Js/Vue/Golang/Ruby/ChatGpt)
我曾经多次向人推荐Vim，其热情程度有些类似现在卖保险的，有的时候，人们会因为一些弥足珍贵的美好暗暗渴望一个巨大的负面，比如因为想重温手动挡的快乐而渴望买下一辆二十万公里的老爷车，比如因为所谓完美的音质而舍不得一个老旧的有线耳机，比如因为一个铜炉火锅而期待北京那漫长而寒冷的冬天。也许有的人会因为Vi...
Web前端面试指导(十六)：为什么要初始化CSS样式？
题目点评这个题目乍一看感觉怪怪的，什么叫初始化样式了？如果换一句话你可能就理解了，就是通用样式。这道题目主要涉及的是理论方面的知识，不用写代码，只要描述清楚就可以了初始化样式的原因因为浏览器的兼容的问题，不同浏览器有些标签的默认值是不同的，如果没有CSS初始化往往会出现浏览器之间的页面显示差异。&l...