CSS

CSS 基础 3 - 定位 Postion 属性

CSS 基础 3 - 定位 Postion 属性 static position 属性的默认值,元素随 HTML 流移动 top/left/right/bottom 属性无效 relative 和 static 类似,元素随 HTML 流移动。区别: 比 static 多了 top/left/rig ......
属性 Postion 基础 CSS

盒子模型-CSS

/* 内边距 / padding: 20px; / 边框 / border: 20px solid black; / 外边距 */ margin: 50px; /* 实线 / / border: 10px solid #000; / / 虚线 / / border: 10px dashed #000 ......
盒子 模型 CSS

显示菜鸟教程的底部文字By.CSS_SELECTOR

cess select 不需要滚动到底部 直接可以获得 test_loc='[href="//www.runoob.com/web/web-buildingprimer.html"]>h4' # 显示底部的文字 # [href="//www.runoob.com/web/web-buildingpr ......

CSS 基础 1 - Block & Inline

CSS 基础 1 - Block & Inline display: inline/block/inline-block/none/flex/grid; block block 元素独占一行,即使两个元素宽度都小于 50% 也不会左右并排 block 元素可以单独设置 width、height 属性 ......
基础 Inline Block CSS amp

By.CSS_SELECTOR 定位查找元素 并输出文本

代码 定位到元素后打印出文字 def get_text(self): element=driver.find_element(By.CSS_SELECTOR, "#sidebar_bh [href*='vip']") print(element.text) ......
CSS_SELECTOR SELECTOR 元素 文本 CSS

By.CSS_SELECTOR 伪类选取器

html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS1</title> </head> <body> <div id='div1'> <div id='div2' > <P>这是段落1</p> < ......
CSS_SELECTOR SELECTOR CSS By

By.CSS_SELECTOR 祖宗和后代用空格隔开

element = driver.find_element(By.CSS_SELECTOR, "#div2 input[type='text']") element.send_keys('myname') ......
空格 祖宗 后代 CSS_SELECTOR SELECTOR

使用CSS、HTML、JavaScript实现一个简单的身份验证页

这是我在博客园的第一篇博客,也是我人生中的第一篇博客。希望它能够记录我的成长,帮助更多的人。 最近在写我们社团的社团网站,有一个页面不太希望普通访客能访问到,所以想做一个“统一身份验证验证”,但是又苦于社团网站搭建是纯静态站,没法做数据库,只能妥协,将账号密码字符串组写到JavaScript脚本里, ......
JavaScript 身份 HTML CSS

By.CSS_SELECTOR

# 导包 from selenium import webdriver from selenium.webdriver.common.by import By from time import sleep from selenium.webdriver.support.ui import WebDr ......
CSS_SELECTOR SELECTOR CSS By

CSS: width height

<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docume ......
height width CSS

CSS 入门 - Box Model 盒模型

CSS 入门 - Box Model 盒模型 网页布局:先学习 Box Model,然后 Flexbox/Grid/Float 三选一即可搞定网页布局,推荐 Flexbox! BOX Model 四大属性:Content、Padding、Border、Margin Content:内容 Border ......
模型 Model CSS Box

vue-cli_关于vue-cli打包后多出的js与css文件

平常并没有注意到打包后js与css有多少个文件, 一般而言执行打包命令后就差不多万事大吉, 然后交给后端去完成部署就好了. 但轮到自己亲手为打包文件设置CDN时, 发现, 原来打包出来文件多少还是有区别的. 如下, 是我打包出来的某个项目的文件和自动生成的html文件的引入文件. ├─dist | ......
vue-cli vue cli 文件 css

前端显示数据库中的换行文本:HTML和CSS解决方案

在项目中经常会出现要显示数据库中的大段文本内容,如说明或备注等信息,当其中存储有换行符的时候,前端通常会忽略这个换行,直接在一行显示,那么怎么解决呢? 解决方案一:使用HTML <br> 标签 HTML的<br>标签是一种简单而直观的方法,它可以将文本中的换行符正确地呈现在浏览器中。 示例代码: < ......
前端 解决方案 数据库 方案 数据

基于CSS实现回到页面顶部的几种写法(从实现到增强)

前面整理了一个JS实现回到顶部的功能,但没有给出具体的界面样式,这次从网上找几个好看的参考,自己动手也实现一下: 效果图如下: 代码如下: <!DOCTYPE html> <html lang="cn"> <head> <meta charset="UTF-8"> <title>css arrow< ......
写法 顶部 页面 CSS

浅谈css的伪元素::after和::before

css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁。 但是很多人对::after和::before仍不是特别了解,究竟他们是做什么的?如何使用他们?什么时候应该使用他们?笔者总结了一些对伪元素的理解和使用经验。 一、概念: 1.定义 从 ......
元素 before after css

vscode vue 插件与 emmet、tailwind css 插件冲突的解决方案

今天使用 vscode 开发 nuxt3 项目,发现在 vue 文件中,emmet 提示功能不可用。 emmet 提示功能,如下图所示: 百度、google一阵子,发现是个全球性存在的问题,是 vue 插件 volar 导致的 vscode 自带的 emmet 提示功能不可用。 如果在vscode中 ......
插件 tailwind 解决方案 方案 vscode

XPATH&CSS规则

css定位规则 css定位示例 xpath定位规则 xpath定位示例 ......
规则 XPATH CSS amp

使用CSS中的@keyframes规则创建了一个无限旋转动画

现在scss中定义: @keyframes rotate { 0% { transform: rotate(0) } 100% { transform: rotate(360deg) } } 应用到元素element中: .element { animation: rotate 2s linear ......
keyframes 规则 动画 CSS

01-React-组件-CSS模块化

Css Module (推荐) React 的脚手架已经内置了 css modules 的配置: .css/.less/.scss 等样式文件都修改成 .module.css/.module.less/.module.scss 等; 在以前我们的文件是这样的 index.css 如果使用了 CSS ......
组件 模块 React CSS 01

CSS的表格属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< ......
表格 属性 CSS

CSS的文本属性

1.指定元素文件的水平对齐方式:text-align(left right center) 2.text-decoration:文本修饰(underline下划线 overline 上划线 line-through 删除线) 3.text-transform:控制文本的大小写:(captialize ......
属性 文本 CSS

uniapp经常性报node:events:504, 使用了uno.css

vite.config.js build: { watch: { exclude: ['node_modules/**', "/__uno.css"] }, } ......
经常性 uniapp events node 504

css小结02

CSS三种显示模式可以互相转化 CSS中元素分为 块元素(独占一行),行内元素(不独占一行),行内块元素(在一行内显示,可以设置宽高)。 三种元素之间可以互相转化 <!-- 通过display属性来互相转化 --> <!-- 如下 通过给display 属性赋不同的值 inline-block 转为 ......
小结 css

css继承,position:fixed固定定位

CSS 继承是指元素可以继承其父元素的某些样式属性值。当一个元素应用了某个样式属性值,而其子元素没有显式地指定该属性值时,子元素会从父元素继承该属性值。 以下是一些常见的 CSS 属性可以被继承的例子: 1.字体样式属性:font-family、font-size、font-weight、font- ......
position fixed css

css01小结

<!-- CSS的引入 外链式 定义一个css文件,直接写 然后在head标签内用 link引入 <link rel="stylesheet" href=""> 内嵌式 head标签内 写style标签 行内式 直接在标签内 写style定义,没有做到结构与样式分离 ,所以不用 CSS 样式的功能 ......
小结 css 01

BootstrapBlazor组件库,项目模板css样式隔离问题

BootstrapBlazor组件库,项目模板css样式隔离问题 问题描述 有很多小伙伴在使用BootstrapBlazor组件库的项目模板的时候,遇到了隔离样式不生效的问题。 解决方案 只需要添加一行代码即可解决问题。 <link href="xxx.styles.css" rel="styles ......
BootstrapBlazor 样式 组件 模板 项目

css3文字渐变, svg文字渐变

1.svg 文字渐变 <!-- 横向渐变(x1,y1,x2,y2控制渐变方向) --> <svg> <defs> <linearGradient id="grad_red_blue_lr" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" st ......
文字 css3 css svg

CSS的背景属性

背景属性包括:color 颜色属性、image图片、position显示位置,repeat填充,size属性 基本格式为background-+属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=" ......
属性 背景 CSS

CSS的字体属性

字体属性:颜色、大小、加粗、文字样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0 ......
属性 字体 CSS

看到过的css 属性2

css 新单位 vmin 表示 获取视口的最长边或者最短边 vmax shape-outside:circle(50% as 50% 50%) 这个表示文字的环绕方式, 比如浮动后,文字会环绕浮动元素排列, 但是如果浮动元素形状变成圆形,默认的环绕方式还是会是方正的, 使用这个属性就可以实现弧形的环 ......
属性 css