CSS学习记录 1、CSS语法 1.1 基本语法 1、使用选择符来说明CSS的作用范围 2、声明语句放在选择符后面的大括号内,多个声明语句是用分号隔开 1.2选择符 A.类选择符 class='name', 以.name{}进行渲染 1、类选择符必须以点号开头 2、类名只能包含字母、数字、连字符和下划线,切必须以
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d
目录伪元素选择器选择器的优先级选择器优先级相同选择器不同导入方式(相同距离优先)不同选择器不遵循就近原则(优先级)字体相关高度(height)和宽度(width)字体大小(font-size)字重(font-weight)文本颜色文字属性文字对齐文字装饰首行缩进背景属性背景颜色背景图片显示指定图片位置以及居中显示
css绘制三角形 triangle 文章目录 css绘制三角形 triangle效果图代码 效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css绘制三角形</title> <style> .box{ d
1、定义一个类文件 using System.Windows; using System.Windows.Controls; using System.Windows.Media; namespace SilverlightApplicationGridBorderSample { /// <summary> /// 为Grid添加的一个特殊功能 /// </summary> public class GridHelper {
<div> <div class="circle"></div> <div class='wrap'> <div class='ribbon'> <span>测试1</span> </div> </div> </div> <style&
如果把鸡蛋看成一个div,该怎么描述它所在的位置和样式?这就是接下来要描述的知识点啦 1.offsetHeight, offsetWidth.offsetLeft, offsetTop, offsetParent el.offsetHeight任何一个元素的高度(height+padding+border)el.offsetWidth任何一个元素的宽度(width+padding+border)el
HTML+CSS+JS制作一个黑灰色简约时钟 1. 效果图: 2. 特点:这次借鉴了网络上的代码,利用JS动态创建元素,减少html语句的数量,也便于与vue、react等语言进行结合。 3. 代码实现: <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <titl
移动端1px边框的问题 2019-10-21 16:38·前端技术精髓 前言 应该感觉不止一次会被涉及到关于1px的问题,其主要触发的场景就是高分屏上会把1px宽的边框显示成2px,在dpr为3的设备上,显示边框为3px. 为了避免大家少走弯路,这里简单带一下网上提到的几种方案,包括下面的: 边框的图片,b
一、基本选择器 通用选择器 选择所有的元素,此处*为所有通配符 * { color: #0000FF; } 元素选择器 p { font-size: 18px; font-weight: bold; } ID选择器 #whit{ color: red; } 类选择器 .wh{ font-family: 华文新魏; } 分
内容概要 伪元素选择器 字体样式 颜色 背景、边框 盒子模型 内容详细 伪元素选择器 # 首字调整>>>:也是一种文档布局的方式 p:first-letter { font-size: 48px; /*字体大小*/ color: red; }
flex布局的高度问题且内容自适应flex:1的高度 HTML <div id="main"> <div class="autoHeight">高度不确定</div> <div class="div1"> </div> </div> css #main { width:220px; height:100vh; border:1px solid black;
效果图: 多少是有点粗工滥制了,当天晚上想都没想疯狂div,唉~ 为了方便观看,所以把三部分代码分开了 Code: JS实现倒计时的代码: <script type="text/javascript"> window.onload=function(){ function countdown(){ //初始化日期变量 var target_ti
盒子模型概述 盒子模型即 box model,无论是 div、span 还是 a 都是盒子模型。 盒子模型中的区域 Margin(外边距)- 清除边框区域。Margin 没有背景颜色,它是完全透明Border(边框)- 边框周围的填充和内容。边框是受到盒子的背景颜色影响Padding(内边距)- 清除内容周围的区域。会受到框
html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content
昨日内容回顾 form表单 '''获取用户数据并发送给后端服务器''' 1.form标签中的重要属性 action 控制数据的提交路径 method 控制数据的提交方式 enctype 控制携带文件数据 2.input标签 type属性参数不同 效果不同 text 普通文本 password 密文展示 date 日历展示
我遇到的场景: 对于iframe窗口,自带滚动条是整个窗口的大小。有时需要顶部或底部固定,则滚动条不应该触碰到顶部或底部。 那么首先打开iframe时应该去掉滚动条 scrolling="no",然后在需要滚动的区域自定义滚动条。 <iframe frameborder="0" scrolling="no" src="index.html" > 自
笔记基于尚硅谷 菜鸟教程 目录 1. 文档流 2.盒子模型 2.1简介 2.2 边框 2.3盒子的内边距 2.4盒子的外边距 2.5盒子在水平方向的布局 2.6盒子在垂直方向的布局 2.7外边距的折叠 2.8行内元素的盒模型 2.9浏览器的默认样式 2.10盒子的大小 2.11盒子的阴影轮廓和圆角 1. 文档流
css背景 background-color{十六进制:如#b0c4de;/RGB"rgb(255,0,0)"/颜色名称"red"} background-image{url(/image/bg.gif); /*背景图片*/ } background-repeat{repeat; /*重复排列-网页默认*/ no-repeat; /*不重复排列*/ repeat-x; /*在x轴重复排列*/ repeat-y; /*在y轴重复排列*
外边距 margin 边框 border 内边距 padding 内容 context 内容区域有宽高 盒子的宽高,指的是内容区域的宽高.
开发 HTML + CSS + Vuejs基于数据的开发模式 以前开发是基于DOM的开发模式,本案例中基于数据的开发模式 列表结构通过 v-for 指令结合数据生成 v-on 结合实践修饰符对事件进行限制,比如.enter v-on 在绑定事件时可以传递自定义参数 通过 v-model 可以快速的设置和获取表单元素的值
概要 伪元素选择器 选择器的优先级 字体相关 背景属性 边框属性 display属性 盒子模型 详细 1 伪元素选择器 应用: 如果做爬虫时候没有爬到内容,那么有可能是伪元素选择器的原因 1-1 设置段落首字母 如: 首字母颜色,大小 <head> <meta ch
前言❤️ 保持热爱奔赴山海,忠于自己热爱生活 ❤️ 前端基础知识第三章---CSS 一、CSS 第三章(1)CSS 的三大特性1.1 层叠性1.2 继承性1.2.1 行高的继承性 1.3 优先级 (2)CSS 盒子模型2.1 看透网页布局的本质2.2 盒子模型(Box Model)组成2.3 边框(border)2.4 表格的细线边框2.5 边框会影
<div class="cag-dialogBox" :class="{active: item === choosenItem}" @click="clickAffirm(item)" v-for="item of dataList" :key="item.agentId"> active为class名,,冒号后面为判断条件。 .active { border-color: #b
目录字体相关调整背景相关调整控制背景平铺调整背景图像的大小边框属性圆与圆角盒模型块级盒子(Block box) 和 内联盒子(Inline box)display属性盒子模型盒模型的各个部分通俗理解 字体相关调整 注意:只有块儿级标签可以设置,行内标签无法设置 /*宽和高*/ height: 1000px; width: 50p