CSS
关注
分享
扫一扫
文章平均质量分 65
qq_41008787
这个作者很懒，什么都没留下…
展开
-
学习笔记（九）从对象到iframe - 其他嵌入技术
从对象到iframe - 其他嵌入技术嵌入的简史<iframe>嵌入的简史很久以前，很流行在网络上使用框架创建网站 — 网站的一小部分存储于单独的HTML页面中。这些被嵌入在一个称为框架集的主文档中，它允许您指定每个框架能够填充在屏幕上的区域，非常像调整表格的列和行的大小。这些做法在90年代中期至90年代后期被认为是比较酷的，有证据表明，将网页分解成较小的块，这样有利于下载速度 —尤其是在那时网络连接速度太慢的情况下更为明显。然而，这些技术有很多问题，随着网络速度越来越快，这些技术带来的问题远原创 2021-05-06 15:21:15 · 171 阅读 · 0 评论 -
学习笔记（四）web入门--HTML+CSS+JS+发布网站
web入门--HTML+CSS+JS+发布网站HTML基础知识CSS基础“CSS规则集”详解多元素选择不同类型的选择器字体和文本一切皆盒子JavaScript基础变量注释运算符条件语句函数事件小结发布网站==获取主机服务和域名==使用在线工具如 GitHub 或 Google App Engine通过GitHub发布使用像 Thimble 的基于 Web 的集成开发环境HTML基础知识标题图片段落列表无序列表（Unordered List）中项目的顺序并不重要，就像购物列表。用一个 &l原创 2021-05-06 15:11:33 · 733 阅读 · 0 评论 -
表格和列表的一些CSS属性
表格和列表的一些CSS属性表格的CSS:列表CSS：表格的CSS:表格的标题<caption>…</caption>会到表格的下面table{ caption-side:bottom;}表格单元格只有内边距和边框，没有外边距，但是有边框间距（border-spacing）折叠边框:table{ border-collapse:collapse}列表CSS：改变无序列表的项目符号：li{ list-style-type:disc}原创 2021-05-03 21:36:05 · 92 阅读 · 0 评论 -
CSS3新特性---应用多重背景和使用渐变背景
CSS3新特性---应用多重背景和使用渐变背景应用多重背景使用渐变背景为元素设置不透明度应用多重背景输入background-color:b，这里b是指希望元素应用的备用颜色输入background-image：u，u，u，这里的u是url列表，中间用逗号隔开输入background-position：p，p，p，这里的p是成对的x-offset和y-offset，用逗号分隔输入background-repeat:r，r，r，，指的是repeat-x、repeat-y、no-repeat，用逗号原创 2021-05-03 20:56:06 · 512 阅读 · 0 评论 -
CSS---Web字体
CSS---Web字体在哪里？自托管Web字体服务从Font Squirrel下载Web字体应用字体使用Google Fonts的Web字体在哪里？自托管自托管Web字体来源于你的服务器，就像其他资源（如图像、CSS文件）一样。如果需要与字体相关的花费，通常也是一次性的购买支出，是否将字体文件上传到网站上并将其包含到代码中取决于你自己。其中有一些自托管字体来源：Font Squirrel(www.fontsquirrel.com)MyFont(http://myfonts.com)The Le原创 2021-05-03 20:15:16 · 308 阅读 · 0 评论 -
CSS---视觉区域和屏幕区域的不同及meta元素
CSS---视觉区域和屏幕区域的不同及meta元素视觉区域与屏幕区域meta元素视觉区域与屏幕区域视觉区域viewport指的是浏览器显示页面的区域，不包含浏览器及地址栏、按钮等。媒体查询的width特性对应的是视觉区域的宽度。而device-width指的是屏幕的宽度。在移动设备上，默认情况下这两个值不同。比如Mobile Safari（iphone的浏览器）的视觉区域默认是980像素，而iphone的屏幕宽度只有320像素。因此，iphone会像设为980像素宽的桌面浏览器那样显示页面，并将页面原创 2021-05-03 17:31:07 · 261 阅读 · 0 评论 -
CSS---媒体查询语法
CSS---媒体查询语法有两种方式：一种是用link标签，然后通过media属性控制选择，即指向外部样式表链接。语法如下：<link rel="stylesheet" media="logic type and (feature:value)" href="your-stylesheet.css" >另一种是位于样式表中的媒体查询。语法如下;@media logic type and (feature:value){/*目标CSS样式规则*/}其中代码组成部分释义如下：原创 2021-05-03 17:13:39 · 215 阅读 · 0 评论 -
CSS---浏览器自定添加连字符
可以手动插入软连字符­。也可以使用新的属性hyphens属性，让浏览器自动插入连字符，但IE10之前版本、安卓设备中内置的WebKit浏览器，甚至基于Blink的Chrome和Opera都根本不支持hyphens要想使用自动连字符功能，需要以下两点：设置语言代码 <html lang=“en”>将CSS相关元素的hyphens设置为auto；p{ hyphens:auto;}要关闭连字符，可以将hyphens设为manual。...原创 2021-05-02 16:29:00 · 378 阅读 · 0 评论 -
CSS---定位与浮动
CSS---浮动浮动能将一个元素拉到容器的一侧，这样文档流就可以包围它。原创 2021-05-01 21:46:50 · 200 阅读 · 0 评论 -
CSS---将全局修改盒模型为border-box
将全局修改盒模型为border-box，CSS代码如下：/*根元素设置为border-box*/:root{ box-sizing:border-box;}/*其他所有元素和伪元素继承其盒模型*/*,::before::after{ box-sizing:inherit;}原创 2021-05-01 11:13:19 · 770 阅读 · 0 评论 -
利用视口相对单位定义字号
视口的相对单位基本概念使用视口单位定义字号基本概念CSS中除了相对font-size定义的em和rem这类相对单位，还有相对于浏览器视口定义长度的视口的相对单位视口指的是浏览器窗口里网页可见部分的边框区域，不包含浏览器的地址栏、工具栏、状态栏。有以下四种相对单位：vh：设置高度vw：设置宽度vmin：设置宽、高中较小的一方vmax：设置宽、高中较大的一方以上单位的值都是0-100的数字，相当于视口的宽、高都为100。例如：50vw等于视口宽度的一半；25vh等于视口高度的1/4；vmi原创 2021-04-30 20:03:04 · 233 阅读 · 1 评论 -
CSS---盒模型
CSS----盒模型一、基本概念二、关于背景的属性三、详细设置1.内边距和外边距2.边框四、box-sizing:border-box五、多样式表1.使用多个样式表2.选择样式表一、基本概念从css的角度看，每个元素就是一个盒子，每个盒子由内容区（content area）以及可选的内边距（padding）、边框（border）和外边距（margin）组成。内容区：每个元素都会有一些内容，如文本或图像。在内容区中，内容和盒子边缘之间没有空间。内边距：可选。可以在内容和边框之间创建一些空间，内边距原创 2021-04-30 17:50:23 · 141 阅读 · 0 评论 -
CSS---为文本添加样式
层叠、优先级和继承层叠层叠原创 2021-04-29 21:04:45 · 1014 阅读 · 0 评论