1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title></title> 6 <style type="text/css"> 7 8 .list1 { 9 float:left; 10 list-style: none; 11 /*border: 1px solid black;*/ 12 wid
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Comp
在vue项目中使用 bpmn流程图 1、安装插件 cnpm install bpmn-js --save 2、在main.js引入 import 'bpmn-js/dist/assets/diagram-js.css'; import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'; 3、在需要流程图的页面引入 impo
6.定位 6.1 相对定位 6.2 绝对定位 6.3 z-index <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>默认情况</title> <style> div{ margin: 10px; padd
[css] 请描述margin边界叠加是什么及解决方案 1,使用padding代替,但是父盒子要减去相应的高度 2,使用boder(透明)代替(不推荐,不符合书写规范,如果父盒子子盒子时有颜色的不好处理) 3,给父盒子设置overflow:hidden(如果有移除元素无法使用) 4,给父盒子设置1px的padding 5,给父盒子设置1px
一、什么是盒子模型 CSS盒子模型:CSS 假定所有的HTML 文档元素都生成了一个描述该元素在HTML文档布局中所占空间的矩形元素框,可以形象地将其看作是一个盒子。 它包括以下几个部分: margin:外边距border:边框padding:内边距 二、边框 边框的粗细边框的样式边框的颜色 <!DOCTYPE h
/* padding也是上右下左四个方向 */ /* 覆盖写法 */ /* padding: 5px; padding-left: 1px; */ /* 一次性给出四个方向的设定 */ padding: 5px 5px 5px 1px; 练习: <head> <style type="text/css"> a {
[css] 为什么说不提倡用1px的小尺寸图片做背景平铺? 因为明明可以用background-color就能搞定的事情为什么要用图片? 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题
使用css3的flex模型实现一个居中布局 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>flex居中布局</title> 6 <style type="text/css"> 7 html, 8 body { 9
ui设计图大概长这样↓ 因为这是在表格里展示的对应的样式的,我直接写成了一个组件 下面是一个.vue文件,可以直接使用 <template> <div class="column-row"> <!--#409eff--> <div class="one">{{ column[0] || '' }}</div> <!--#58BE67-->
效果: 实现: 定义标签, .result是显示计算结果框,.anniu里放数字和运算符按钮,.zero是清除按钮,它们都在表单域 form里: <form class="kuang" name="kuang" > <input type="text" class="result" name="result"> <div class=&qu
在retina屏中,像素比为2(iPhone6/7/8)或3(iPhone6Plus/7Plus/8Plus),1px的边框看起来比真的1px更宽。 本文默认你已经对视口、物理像素、逻辑像素、设备像素比、css像素等移动端基本概念已经解。 产生原因 设备像素比:dpr = window.devicePixelRatio = 物理像素 / 逻辑像素。 在ret
前端基础学习-(1)京东顶部导航条 作为前端学习的小白,个人在学习过程中认知:京东导航条使用到了浮动(float)、定位(position)、垂直居中、图标引用等知识。 实现效果 代码实现 html代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta n
horizontal line and right way to code it in html, css I need to draw a horizontal line after some block, and I have three ways to do it: 1) Define a class h_line and add css features to it, like #css .hline { width:100%; height:1px; background: #fff } #h
块级元素:独占一行 h1~h6 p div 列表… 行内元素: 不独占一行 span a img strong … 行内元素可以被包含在块级元素中,反之则不可以 display: <!-- block 块元素 inline 行内元素 inline-block 是块元素但是可以内联,在一行! --> <style>
带斜线的表格, 这个 经常使用但是每次还得找 所以记录下来,下次有需求直接 copy~~ 上结构 ====================================== HTML 结构 =========================== <div class="tabwidth"> <table> <tr class="theader
2020终于要过去了,给博客园更换一个新皮肤,2021年新年新气象。 Silence:https://esofar.github.io/cnblogs-theme-silence/#/?id=cnblogs-theme-silence 专 注 于 阅 读 的 博 客 园 主 题 备份下原来基于SimpleMemory主题 + 部分定制化的代码。包含回到top、文章自动生成目录的功
<div class="frieght-list"> <ul> <li v-for="(item, index) in freightList" :key="item"> <div class="list-item"> <div class="list-header" @click=&quo
IE8 下bootstrap的兼容问题 IE8不支持bootstrap栅格化布局,都用col-xs的列布局来实现。 css+div宽度在标签内部设置style属性修改 一些bootstrap中的样式在IE中不起效要在@media媒体查询不同分辨率中写出来 ie下响应式的宽度设置问题: @media (min-width: 768px) { .container {
(承上启下) 网页布局的本质就是: 利用CSS设置好盒子的大小, 再进行盒子的摆放, 最后把网页元素(文字、图片等)放入盒子里。 ----------------------------------------- 14.1 盒子模型(四部分组成:内容content、边框border、内边距padding、外边距margin) 14.2 边框(可以单独指定哪一边)
CSS 一:技术介绍 CSS是【层叠样式表单】。适用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记语言。 二:语法规则: 选择器{属性:值} 选择器:浏览器根据“选择器”决定受CSS样式影响的HTML元素(标签)属性:是你要改变的样式名,并且每个属性都有一个值,属性和值被冒号分
LESS学习笔记 初次邂逅Less 什么是Less Less是一种动态样式语言,属于CSS预处理器的范畴,它扩展了CSS语言,增加了变量(variables)、混合(mixin)、函数等特性,使CSS更容易维护和扩展。Less可以在客户端上运行,也可以借助Node.js在服务端运行。 Less中文官网:http://lesscss.cn/ 英文
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> .border-wrapper { position: relative; margin: 100
https://stackoverflow.com/questions/38369015/customuzing-qtabwidget-with-style-sheets QTabWidget::pane { border: 1px solid lightgray; top:-1px; background: rgb(245, 245, 245);; } QTabBar::tab { background: rgb(230, 230, 230); border: 1px s
css3 就是css第3个版本 增加了一些选择器,布局,动画,背景,新盒模型,私有前缀; 选择器 表单选择器 :focus 聚焦选择器 选择的是当下被聚焦的表单元素 input:focus {} :checked 勾选 选择的是当下被勾选的复选框或单选框 input:checked {} :disabled 选择的是当前被禁用的元素 :en