css专题
【阅读】《Head First HTML 与 CSS》 第二章——深入了解超文本
这一章同样也没有什么新的东西，我是扫着看的。。。写写bullet point加深一下印象吧 想从一个页面链接到另一个页面时，要使用<a>元素<a>元素的href属性指定了链接的目标文件<a>元素的内容是链接的标签。这个标签就是你在网页上看到的链接文本。默认的，这个标签会有下划线，只是这个是可以单击的。单击一个链接时，浏览器会加载href属性中指定的Web页面可以链接到相关文件夹中的文件，也可
【阅读】《Head First HTML 与 CSS》第一章——认识HTML
HTML：超文本标记语言（hypertext marker language） web就是由它来创建的 web服务器的作用：接收请求并查找请求资源，还要发回去 web浏览器的作用：接收那个资源并显示出来 注意：浏览器会忽略HTML文档中的制表符、回车和大部分空格 要记住：元素=开始标记+内容+结束标记所有结束标记都有一个"/" CSS的作用：告诉浏览器页面中的元素如何来显示 对了当我看
【阅读】《head first HTML与CSS》——前言
嘻嘻~刚刚看完《head first JSP & Servlet》现在有开始看HTML的了，好奇怪，感觉自己读反了。。。JSP应该是进阶才是的呢 如何才能更好的去学习这一本书呢？把这本书看作是一个大老虎好了，人们认为大老虎会对自己的生命产生威胁，所以就很深刻地记住了大老虎，同样把学习新知识当作是面对一个大老虎就更深刻的记下这个知识（如果你记不下你就会被老虎吃掉） 还有就是尽一切可能让大脑活动起
HTML+CSS练习小项目——百叶窗
前言：在学习完HTML和CSS之后，我们就可以开始做一些小项目了，本篇文章所讲的是新手可以练习的小项目——百叶窗 ✨✨✨这里是秋刀鱼不做梦的BLOG ✨✨✨想要了解更多内容可以访问我的主页秋刀鱼不做梦-CSDN博客 先让我们看一下效果：（总代码在文章的最后，读者可以先复制进行体验！） 那么我们如何去实现这样的小案例呢？先看一下我们要实现百叶窗的步骤：
css中的@media用法总结
1、head标签中引入 //语法： @media mediatype and | not | only (media feature) { css-code; } //也可以针对不同的媒体使用不同的stylesheets: <!--<link rel="stylesheet" media="mediatype and|not|only (media feature)" href="mysty
CSS预处理器Sass的奥秘与实战指南
CSS预处理器Sass的奥秘与实战指南 Sass基础：为何选择Sass？基本概念优势概览 Sass实战：从安装到应用安装与配置基础示例高级技巧 性能与安全性考量结语：持续探索与实践 在前端开发的世界里，CSS无疑是构建网页外观与风格的基石。然而，随着项目规模的增长，纯CSS编写变得日益复杂，难以维护。这时，CSS预处理器应运而生，其中最闪耀的明星当属Sass（Syntactica
css单元格固定宽度大小，超过部分使用省略号表示
/*white-space: nowrap 保证文本内容不会自动换行，如果多余的内容会在水平方向撑破单元格。overflow: hidden 隐藏超出单元格的部分。text-overflow: ellipsis 将被隐藏的那部分用省略号表示。*/.b {width: 100px;overflow: hidden;text-overflow: ellipsis;white-space: no
css设置滚动条的样式
/* 滚动条样式 *//* 定义滚动条整体的宽度和轨道的背景颜色 */::-webkit-scrollbar {width: 10px;/* 对于垂直滚动条的宽度 */height: 10px;/* 对于水平滚动条的高度，可选 */}/* 定义滚动条轨道的样式 */::-webkit-scrollbar-track {background-color: rgba(0, 0, 0, 0.1);/*
【前端】CSS基础（4）
文章目录 前言1、CSS常用属性1.1 文本属性1.1.1 文本对齐1.1.2 文本装饰1.1.3 文本缩进1.1.5 行高 前言 这篇博客仅仅是对CSS的基本结构进行了一些说明，关于CSS的更多讲解以及HTML、Javascript部分的讲解可以关注一下下面的专栏，会持续更新的。 链接： Web前端学习专栏 下面我对这个专栏的内容进行几点说明： 适合每一个前端0基础的小
css层叠样式表——基础css面试题
1、css样式来源有哪些？ 內联样式-<a style="color:red"></a>内部样式-<style></style>外部样式-写在独立.css文件中的浏览器用户自定义样式浏览器默认样式 2、样式优先级问题 不同级别下： !important作为style属性内联方式-1000id选择器-100类选择器、伪类选择器-10元素选择器-1通配符选择器-0浏览器自定义或继承 相同级别
js实现html节点、CSS样式、事件的动态添加以及html覆盖层的添加
（一）js实现html节点、CSS样式、事件的动态添加 ①场景描述：我们需要动态获取后台数据并将这些数据以列表方式展示，其中列表存在自己的列表样式，每个item都存在自己的点击事件.....那么在这种情况下我们是不是就需要用到动态添加节点的模式去处理呢？ ②代码记录如下： $.ajax({url : "***.action",type : 'post',dataType : 'js
样式表单MIME 类型 “text/plain“ 不是 “text/css“问题处理
样式表单www.*.com/static/js/*.css未载入，因为它的 MIME 类型 "text/plain" 不是 "text/css"。 原因是服务器返回的MIME类型为 "text/plain"，而预期应该是 "text/css"。MIME类型是一种标准，用于定义文件在互联网上传输时的类型和格式。当浏览器接收到一个资源时，它会检查该资源的MIME类型来确定如何处理这个资源。 在这个
【前端】CSS基础（3）
文章目录 前言1. CSS常用元素属性1.1 字体属性1.1.1 字体1.1.2 字体大小1.1.3 字体颜色1.1.4 字体粗细1.1.5 文字样式 前言 这篇博客仅仅是对CSS的基本结构进行了一些说明，关于CSS的更多讲解以及HTML、Javascript部分的讲解可以关注一下下面的专栏，会持续更新的。 链接： Web前端学习专栏 下面我对这个专栏的内容进行几点说明：
webpack5零基础入门-14提取css为单独文件
1.背景 Css文件目前被打包到JS文件中，当JS文件加载时，会尝试创建一个style标签来生成样式，这样对于网站来说，会出现闪屏的现象，用户体验不好。我们应该是单独的Css文件，通过link标签来加载性能才好。 2.下载包 npm install --save-dev mini-css-extract-plugin 3.在webpack.config.js中引入 4.去掉style
【积少成多】各种js或者jquery或者html或者css等微知识------持续更新！
一、attr("src"," ") 属性在ios端图片切换异常问题。 当我们让一个图片显示/隐藏的时候，如果用到这种方法： $(".aaa").attr("src","../images/logo.png");-----显示 $(".aaa").attr("src"," ");-----隐藏 在ios端可能会出现图片隐藏的时候并没有隐藏掉。 解决方法： 隐藏时用此种写法: $(".a
【备用】标准CSS引用自定义字体格式
如题，本文为备用篇章。 自定义CSS引用字体样式如下： @font-face {font-family: 'myfont';src: url('myfont-webfont.eot');src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'),url('myfont-webfont.woff') format('wo
前端已死? Bootstrap--CSS组件
目录 Bootstrap 下载 Bootstrap--全局CSS样式 栅格系统 栅格参数 正常显示 实例 代码演示: 排版 代码演示 表格 代码演示 表单 代码演示 等等...(文档很清晰了) Bootstrap--组件 结合演示:(页面) Bootstrap Bootstrap v3 中文文档 · Bootstrap 是最受欢迎的 HTM
学习uni-app期间css样式的导入、单位属性和ui工具关系
css单位属性 css中单位有： px ：屏幕像素 vw：屏幕宽度 vh ：屏幕高度 rpx ：响应式 px，一种根据屏幕宽度自适应的动态单位。以 750 宽的屏幕为基准，750rpx 恰好为屏幕宽度。屏幕变宽，rpx 实际显示效果会等比放大，但在 App（vue2 不含 nvue） 端和 H5（vue2） 端屏幕宽度达到 960px 时，默认将按照 375px 的屏幕宽度进行计算，具体配置参考
html特殊字符的html，js，css写法汇总
⇠ 箭头类 符号UNICODE符号UNICODEHTMLJSCSSHTMLJSCSS⇠⇠\u21E0\21E0⇢⇢\u21E2\21E2⇡⇡\u21E1\21E1⇣⇣\u21E3\21E3↞↞\u219E\219E↠↠\u21A0\21A0↟↟\u219F\219F↡↡\u21A1\21A1←←\u219
常用的CSS Hack技术集锦
常用的CSS Hack技术集锦 CSS dwqs 2014-10-05 12:06 1,982 人阅读 0评论 （网络整理） 一、什么是CSS Hack？ 不同的浏览器对CSS的解析结果是不同的，因此会导致相同的CSS输出的页面效果不同，这就需要CSS Hack来解决浏览器局部的兼容性问题。而这个针对不同的浏览器写不同的CSS 代码的过程，就叫CSS Hack。
【前端】CSS基础（2）
文章目录 前言1、CSS选择器1.1选择器的功能1.2 选择器的种类1.2.1 基础选择器1.2.1.1 标签选择器1.2.1.2 类选择器1.2.1.3 id选择器1.2.1.4 通配符选择器1.2.1.5 伪类选择器 1.2.2 复合选择器1.2.2.1 后代选择器1.2.2.2 子选择器1.2.2.3 并集选择器 前言 这篇博客仅仅是对CSS的基本结构进行了一些说明
css超出部分省略（单行、多行，多种方法实现）
HTML <p class="text">这是一行测试数据,这是一行测试数据,这是二行测试数据,这是一行测试数据,这是三行测试数据,这是四行测试数据</p> 1.单行 .text{width: 200px;border: 1px solid #000000;white-space: nowrap; /* 控制元素不换行 */overflow: hidden; /* p标签超出
TailwindCSS在vite项目中的安装与使用
一、Tailwind CSS工作原理 Tailwind CSS 的工作原理是扫描所有 HTML 文件、JavaScript 组件和任何其他类名称模板，生成相应的样式，然后将它们写入静态 CSS 文件。它快速、灵活且可靠 — 具有零运行时间。 二、安装必要依赖 Vite创建的项目默认集成了PostCSS，而TailwindCSS本身就是一个PostCSS插件，所以直接使