Html&Css&Sass&Less
mqy1023
https://github.com/mqy1023
展开
-
app端 h5 页面兼容性问题和解决方案
原文链接 (https://www.toutiao.com/i6751364844672254478/)最近给公司微信公众号,写了微信h5业务页面,总结分享一下前端开发过程中的几个兼容性坑,项目直接拿的公司页面,所以下文涉及图片都模糊处理了。一、ios端兼容input光标高度问题详情描述:input输入框光标,在安卓手机上显示没有问题,但是在苹果手机上当点击输入的时候,光标的高度和父盒子的...原创 2019-10-25 13:44:39 · 7184 阅读 · 0 评论 -
CSS高级布局样式技巧
CSS高级布局样式技巧一、empty空元素的样式1、:empty { } 伪类选择符empty2、:not(:empty) { } 伪类选择符not空元素样式显示二、xx_-of-type伪类选择符1、first-of-type 匹配同类型中的第一个同级兄弟元素.2、last-of-type 匹配同类型中的最后一个同级兄弟元素.3、nth-of-type(n) 匹配同类型中的第n个同级兄翻译 2016-12-22 00:12:55 · 1736 阅读 · 0 评论 -
less的学习与实践
《一》、Koala工具 1、下载地址:http://koala-app.com/index-zh.html 2、设置输出输出路径 《二》、语法详解 一、变量 1、使用@声明和使用变量 编译后 2、变量嵌套@fnord: "I am fnord.";@var: 'fnord';content: @@var;//解析后,content: "I原创 2016-05-19 19:21:14 · 1862 阅读 · 0 评论 -
SASS用法整理
之前用过less,木想到sass更power,下面是整理的基本用法: 一、变量 在SCSS文件中,可以声明整个样式表文件中使用的变量,方便统一修改和维护,变量以$开头。 CSS:/* line 53, ../sass/style.scss */#navbar { border-bottom-color: #ccc; border-bottom-style: solid;}/* li原创 2016-07-29 12:41:30 · 646 阅读 · 0 评论 -
HTML+CSS基础篇(五)——十天精通CSS
CSS3是什么 不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分,是浏览器的私有属性,虽然目前较新版本的浏览器都是不需要前缀的,但为了更好的向前兼容前缀还是少不了的。 (一)、边框 一、圆角效果 border-radius 1、border-radius:10px; /* 所有角都使用半径为10px的圆角 */ 2、border-radius原创 2016-03-30 21:03:19 · 1623 阅读 · 0 评论 -
【转】能使用html/css解决的问题就不要使用JS
原文地址为什么说能使用html/css解决的问题就不要使用JS呢?两个字,因为简单。简单就意味着更快的开发速度,更小的维护成本,同时往往具有更好的体验,下面介绍几个实例。1. 导航高亮导航高亮是一种很常见的问题,包括当前页面的导航在菜单里面高亮和hover时高亮。你可以用js控制,但是用一点CSS技巧就可以达到这个目的,不需要使用JS。在正常态时,每个导航的默认转载 2016-10-26 13:43:16 · 1299 阅读 · 0 评论 -
HTML+CSS基础篇——小技巧集合
1、清除两个input之间空隙 a、设置两个input的父div的font-size=0 b、两个input都 float:left 浮动起来,然后设置父div宽度width,最后设置父div的 margin: 0 auto; 就可以让两者水平居中了2、无序列表水平展示 a、ul { list-style: none; /*消除默认样式*/ } b、li { fl原创 2016-03-30 20:22:49 · 857 阅读 · 0 评论 -
JavaScript基础篇(三)— — DOM事件揭秘
(1)、理解事件流 a、事件是文档/IE 窗口中发生的特定交互瞬间 (2)、使用事件处理程序 (3)、不同的事件类型 一、事件流 事件流描述的是从页面中接受事件的顺序。 IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流 1、事件冒泡 事件冒泡,即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上转播至最不具体的节点(文档)。 2、事件捕获原创 2016-03-13 23:58:50 · 427 阅读 · 0 评论 -
【转】SMACSS 学习笔记
写出可用的 CSS 并不难,但是写出可维护的 CSS 一直是我在考虑的一个问题。如何让一个团队写出来的 CSS 像是同一个人写出来的,在这点上,Google CSS style guide 规定得太少。而 CSS 模式可以解决这种问题,本文就是我在学习 SMACSS( Scalable and Modular Architecture for CSS ) 时候的笔记。理想中的 CSS 模式转载 2016-06-05 23:37:17 · 686 阅读 · 0 评论 -
HTML+CSS基础篇(一)——认识标签
(一)、认识标签11、<body>标签,网页上显示的内容放在这里2、<p>标签,添加段落3、<h[1-6]>标签,为你网页添加标题4、<span>标签,为文字设置单独样式5、<q>标签,双引号""短文本"6、<blockquote>标签,缩进样式显示长文本7、<br>标签,换一行显示文本8、 空格9、<hr>标签,添加水平横线10、<address>标签,为网页加原创 2016-03-08 22:51:09 · 817 阅读 · 0 评论 -
HTML+CSS实战(一)——导航条菜单的制作
一、垂直导航菜单的制作 1、基本的样式清除: *{margin:0;padding:0} 2、无序列表圆点去除: ul{list-style:none} 3、下划线去除: a{text-decoration:none} 4、文本缩进标签 text-indent 不会影响总体宽度(padding会) 5、使用行高line-height可以实现文字默认居中,前提是行高和width相等。 6、原创 2016-03-14 22:34:49 · 36214 阅读 · 1 评论 -
HTML+CSS基础篇(二)——表单标签,与浏览器交互
一、使用表单标签,与用户交互网站使用HTML表单(form)与用户交互。表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。语法:<form method="传送方式" action="服务器文件">讲解:1.<form> :<form>标签是成对出现的,以<form>开始,以</form>结束。2.action :浏览者输入的数据被传送到的地原创 2016-03-08 23:55:55 · 691 阅读 · 0 评论 -
HTML+CSS基础篇(三)——CSS样式基础
CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。选择器{ 样式;}一、css三种样式方法1、内联式css样式,直接写在html标签中<p style="color:red;font-size:12px">这里文字是红色。</p>【注意】如果有多条css样式代码设置可以写在原创 2016-03-09 21:22:34 · 731 阅读 · 0 评论 -
HTML+CSS基础篇(四)——编码规范
CSS 规范命名头:header 内容:content/container尾:footer 导航:nav侧栏:sidebar 栏目:column页面外围控制整体布局宽度:wrapper 左右中:left right center登录条:loginbar 标志:logo广告:banner 页转载 2016-03-30 20:09:16 · 720 阅读 · 0 评论