css
duc_?
(☆_☆)
展开
-
文本 —— 溢出截断省略号显示
textarea:resize: none; 禁止拖拽textarea,p,div等; user-select: none; 禁止用户选择复制 单行文本溢出截断以省略号方式显示(以下三个样式缺一不可) white-space: nowrap; 文本溢出不换行 overflow: hidden; 文本溢出截断 text-overflow: ellipsi...原创 2019-07-10 10:36:56 · 379 阅读 · 0 评论 -
table表格(实例):跨行跨列布局
表格 table 表头 thead 表体 tbody 表尾 tfoot 行 tr 列 td 列 th 表格属性 cellspacing: 单元格与单元格之间的间距 cellpadding: 单元格的内边距 border: 1 表格边框大小 width: 表格宽度 单元格属性 colspan: 单元格跨列 rowspan: 单元格跨行 如图: <!--...原创 2019-07-22 12:11:56 · 2910 阅读 · 0 评论 -
文本样式
文本样式 text-align: left | right | center | justify;//文字位置设置 text-transform: uppercase | lowercase | capitalize;//文字元素转换 white-space: nowrap | wrap;//文字换行设置 line-height: 30px;//行高 letter-spacing: 30px;//...原创 2019-07-22 12:06:18 · 70 阅读 · 0 评论 -
优先级问题(权重)
css引入方式 内联样式 <div style="css样式"></div> 内部样式 <style> css样式 </style> 外部样式 <link rel="stylesheet" href="样式表链接" /> 在选择器精度一致时 内联样式 > 内部样式 > 浏览器缺省(默认)样式 内联样式 > 外部...原创 2019-07-20 22:48:31 · 657 阅读 · 0 评论 -
自定义复选框check-box
如图:, <div class="check-box"> <label> <input class="ipt" type="checkbox"> <div class="check"></div> </label> </div> ...原创 2019-07-17 08:26:49 · 2179 阅读 · 0 评论 -
css实现实心三角形、直角梯形、等腰梯形
超级简单:主要是知道这些个属性 元素的border正常形态上来说是等腰梯形的,通过宽高的撑开,使得其看上去是矩形 如图: <style> .sanjiaoxing{ width: 0; height: 0; border-top: 10px solid #000; ...原创 2019-07-17 08:21:27 · 1405 阅读 · 0 评论 -
主流浏览器及其内核
浏览器:内核名称 IE:trident edge:EdgeHTML Firefox:Gecko Chrome:webkit blink Opera:presto,后变更为webkit safair:webkit 内核组成:渲染引擎+js引擎 渲染引擎:主要负责解析渲染html、xml、css、image等页面内容并输出显示到显示器上 js引擎:主要负责解析js脚本语言,实现页面...原创 2019-07-09 12:58:07 · 149 阅读 · 0 评论 -
css选择器
关系选择器 子代选择器:以“>”连接 后代选择器(包含子代选择器):以空格连接 相邻兄弟选择器(捕获紧跟该元素后面的第一个兄弟元素)以“+”连接 后面兄弟选择器(捕获紧跟该元素后面的兄弟元素)以“~”连接 属性选择器 html标签的六大公共属性:name,title,class,id,style,data-* [name]:匹配含有name属性的标签 [name="...原创 2019-07-11 13:32:47 · 121 阅读 · 0 评论 -
文本文字分散对齐
div{ text-align-last:justify; text-align:justify; } 实例:原创 2019-07-10 23:11:53 · 623 阅读 · 0 评论 -
布局小技巧点(1)
页面内版块小标题布局 如图: 布局一:使用定位position、优先级z-index以及内边距padding <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>demo</title> <style type="text/css"&g...原创 2019-07-11 13:39:39 · 117 阅读 · 0 评论