CSS
关注
分享
扫一扫
y_bccl27
这个作者很懒，什么都没留下…
展开
-
CSS中的contenteditable属性
contenteditable属性可以使一个元素变为可编辑的状态contenteditable="true" #开启文本编辑contenteditable="false" #关闭文本编辑，该字段的值缺失时，效果和这个是一样的contenteditable="plaintext-only" #开启文本编辑并且只保存纯文本示例：<!--设置span元素为可编辑状态，从其它地方复制内容过来时，只保存纯文本--><span con原创 2020-05-09 17:32:41 · 4503 阅读 · 0 评论 -
input标签里面的文字位置
水平对齐：<input type="button" value="按钮" style="width:80px;text-align:center" />垂直对齐：<!--可使用padding-top和padding-bottom来精确控制，例如文字靠下：--><input type="button" style="padding-top:20px;...原创 2019-11-11 16:48:44 · 12877 阅读 · 2 评论 -
CSS中meta标签的viewport
<meta name="viewport" content="width=device-width,initial-scale=1.0">content的6个属性width:可视区域的宽度，值可为数字或关键词device-widthheight:可视区域的高度，值可为数字或者关键词device-heightintial-scale:页面首次被显示是可视区域的缩放级别...原创 2019-11-04 14:52:23 · 734 阅读 · 0 评论 -
BootStrap中的日期时间组件datetimepicker
使用BootStrap中的日期时间组件需要引入以下三个文件：<!--日期控件--><link rel="stylesheet" th:href="@{/components/datetime/bootstrap-datetimepicker.min.css}"/><script th:src="@{/components/datetime/moment-...原创 2019-10-29 17:48:33 · 832 阅读 · 0 评论 -
ionic Toggle（开关控件）
官网地址：https://www.runoob.com/try/try.php?filename=ionic_toggle<html ng-app="ionicApp"> <head> <meta charset="utf-8"> <meta name="viewport" content="initia...原创 2019-10-23 15:05:43 · 618 阅读 · 0 评论 -
移动端禁止页面缩放
在head标签体内加上如下所示的一行既可，其中关键性的语句是user-scalable=no<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">原创 2019-10-20 14:17:04 · 681 阅读 · 0 评论 -
页面背景图尺寸不随浏览器缩放而变化
应用前提：当我们为某一个元素设置了背景图以后，希望该背景图不会因为浏览器的放大而放大或者随着浏览器的缩小而缩小方法一：把图片作为背景图片（background）background-size：cover，这个CSS3的属性作用是把背景图像扩展至足够大，以使背景图像完全覆盖背景区域，背景图像的某些部分也许无法显示在背景定位区域中，如果不使用这个属性，在IE11和FireFox中缩放浏览器，背...原创 2019-10-08 11:28:13 · 4797 阅读 · 3 评论 -
相对定位和绝对定位
相对定位：当给下面的元素绑定事件后，触发该事件后元素以自身为基准发生相应的位置变化，但不影响其它元素所占的位置<div style="position:relative;"> 相对定位</div>作用：1.当鼠标触碰某一个元素的时候，该元素的top、left、right、bottom值会发生变化，进而产生位移动画绝对定位：是以元素的父元素为...原创 2019-10-06 16:10:49 · 315 阅读 · 0 评论 -
textarea输入区域设置输入文字字数的最大个数
<textarea maxlength="10"></textarea> 当已输入了10个字符后再进入输入时，后面输入的会自动滤掉原创 2019-09-29 10:45:36 · 7664 阅读 · 0 评论 -
鼠标触碰元素时变为其它各种形状
鼠标触碰元素时，鼠标形状变为其它形状，其中经典的是手形（style="cursor:pointer"）<p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p><span style="cursor:auto">Auto</span> <!--默认，浏览器设置的光标--><br/>&...原创 2019-09-29 10:37:18 · 473 阅读 · 0 评论 -
设置文字不能被选中复制
应用前提：为防止其它人直接利用复制粘贴来拷贝文档，对网页的重要文档设计了不允许复制通过设置元素的CSS的user-select属性就可以<style> .select{ -webkit-user-select:none; /*WebKit内核私有属性*/ -moz-user-select:none; /*Firefox私有...原创 2019-09-29 09:25:47 · 785 阅读 · 0 评论 -
BootStrap里面好看的背景色
上述6种背景颜色编码为：default: #777777 primary: #337AB7success: #5CBB5Cinfo: #5BC0DEwarning: #F0AD4Edanger: #D9634F其它好看的背景色(7种)：HTML5: #387ef5CSS3: ...原创 2019-09-28 20:28:55 · 3127 阅读 · 0 评论 -
禁用，元素设置为不可点击
如下所示，給div添加了以下样式后，div里面所有的点击事件都不会触发<div style="pointer-events: none;"> <a href="www.baidu.com">测试</a> </div>...原创 2019-08-21 15:02:54 · 3095 阅读 · 0 评论 -
Div水平居中
一、Div水平居中<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>居中用法</title> <...原创 2019-08-21 09:39:19 · 243 阅读 · 0 评论