CSS多列常用属性：column-count 分几列column-gap 列间距column-rule 列分割线的样式（写法和border一样）例如：一个div分三列，列之间间距为10px，分割线为（可以不设置）5像素红色实线这样写<style> div{column-count:3; column-gap:10px; column-rule:5px solid red; }</style>写此样式要加前缀column-rule 宽度:可选值有thin（细边框）、medium（中等边框）、thick（粗边框）、也可以指定数值样式:可...
1、盒子模型（1）border属性和padding属性会影响盒子的实际大小：<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script></script><style>div{width: 200px;height: 200px;background-color: black;border: 30px solid red;}</style></head><body><div></div></body> </html> <!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script></script><style>div{width: 200px;height: 200px;ba...
1.字体属性（1）font-family 把要对这个网站要设置的字体都写上，如果这个浏览器支持第一个字体，则会用，如果不支持则会尝试第二个，如果设置的字体系统都不支持则会使用系统默认的字体作为网站的字体 （2）字重（font-weight） 2.文字属性 /* 我这个文件是用来干什么的 小强 日期 *//*全局通用样式*/ * {font-family: "Microsoft YaHei UI", "Arial";font-size: 14px;}/*类选择器样式*/ .c1 {font-weight: 100; }.c2 {font-weigh...
align-content作用:会设置自由盒内部各个项目在垂直方向排列方式。条件:必须对父元素设置自由盒属性display:flex;，并且设置排列方式为横向排列flex-direction:row;并且设置换行，flex-wrap:wrap;这样这个属性的设置才会起作用。 设置对象:这个属性是对她容器内部的项目起作用，对父元素进行设置。取值:stretch:默认设置，会拉伸容器内每个项目占用的空间，填充方式为给每个项目下方增加空白。第一个项目默认从容器顶端开始排列。<...
12 <div id="animateTest"style="-webkit-transform: perspective(400px) rotateY(40deg);">Css12<div id="animateTest"style="-webkit-transform: rotateY(40deg) perspective(400px);">如果大家不清楚，请听我娓娓道来。CCS3中的Transform是设置界面样式和动画的一大利器。而且在Chrome和FF中还支持3D变换。IE9不支持，IE10支持。只要是3D场景都会涉及视角问题和透视的问题。在Transform中的设置方法比较简单：只能选择透视方式，...
1.字体 名称font-family 大小font-size 样式font-style 粗细font-weight 简写属性font (集合写法)2.文本 颜色color 行高line-height 对齐方式text-align 方向direction 缩进text-indent 装饰线text-decoration 间隔lettter-spacing 阴影text-shadow3.尺寸 宽度和高度width height 最小宽度和高度 min-width min-height 最大宽度和高度 max-width max-height4.列表 list-style-image list-style-position list-style-type5.背景 bac...
写在前面的话： 由于CSS3标准还未完全订下来，所以各种内核的浏览器都有自己的标准，为了不使属性混淆，所以各家在各家自标准前加了一个前缀，如：-moz-主要是firefox火狐 -webikt-主要是chrome谷歌 -o-主要是用于苹果浏览器 一.box-shadow（阴影效果）使用：box-shadow：20px 10px 0 #000；-moz-box-shadow：20px 10px 0 #000；-webkit-box-shadow：20px 10px 0 #000；支持：FF3.5，Safari4，Chrome3二.border-colors（为边...
边框颜色 border-color：red/#ffffff/rgb()边框样式 border-style：solid（实线）dashed（虚线）默认为nome边框粗细 border-width：1px 默认是 3pxBorder的简写 border：border-width border-style border-color原文：https://www.cnblogs.com/xwzs/p/11899882.html
样式表三种写法1内联写法：style直接写在标签内。个人感觉多用于个别标签，一般情况优先级较高style="font-size:16px;"2内嵌写法：写在<head></head>标签内。个人感觉多用于较多或通用的一类标签，用来减少工作量<style type="text/css">{}</style>分为三种：标签选择器<style type="text/css"> 标签名（类如div）{ }</style> 类选择器<style type="text/css"> .class{}</style> id选择器<style type="text/css"> #id{ }<...
<!DOCTYPE html>CSS4-布局1-基本属性属性：displayvisibilityfloatclearHTML元素类型：行内元素，块级元素块级元素：最大的区别：换行行内元素：不换号<style>div{background:#f00;width:200px;height:100px;}span{background:#0f0;width:200px;height:100px;}/*display*/div{display:inline;} /*元素转为行内*/span{display:block;}/*元素转为块级*/div,span{display:inline-block;}/*元素转为行内块级综合，IE6/7不支持块级元素转...
1.让文字不可选中-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;2.safari点击区域阴影去除 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);原文：https://www.cnblogs.com/cococe/p/10308901.html
一、颜色属性650) this.width=650;" src="/upload/getfiles/default/2022/11/9/20221109104230227.jpg" title="5.png" />demo.html<!doctype html> <html> <head> <title>CSS的颜色属性的四种方式</title> <meta charset="utf-8"> <style type="text/css"> body{ color:red } .c1{ color:#ff6600 } ...
首先可以使用before选择器与after选择器的content属性在元素的前面或者后面插入文字和图像，这里我记录的是利用这个content属性来在项目前插入项目编号，同时可以利用content属性在字符串两边加上括号。1.在多个标题前加上连续编号<style type="text/css"> h1:before{ content:counter(mycounter); }</style> 2.在项目编号中追加文字h1:before{ content:‘第‘counter(mycounter)‘章‘;} 3.指定编号的样式例如：使得编号后面...
文字阴影text-shadow：h-shadow/v-shadow h-shadow 水平阴影，允许负值，正数时阴影在右，负数时阴影在左v-shadow 垂直阴影，允许负值，正数时阴影在底部，负数时阴影在上面 水平和垂直阴影必须要写 blur 模糊距离，只能是正数color 阴影颜色 盒子阴影box-shadow 默认时外阴影（六个属性值，前四个是value,color，inset） 1）阴影离开盒子时的横向距离2）阴影离开盒子时的纵向距离3）阴影的模糊半...
1、在<img>标签中的使用 alt：全称为alttext，实质是当图片无法正确显示时用于替换（在IE下同时起到了title的作用，即鼠标滑过时文字提示）； title：鼠标经过时文字提示，可在重要的图片（logo）或用户会体验到的图片内容加上；2、在其他方面的应用alt：只能用在<image>、<input>、<area>元素中，替代不能显示的图片，<input>是图片按钮的作用；title：可用在除html、head、meta、base、basefont、param、script和title标签...