随笔分类 - Web前端CSS+HTML
网站开发过程中遇到的Web前端CSS+HTML问题及解决方法
发表于 2023-11-10 15:33阅读:1947评论:0推荐:2
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 对于初学CSS的同学来说,会有很多属性相关的疑问,行高属性 line-height一定是其中一个,因为它是CSS中非常重要的一个属性,这个属性改变元素在网页中的行高,让你的网页看起来更加整洁,美观。 什么是行高? CSS中的行高(line-he
阅读全文 »
发表于 2023-11-04 22:08阅读:1396评论:1推荐:4
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 CSDN原创文章 博客地址 👉 WangMin 我们在开发的过程中,难免会出现一些难以预料的问题。那么其中,CSS空白现象就是非常常见的问题之一。虽然它已经被发现很久,但仍然有许多新手和经验丰富的开发者们忽略了它对页面布局的影响。我们一起来看
阅读全文 »
发表于 2023-10-24 03:18阅读:281评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 作为前端开发来说,要掌握的CSS基础一定很多,那么CSS中盒子模型肯定是必考必问必掌握的前端知识点,因为它是CSS基础中非常重要的内容,接下来我们就一起来了解一下盒子模型吧! 什么是盒子模型? CSS 所有的HTML 标签元素在网页中都生成了一
阅读全文 »
发表于 2021-09-14 01:32阅读:531评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在项目中为了网页的美观,通常会给网页或者某个元素设置背景,这时就会用到 CSS中background属性 来实现这个效果,这个属性是一个很基本的而且比较常用的样式 ,那么应该怎样来运用这个属性呢?一起来看看吧!!! background的属性的
阅读全文 »
发表于 2021-09-01 22:57阅读:370评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 众所周知 margin属性 是用来声明当前所设置或者指定元素所有外边距的宽度,或者设置各边上外边距的宽度。一直以来我认为它是一个很简单的属性,但是在最近的所做的项目中我遇到了一些关于 margin属性 所涉及到的问题,下面就给大家分享一下吧!!
阅读全文 »
发表于 2021-04-22 01:07阅读:374评论:1推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 随着前端技术的发展,单一的背景色已经满足不了客户的需求了,所以在前端开发中我们常常会用到一些渐变色的效果,这样可以使前端页面更加美观。那么渐变色的效果到底是怎么来的?我们应该怎么做才能实现这一效果呢?接下来就一起来看看吧! 实现原理 css要实
阅读全文 »
发表于 2021-04-20 17:24阅读:998评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 关于box-shadow属性,有的小伙伴可能用的时候直接复制已有的,并没有仔细了解过box-shadow属性的参数分别是什么含义,最后导致阴影的样式不能按照自己的需求自由控制,让自己很苦恼。接下就一起来好好学习这个属性吧!! box-shado
阅读全文 »
发表于 2021-04-19 10:20阅读:256评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 你是否还在用图片制作三角形和剪头吗?那就太out了。css可以轻松绘制出你想要的三角形与箭头,而且颜色大小可以随意改变,还不用担心失真等问题。那就一起来看看吧!! 实现原理 首先来看看当我们给元素添加border时,border的样子。假设代码
阅读全文 »
发表于 2020-10-12 11:01阅读:1493评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在项目中,大部分前端程序员都没有按照良好的CSS书写规范来写CSS代码,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响。后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的
阅读全文 »
发表于 2020-10-02 23:54阅读:1554评论:0推荐:1
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在讲CSS 选择器权重计算与优先级之前,我们先来了解一下CSS是用来干什么的?CSS是用来通过添加样式使网页更加美观,也就是说CSS是利用选择器来美化网页的,使用户可以在网页上更清晰地找到自己需要的东西。 CSS添加样式的方式: 有内部样式(内
阅读全文 »
发表于 2020-09-30 19:13阅读:6690评论:1推荐:1
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 我们在项目开发的过程中也许都遇到过这样的问题:我们需要实现这样一个需求,在一个父级元素中隐藏一个可能过长的文本。而这个需求可以分解为两个,一个是单行溢出省略,一个是多行溢出省略。下面我们就开始一起学习吧! 实现文本超出显示省略号的常见属性 1)
阅读全文 »
发表于 2020-09-29 01:52阅读:2190评论:0推荐:2
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在CSS中,如果给一个盒子设置了固定的宽度与高度,但内容过多就会溢出盒子本身的宽度或高度。此时,就可以使用 overflow 属性来控制内容溢出时的处理方式。那么接下来就开始来学习这个属性吧! overflow 属性值如下: |属性值|含义 |
阅读全文 »
发表于 2020-09-27 23:21阅读:837评论:0推荐:1
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 网页上的每个元素都是一个矩形框。CSS中的display属性决定了矩形框的行为。display属性是我们在前端开发中常常使用的一个属性。 display的属性值如下: |属性值|含义 | |--|--| | block | 块对象的默认值。用该
阅读全文 »
发表于 2020-09-24 04:56阅读:1908评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 对于颜色相信大家都很敏感,眼睛所见之处都存在颜色,那在css中我们用什么来表示颜色呢?CSS 中的颜色有三种定义方式:使用颜色方法(RGB、RGBA、HSL、HSLA),十六进制颜色值和预定义的颜色名称。我们常使用的是RGB与RGBA。那我们就
阅读全文 »
发表于 2020-09-20 23:35阅读:1767评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者的区别与优势是什么?接下来我们就来学习一下吧! 单位px、em、rem分别表示什么? 1、 px(Pixel) 相对于显示器分辨率而言,表示“绝对尺寸”(并非真正的绝对),
阅读全文 »
发表于 2020-09-19 21:13阅读:1025评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 对于所有定位,最后都不免遇到两个元素试图放在同一位置上的情况。显然,其中一个必须遮住另一个。但是如何控制哪个元素放在上层,这就出现了z-index这个属性。 z-index属性的含义 一个元素在文档中的层叠顺序,用于确认元素在当前层叠上下文中的
阅读全文 »
发表于 2020-09-18 22:29阅读:232评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在开发过程中,很多网页需求要求我们居中一个div,比如html文档流当中的一块div,比如弹出层内容部分这种脱离了文档流等。不同的情况有不同的居中方式,接下来就分享下一下几种常用的居中方式。 1、margin:0 auto 水平居中 也就是将m
阅读全文 »
发表于 2020-09-18 04:02阅读:1964评论:0推荐:1
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 在讲几种定位方式之前,我们先来了解一下什么是普通文档流(normal flow)? 前面讲过浮动会让元素脱离文档流,如果不设置浮动所有元素都处于普通文档流中。普通文档流中元素框的位置由元素在(X)HTML中的位置决定。块级元素从上到下依次排列,
阅读全文 »
发表于 2020-09-17 00:22阅读:251评论:0推荐:0
摘要:作者:WangMin 格言:努力做好自己喜欢的每一件事 什么是浮动 float? 标准流:元素会各占整行位置。子元素如果是标准流,父元素即使没有设置高度,也会撑开父盒子高度,也就是说父元素的高度会随着子元素的高度改变。 浮动:子元素浮了起来,脱离了文档流,所以不会占据原来的位置,若父元素没有设置高度
阅读全文 »