随笔分类 -  HTML/CSS

1 2 3 4 下一页
React 使用锚点
摘要：1、scrollIntoView scrollIntoView 方法可以让当前的元素滚动到浏览器窗口的可视区域内。它的使用方法如下： var element = document.getElementById("box"); element.scrollIntoView(); 这个 api 兼容 I 阅读全文
posted @ 2022-10-12 10:48 huihui2014 阅读(769) 评论(0) 推荐(0)
CSS3 mix-blend-mode的使用
摘要：CSS3 新增了一个很有意思的属性 -- mix-blend-mode ，其中 mix 和 blend 的中文意译均为混合，那么这个属性的作用直译过来就是混合混合模式，当然，我们我们通常称之为混合模式。 --> mix-blend-mode 用于多个不同标签间的混合模式 mix-blend-mode 阅读全文
posted @ 2021-03-15 18:16 huihui2014 阅读(290) 评论(0) 推荐(0)
css 修改placeholder的样式
摘要：修改placeholder的颜色 阅读全文
posted @ 2018-01-20 14:34 huihui2014 阅读(375) 评论(0) 推荐(0)
CSS样式中常用的字体名称
摘要：css中引入字体： 常用的CSS字体名称 宋体 SimSun 黑体 SimHei 微软雅黑 Microsoft YaHei 微软正黑体 Microsoft JhengHei 新宋体 NSimSun 新细明体 PMingLiU 细明体 MingLiU 标楷体 DFKai-SB 仿宋 FangSong 阅读全文
posted @ 2017-09-04 14:53 huihui2014 阅读(1679) 评论(0) 推荐(0)
使pre的内容自动换行
摘要：<pre> 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。 <pre> 标签的一个常见应用就是用来表示计算机的源代码。 而我们经常碰到的一个问题是如果一个代码上碰到有图片或者网页地址就会使代码很长，结果会造成页面撑开或者代码超出边界。非常难 阅读全文
posted @ 2017-05-26 19:51 huihui2014 阅读(704) 评论(2) 推荐(0)
:after伪类+content内容生成经典应用举例
摘要：一、简单说说content内容生成 content内容生成就是通过content属性生成内容，content属性早在CSS2.1的时候就被引入了，可以使用:before以及:after伪元素生成内容。此特性目前已被大部分的浏览器支持： (Firefox 1.5+, Safari 3.5+, IE 8 阅读全文
posted @ 2017-04-08 19:34 huihui2014 阅读(305) 评论(0) 推荐(0)
HTML5上传文件显示进度
摘要：下面我们使用Html 5的新特性file api实现上传文件，并显示上传文件进度百分比。意图是这样的，当选择文件时，显示当前文件信息。这里我们是结合Asp.net MVC做为服务端，您也可以是其它的服务端语言。让我们看面这个片断的HTML： 相关的Javascript是这样的： 上面是就原生的Jav 阅读全文
posted @ 2017-03-16 20:57 huihui2014 阅读(420) 评论(0) 推荐(0)
HTML中select的option设置selected="selected"无效的解决方案
摘要：今天遇到了一个奇葩问题，写HTML时有个select控件，通过设置option的selected="selected"居然无效，但是在其他浏览器是可以的，问了一下Google大神，说要在select标签加上autocomplete="off"，如： <select autocomplete="off 阅读全文
posted @ 2017-03-15 17:10 huihui2014 阅读(3725) 评论(0) 推荐(0)
HTML中&nbsp; &ensp; &emsp; &thinsp;等6种空白空格的区别
摘要：HTML提供了5种空格实体（space entity），它们拥有不同的宽度，非断行空格（）是常规空格的宽度，可运行于所有主流浏览器。其他几种空格 （&ensp; &emsp; &thinsp; &zwnj;&zwj;）在不同浏览器中宽度各异。 它叫不换行空格，全称No-Break Space，它... 阅读全文
posted @ 2016-01-06 15:05 huihui2014 阅读(2059) 评论(0) 推荐(0)
Chrome firefox ie等浏览器空格&nbsp;宽度不一样怎么办
摘要：有点强迫症，之前某个页面用了空格，但是在chrome firefox 和ie显示的宽度都不一样，无法对齐。搜索了一下，很多人都转载了那篇设置成宋体的，可是仍然没对齐，要么ie对齐，要么chrome没对齐，于是好好研究了一下空格。文章在这里：HTML中 &ensp; &emsp; &thinsp;等6... 阅读全文
posted @ 2016-01-06 14:58 huihui2014 阅读(717) 评论(0) 推荐(0)
手机网页Html代码实现（解决显示页面很小的问题）
摘要：工作需要，要做一个手机自适应的网页效果，终于搞定，先分享并记录！其实主要就是改掉HTML页面声明：在网页中加入以下代码，就可以正常显示了：解释：width - viewport的宽度height - viewport的高度initial-scale - 初始的缩放比例minimum-scale - ... 阅读全文
posted @ 2015-12-01 17:04 huihui2014 阅读(485) 评论(0) 推荐(0)
iOS下的按钮css去除原生样式
摘要：IOS环境下的按钮都是经过美化的，但通常我们在设计web app的时候不需要这些看上去老土的样式，所以，去除这些显得很有必要。 下面这句代码就是重置这些样式的： 嗯，就这些，虽简单，但很实用！ 阅读全文
posted @ 2015-11-26 12:53 huihui2014 阅读(611) 评论(0) 推荐(0)
用纯css改变下拉列表select框的默认样式（不兼容IE10以下）
摘要：在这篇文章里，我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式。事情是这样的，您的设计师团队向您发送一个新的PSD（Photoshop文档），它是一个新的网站的最终设计。一切看起来很好，很正常，直到你看到他/她设计的一个选择下 阅读全文
posted @ 2015-11-25 20:20 huihui2014 阅读(3396) 评论(0) 推荐(0)
em（倍）与px的区别
摘要：在国内网站中，包括三大门户，以及“引领”中国网站设计潮流的蓝色理想，ChinaUI等都是使用了px作为字体单位。只有百度好歹做了个可调的表率。而 在大洋彼岸，几乎所有的主流站点都使用em作为字体单位，也就是可调的。没错，px比em更加容易使用，大部分读者不知道em为何物或者它相当于多少 px。国外人... 阅读全文
posted @ 2015-10-23 19:18 huihui2014 阅读(172) 评论(0) 推荐(0)
遭遇input与button按钮背景图失效不显示的解决办法
摘要：笔者从事网页前端代码页面工程师已有多年，作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS（正确的说法是XHTML+CSS）在 IE、FireFox火狐、 谷歌浏览器CHROME、苹果浏览器Safari、Opera下不兼容的问题，其中IE6最为棘手，历来IE6就被诸位前端代码人员所诅咒，无奈... 阅读全文
posted @ 2015-06-24 16:21 huihui2014 阅读(1249) 评论(0) 推荐(0)
margin-top无效的问题解决方法
摘要：今天碰到了margin-top无效的问题，解决方法也有很多一行代码就解决了解决办法：1.父容器加入display:inline-block;2.给父容器box加overflow:hidden;属性3父容器box加border除none以外的属性4.用父容器box的padding-top代替margi 阅读全文
posted @ 2015-04-24 15:21 huihui2014 阅读(418) 评论(0) 推荐(0)
CSS让图片垂直居中的几种技巧
摘要：在网页设计过程中，有时候会希望图片垂直居中的情况。而且，需要垂直居中的图片的高度也不确定，这就会给页面的布局带来一定的挑战。下面总结了一下，曾经使用过的几种方法来使图片垂直居中，除了第一种方法只限于标准浏览器外，另外两种方法的兼容性还不错。方法一将外部容器的显示模式设置成display:table，... 阅读全文
posted @ 2015-04-07 11:40 huihui2014 阅读(497) 评论(0) 推荐(1)
HTML5的postMessage使用记要
摘要：HTML5提出了一个新的用来跨域传值的方法，即postMessage(这个名字太通俗了所以你最好看看是不是自己写过一个同名的把它覆盖了)。幸运的是IE8就开始支持了。我们假设有两个网站，1.com与2.com，我在1.com的页面上通过iframe或window.open或超链接打开了一个2.com... 阅读全文
posted @ 2015-03-17 11:51 huihui2014 阅读(3129) 评论(0) 推荐(0)
js动态创建style节点(js文件中添加css)
摘要：ie6 不能 document.createElement('style') 然后append到head标签里。所以就找到这样个好文章---------------------有很多提供动态创建 style 节点的方法，但是大多数都仅限于外部的 css 文件。如何能使用程序生成的字符串动态创建 st... 阅读全文
posted @ 2015-03-10 12:50 huihui2014 阅读(6506) 评论(0) 推荐(0)
在CSS中定义a:link、a:visited、a:hover、a:active顺序
摘要：摘自：http://blog.snsgou.com/post-2.html以前用CSS一直没有遇到过这个问题，在最近给一个本科同学做的项目里面。出现一些问题，搜索引擎查了一些网站和资料，发现很多人问到这个问题，给出的结果我试了试，大部分都不正确。给出我试的顺序，可能会对大家有一些帮助：A:link{... 阅读全文
posted @ 2015-03-09 14:07 huihui2014 阅读(254) 评论(0) 推荐(0)

1 2 3 4 下一页