<!DOCTYPE HTML> <style type="text/css"> body{ font-family: 'Courgette', cursive; } body{ background:#f3f3e1; } .wrap{ margin:0 auto; width:1000px; } .logo{ margin-top:50px; } .logo h1{ font-size:200px; color:#8F8E8C; text-a
本篇是笔者自己练习的案例，其中可能存在很多新手错误 这是一个简单的表格形式的记录添加和删除实现。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <m
重要属性： :active 选择器用于选择活动链接。 box-shadow: inset 将外部阴影 (outset) 改为内部阴影。 <style>> .button { overflow: hidden; height: 80px; background: #7fb1bf; cursor: pointer; co
css快速入门（下） 七、盒子模型 1、什么是盒子模型 margin：外边距； padding：内边框； border：边框； 2、边框 border：粗细 样式 颜色 边框的粗细 边框的样式 边框的颜色 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>盒子</title>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Co
内外边距 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--外边距的妙用：居中元素 margin: 0 auto; --> <style> #box{ wid
三角形样例： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title
大家好，今天给大家分享一下CSS的相对定位 看代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ margin: 10px; padding: 5p
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content=&quo
要求：实现基本的增删查改 第一步：新建一个项目 成功创建的样子： 项目目录如图所示： 运行效果如下所示：(该有的功能都实现了，视频暂时传不上来 footer代码： <template> <div class="todo-footer"> <label> <input type="checkbox" v-model="isCheck"/>
大家好，我们来分享CSS内外边距和div居中 看源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> /* 外边距 :使元素居中*/ #box{ width: 300px;
目录 一、盒子模型的组成和作用 二、盒子内边距（内填充） 三、盒子外边距 四、清除页面间距 五、margin和text-align的区别 六、边框的类型、颜色、厚度、总写法、分别设置 七、边框形状（圆角） 八、盒子模型的与生俱来的两个BUG 九、元素的可见性 一、盒子模型的组成和作用 盒子
BFC ：(Block Formatting Context)， 名为 “块级格式化上下文”。 BFC是一个独立的布局环境，BFC内部的元素布局与外部互不影响。 它是页面中的一块渲染区域，并且有一套属于自己的渲染规则，它决定了元素如何对齐内容进行布局，以及与其他元素的关系和相互作用。当涉及到可视化布局的时候，BF
<div> <div class="circle"></div> <div class='wrap'> <div class='ribbon'> <span>测试1</span> </div> </div> </div> <style&
移动端1px边框的问题 2019-10-21 16:38·前端技术精髓 前言 应该感觉不止一次会被涉及到关于1px的问题，其主要触发的场景就是高分屏上会把1px宽的边框显示成2px，在dpr为3的设备上，显示边框为3px. 为了避免大家少走弯路，这里简单带一下网上提到的几种方案，包括下面的: 边框的图片，b
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!-- saved from url=(0091)http://www.xa10soft.com:9091/yqtxz/scan!vi.do?db=qytxz&txzid=0a8d3f61_1641710276531_0000000 --> <ht
下载地址（完整编码+素材） 【动物相册——HTML效果-网页制作文档类资源-CSDN下载】 完整编码（无素材） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&
下边框0.5px border: { border-bottom: 1px solid transparent; border-image: linear-gradient(to bottom, transparent 50%, #eee 50%) 0 0 100%/1px 0; } 上边框 或者 全边框 0.5px .bnq-agent-fixed-btn::before { content: ' '; position: absolute;
场景 Leaflet快速入门与加载OSM显示地图： Leaflet快速入门与加载OSM显示地图_BADAO_LIUMANG_QIZHI的博客-CSDN博客 在上面的基础上，怎样使用Leaflet.contextmenu插件实现地图上显示右键菜单效果如下 注： 博客：BADAO_LIUMANG_QIZHI的博客_霸道流氓气质_CSDN博客-C#,SpringBoot,架构
html文件 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="css/index.css"/> <script src="js/jquery.min.js"></
这几天，找了很多CSS的网站，自己研究弄了个兼容性不错的框体和按钮的模板，分享给大家用一下，顺便分项一个编码的工具，都在框体里面了，因为博客园发帖会屏蔽一些js功能，所以上一篇随笔中，没有应该有的效果。废话不多说了，收下： 1 <style> 2 .cyan { 3 background-color: #34A853; /
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="css/index.css"/> <script src="js/jquery.min.js"></script&
main.js 点击查看代码 //引入Vue import Vue from 'vue' //引入App import App from './App.vue' //关闭Vue的生产提示 Vue.config.productionTip = false //创建vm new Vue({ el:'#app', render: h => h(App) }) App.vue 点击查看代码 <template> &
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> body{ margin: 0; } #top{ width:100vw; height:150px; border:1px solid blue; } #out{ width:100%; height:150%
1.水平居中 非块级元素水平居中： 设置父元素的text-align:center就可以了。 块级元素水平居中： position不是absolute也不是fixed时（也就是并未脱离文档流），margin-left=margin-right=auto,块级元素width不是auto，就可实现水平居中。 1 <!DOCTYPE html> 2 <html> 3 <meta
