随笔分类 - css
css学习记录
摘要：1. 概述 1.1 说明 在项目开发中，我们经常使用css样式使页面丰富多彩，编写过程中，CSS有四种引入方式。 2. CSS引入方式 2.1 引入方式一：内联样式 内联样式(行内样式)：直接在 HTML 标签中的 style 属性中添加CSS <div style="width:200px;hei
阅读全文
摘要：1. 概述 1.1 说明 有时候为了美观会对默认的滚动条样式通过css去进行美化 1.2 滚动条内容 1.2.1 滚动条外观查看 1.可滑动的内容(中间的实体内容)，即滑块。 2.滚动条边框(轨道)，滑块在此里边进行滑动，即轨道 1.2.1 滚动条样式 ::-webkit-scrollbar 定义了
阅读全文
摘要：1. 概述 1.1 说明 在项目过程中，有时候需要使用动画效果来展现某一效果，实现动画效果的方式有很多种，而css3提供的animation属性则可直接使用样式进行控制动画效果。 1.2 动画使用 注意：IE10以前版本不支持animation属性 1.2.1 animation 集合使用 示例：d
阅读全文
摘要：1. 概述 1.1 说明 在项目过程中，有时候需要网页中内容信息不可被复制进行保护数据信息，故可使用css属性user-select进行控制用户能否选中文本。 1.2 语法 user-select : none | text | all | contain | auto none：文本不能被选择，即
阅读全文
摘要：1. 概述 1.1 说明 在项目过程中，有时候需要控制div内文字最多显示两行，超出的使用省略号进行处理。使用识别码/前缀-webkit进行处理可直接得到相应效果。 1.2 -webkit WebKit内核的css前缀为“-webkit-”，Comodo Drangon(科摩多龙)，苹果，安卓，搜狗
阅读全文
摘要：1. 概述 1.1 说明 通过边框(border)的宽度与边框圆角(border-radius)来设置所需的三角形与圆形。 1.2 边框 宽高都为0时，边框设置的不同结果也不同，如下： 1.四个边框都为10px的实线时，页面上会显示出一个宽高都为20px(边框组织起来的)的正方形 2.四个边框都为不
阅读全文
摘要：1. 概述 1.1 定义 @media可以针对不同的屏幕尺寸(媒体类型)设置不同的样式，在响应式页面中，@media非常有用。重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。 1.2 使用 css语法： 媒体类型(mediatype)： all —— 所有设备 screen ——
阅读全文
摘要：1. 概述 1.1 说明 rem是css3中新增的一个单位属性(font size of the root element)，根据页面的根节点(html)的字体大小进行转换的单位，通过此单位属性可以进行自适应性布局开发。 1.2 示例说明 rem的初始值是16px，即默认值为1rem=16px;若在
阅读全文
摘要：1. 概述 1.1 说明 css重置样式主要是为了让各个浏览器的CSS样式有一个统一的基准，使HTML元素样式在跨浏览器时有一致性的效果。 备注：浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果不对css初始化往往会出现浏览器之间的页面显示差异。但是初始化样式也会对SEO有一定的影响，故
阅读全文
摘要：1. 概述 1.1 说明 position属性：规定元素的定位类型。即元素脱离文档流的布局，在页面的任意位置显示。 1.2 属性值 absolute：绝对定位；脱离文档流的布局，遗留下来的空间由后面的元素填充。定位的起始位置为最近的父元素(position不为static)，否则为body文档本身。
阅读全文
摘要：1.概述 1.1前言 css盒子模型具备的属性：内容(content)、填充(padding)、边框(border)、边界(margin)；而日常生活中所见的盒子也就是能装东西的一种箱子，也具有这些属性，所以用盒子模式来理解。 生活中的盒子说明： 内容(content)：盒子里装的东西。 填充(pa
阅读全文
浙公网安备 33010602011771号