css::before ,::after伪元素

笔记  CSS 

其将成为匹配选中的元素的第一个子元素。常通过 content 属性来为一个元素添加修饰性的内容。此元素默认为行内元素。/* Add a heart before links */a::before { content: "♥";}我觉得不用再说啥了。直接上图和代码就行了p::b

css-常见网页布局

笔记  CSS 

常见网页布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>

css:float 案例

笔记  CSS 

html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>

css-浮动属性

笔记  CSS 

floatfloat属性用于创建浮动框,直到左边缘或者右边缘以及包含块或者另一个浮动框的边缘不加float属性的时候效果如下加float属性(左浮动)的时候效果如下加float属性(右浮动)的时候效果如下加float属性(左右浮动)的时候效果如下浮动特性-脱标浮动的元素会脱离标准流浮动的元素会一行内

css伪类-:target

笔记  CSS 

:target:target CSS伪类代表一个唯一的页面元素,其id与当前Url片段相匹配例如,以下 URL 拥有一个片段 (以#标识的) ,该片段指向一个 ID 为 section2 的页面元素:http://www.example.com/index.html#section2若当前 URL

css样式表的继承性和层叠性

笔记  CSS 

本文参考链接:https://web.qianguyihao.com/02-CSS基础/05-CSS样式表的继承性和层叠性.html#层叠性举例CSS的继承性<!doctype html><html lang="en"><head> &l

css-box布局demo

笔记  CSS 

HTML<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"

css让图片和盒子一样宽的方法

笔记  CSS 

如下<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"

css-清除内外边距

笔记  CSS 

当我们写ul,li的时候会有自然的外边距,如下那么我们怎么清除内外边距呢?其实很简单直接在css里这样写 * { padding: 0; margin: 0; }就行了

css-显示模式

笔记  CSS 

a { display: block;}以上可以把行内式元素转换为块级元素div { display: inline;}以上可以把块级元素转换为行内式元素span { display: inline-block;}以上可以把元素转换为行内块元素单行文字垂直居中行高由上空隙,文字本身