
html+css+js
文章平均质量分 72
前端
百变珍珑兽
我在,对抗熵增
展开
-
html5新增、CSS3新增(黑马程序员pink老师前端)
语义化标签、新增input类型、新增表单属性、属性选择器、结构伪类选择器、伪元素选择器、CSS3盒子模型、滤镜filter、calc函数、过渡。原创 2023-09-07 21:38:32 · 176 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)CSS初始化
默认为基线对齐,底部与边框之间会有空隙。是为了照顾低版本浏览器,图片外包含了链接图片会有边框的问题 *//* 鼠标经过button按钮时,鼠标变成小手 *//* 清除默认的padding和margin *//* 设置链接颜色,取消链接的下滑线 *//* em和i中的文字不再倾斜 *//* 鼠标经过链接,链接变红 *//* 去除列表前的圆点样式 *//* 伪元素法清除浮动 */京东首页CSS初始化。/* 设置字体 */原创 2023-09-07 14:37:04 · 634 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)鼠标样式,表单轮廓,溢出文字省略号显示
有兼容性问题,适用webkit浏览器或移动端。推荐后端做这个功能。强制单行显示文本,超出部分隐藏,文字用省略号代替超出的部分。/* 限制在一个块元素中显示的文本行数 *//* 设置伸缩盒对象的子元素排列方式 *//* 文字溢出时,用省略号显示 *//* 文字溢出时,用省略号显示 *//* 显示不开,不自动换行 *//* 弹性伸缩盒子显示 *//* 溢出部分隐藏 *//* 溢出部分隐藏 */原创 2023-09-07 13:32:27 · 178 阅读 · 0 评论 -
(html+CSS)垂直居中
用于设置一个元素的垂直对齐方式,但是它只针对于行内元素或者行内块元素有效。行高等于父元素的高度。原创 2023-09-07 13:03:10 · 144 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)显示与隐藏,精灵图,CSS三角
为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度。盒子每一边的边框都是梯形的,盒子大小为0时,梯形上底(边框内边)也为0,所以两边会合并成三角形。隐藏,隐藏后继续占有原来的位置。隐藏对象,隐藏后不再占有原来的位置。默认状态,显示溢出的内容。转换为块级别元素,显示元素。2.如果遇到一些结构和样式复杂一点的小图片,就用精灵图。1.如果遇到一些结构和样式比较简单的小图标,就用。原创 2023-09-07 11:20:48 · 123 阅读 · 0 评论 -
字体图标 IcoMoon
在icomoon官网中,点击import icons,上传之前文件夹中的selection.json文件,此时会将原有的字体图标全部选中。此时继续选择新的图标,然后重新下载压缩包,并替换原有文件,即可实现对字体图标的追加。打开demo.html,样式如图所示,其中方框即为图标的特殊符号,使用时直接复制。选择好自己需要的图标后,点击Generate Font,然后点击download。打开style.css,复制此段代码到css样式中,声明字体。/* 字体可以设置大小与颜色 */展示的是图标,本质是字体。原创 2023-09-07 10:58:30 · 155 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)定位
绝对定位、固定定位的盒子会压住下方的所有内容。/* p标签在其原有位置正好被father块完全覆盖,设置20px的上margin,使得文字显示了2/3 */2.如果祖先元素有定位(相对、绝对、固定定位),则以最近一级的有定位祖先元素为参考点移动位置。定位可以让盒子自由的在某个盒子内移动位置或者固定在屏幕中某个位置,并且可以压住其他盒子。1.以浏览器的可视窗口为位置参照,占有原先位置,是绝对定位和相对定位的混合。/* 子绝,不占有原有位置,下方文字向上对齐,子级盒子覆盖部分文字 */原创 2023-09-05 23:05:10 · 524 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)浮动,清除浮动
浮动可以改变标签的默认排列方式。浮动元素常与标准流的父元素搭配使用.:多个块级元素纵向排列找标准流,多个块级元素横向排列找浮动。float属性用于创建浮动框,将其移动到一边,直到左边缘或右边缘触及包含块或另一个浮动框的边缘。原创 2023-09-05 13:56:50 · 516 阅读 · 0 评论 -
表格(html+CSS)
* 3.td,table均设置border,且cellspacing="0" */3.td,table均设置border,且cellspacing=“0”/* 4.合并相邻的边框,使重叠的地方变细,且补充上表头单元格 *//* 1.只有table有边框 *//* 2.只有td单元格有边框 */4.合并相邻的边框,使重叠的地方变细。1.只有table有边框。2.只有td单元格有边框。原创 2023-09-04 16:32:48 · 441 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)盒子阴影,文字阴影
示例:text-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);示例:box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);属性值为box-shadow,盒子阴影不占空间,不影响盒子之间的距离.属性值为text-shadow。原创 2023-09-05 11:27:39 · 445 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)圆角边框
* border-radius的值也可为百分比,当切角圆的。/* 圆角边框,用半径为10px的圆,切原有的矩形 */半径为正方形的一半时,显示为圆形 *//*单独设一个角,top与left的顺序不能变 *//*只有两个值,为对角线关系 *//*圆的半径为高度的一半 *//*依次设置不同的角 */原创 2023-09-05 10:59:03 · 418 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)css三大特性,盒子模型
问题,如 ul li {}为(0,0,0,1)+(0,0,0,1)=(0,0,0,2);而 .nav li {}为(0,0,1,0)+(0,0,0,1)=(0,0,1,1). 但是权重虽然会叠加,但不会有进位.会塌陷较大的外边距,此时父元素的为20px,子元素的为40px,此时div2与div3之。/* 行内元素,行内块元素水平居中,修改margin无效,应设置父元素的text-align *//* 相邻块元素,垂直外边距合并. 上方的下外边距为100px,下方的上外边距为。原创 2023-09-05 10:18:15 · 87 阅读 · 0 评论 -
CSS笔记(黑马程序员pink老师前端)选择器,字体,文本属性,Emmet语法,元素显示模式,CSS背景
(1)生成标签:直接输入标签名按tab键即可. 如输入div然后按tab键,可以生成< div> < /div>(6)如果生成的类名是有顺序的,可以用自增符号$. 如div#demo $*5.(去掉demo后的空格)基础选择器的组合.包括后代选择器,子元素选择器,并集选择器,伪类选择器(链接伪类,focus伪类).精确位置,两个轴顺序不可变,上述为距左侧20px.距上方50px,若只有一个坐标,必定是x轴坐标./*将行内元素a,转换为可以设置宽高的块级元素,增加点击的范围,此时一行只能有一个 */原创 2023-09-04 13:18:14 · 729 阅读 · 0 评论 -
html5笔记(黑马程序员pink老师前端)
第2集原创 2023-08-31 16:26:44 · 170 阅读 · 0 评论 -
VSCode常用快捷键
control + alt + 下箭头(上箭头)shift + alt + 下箭头(上箭头)shift + alt + 拖动鼠标。control + 加号/减号。7.放大/缩小整个编辑器界面。2.选中多个相同的单词。5.快速定位到某一行。原创 2023-08-18 14:34:43 · 433 阅读 · 0 评论