Html && css
css样式 与 html
温柔于心动
来点干货吧,直面问题答案
展开
-
图片在盒子内等比展示不变形
【代码】图片在盒子内等比展示不变形。原创 2022-12-02 11:55:55 · 340 阅读 · 1 评论 -
动态绑定样式(三元表达式 动态添加类)
<template> <div> <div :class="[isflag? 'boxone' : 'boxtwo']">测试1</div> <button @click="isflag=!isflag">按钮</button> </div></template><script>export default { data() { return { .原创 2021-09-30 11:00:30 · 650 阅读 · 0 评论 -
CSS样式书写顺序以及规范
顺序1.位置属性 position, top, right, z-index, display, float 等2.大小 width, height, padding, margin3.文字系列 font, line-height, letter-spacing, color- text-align 等4.背景 background, border 等5.其他 animation, transition 等规范CSS缩写属性CSS有些属性是可以缩写的,比如padding,.原创 2021-09-15 19:49:18 · 392 阅读 · 1 评论 -
微信小程序checkbox样式修改
这个多选框修改起样式还是挺麻烦的,总结到这里,以后用的着的时候好完成快速开发,如果对你有帮助的话就收藏室下吧!<checkbox class="checkrideo"> <checkbox-group></checkbox-group></checkbox>/* 选框样式-圆型 */.checkrideo .wx-checkbox-input { border-radius: 50%; width: 35rpx; heigh.原创 2021-05-16 19:16:04 · 1441 阅读 · 1 评论 -
Vue2 Vue3中scoped样式穿透修改样式
在vue组件样式中使用scoped,相当于将样式私有化,即样式只用于与当前组件。通过该属性,可以使得组件之间的样式不互相污染。原创 2021-05-15 17:28:59 · 2177 阅读 · 0 评论 -
web前端商城项目总结(下)
接下来就是组件化的开发了,还有用到的一些小的技巧!四 布局+开发首页 ==》页面的布局+基本数据的渲染 ,这里页面的头部和底部是贯穿全文的,主要就是用过头部的导航进行页面切换的,内容商品上就是用过router.push去跳转了,还有一些css3动画登陆注册 ==》这里用到的正则匹配商品分类 ==》导航数据和商品数据的获取渲染 ,稍微难一点的就是导航数据跟商品数据的同步切换,是用变量下边同步切换的形式去解决的订单列表,我的收藏页面等等.. ==》这里就是从接...原创 2021-05-02 20:56:30 · 1144 阅读 · 0 评论 -
web前端商城项目总结(上)
项目架构(确定使用框架)首先是用的Vue框架进行组件化开发,Element框架支撑,js,css,html的代码逻辑通过ajax进行接口的请求调用,达到获取服务器数据的目的。再完美的渲染的页面。项目前(定制开发规范) 团队协作/开发 规范/统一 开发规范 命名规范 (方法名,变量名 。。) 封装规范 (功能,参数,返回值,如何使用 。。。) 项目规范(主要模块,功能模块 ,...原创 2021-05-02 19:56:54 · 2208 阅读 · 2 评论 -
css样式盒子阴影
基本概念:标签:box 负数 ado 方向 sha 正数 阴影 扩展 css box-shadow属性值h-shadow 水平阴影 正值从左向右 负值相反v-shadow 垂直阴影 正值从上往下 负值相反blur 模糊距离(模糊半径)只能为正值值越大越模糊,0为不模糊spread 阴影尺寸color 阴影颜色 省略时默认黑色inset 外部阴影 为默认(outside) ,内阴影(inset)一般省略例如:box-shadow: 水平值 垂直值 模糊值 颜色;页面代码原创 2021-04-13 11:58:05 · 183 阅读 · 0 评论 -
css样式精灵图
样式写的有点差,到时候参考下即可核心: background: url(../../../public/us-icon.png) no-repeat; background-position: 0px 1px; 这两个样式步骤:第一步先设置盒子第二步给盒子 宽, 高,背景图,浮动第三步背景图定位 background:值1 值2,第四步调盒子大小 transform:scale(值);值0-n 大于1放大 小于1缩小作品展示页面代码 &l...原创 2021-04-12 21:53:42 · 126 阅读 · 0 评论 -
css样式 单/双 行超出实现...
效果展示代码.lcp1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}给包文字的标签设置这三行样式就好了,这个是 es6的样式方法!原创 2020-12-31 20:40:33 · 335 阅读 · 0 评论 -
web 三大标准
web三大标准1.html 结构标准 2.css 样式标准 3.js 行为标准注释:要遵循W3C标准,是由万维网提出的,不是一个标准,是一系列标准的集合。原创 2020-06-01 20:47:01 · 2917 阅读 · 0 评论 -
前端 五大浏览器及内核 HTML5
Chrome浏览器 内核Blink ——谷歌浏览器IE浏览器 内核Trident (也称IE内核) ——IE浏览器Firfox浏览器 内核Gecko (也称Firefox)——火狐浏览器Safari浏览器 内核Webkit ——苹果浏览器Opera浏览器 内核Blink ——欧朋浏览器...原创 2020-06-01 20:41:28 · 617 阅读 · 0 评论 -
HTML5 水平线标签 hr
水平线标签hr属性:color 颜色 size 粗细 width 宽度 aligh 水平对齐方式 (left / right / center )默认居中对齐例:<hr color="green width="500px" size="3" align="left">noshade: 当设置为ture的时候 水平线是2D效果(纯色) ...原创 2020-06-01 20:29:23 · 3369 阅读 · 0 评论 -
HTML5 图片标签 img
图片标签 img属性:src图片路径 height图片高度 width图片宽度 border图片边框 align对齐方式(只有left 和 right)alt当图片加载不出来时显示的文字 title当鼠标划过时显示的文字两种路径: 相对路径 绝对路径相对路径:完整的描述文件所在的位置, 本地c:\ 服务器https://绝对路径:相对于目标文件位置, 下级 文件名/ 上级../ 本级 直接写...原创 2020-06-01 20:14:45 · 497 阅读 · 0 评论 -
跑马灯 marquee标签教程
跑马灯:marquee<marquee behavior=" " direction=" " width="300" height="50" bgcolor=" " >内容</marquee>注释:marquee属性1.direction滚动方向 值 :up down left right2.height高3.width...原创 2020-05-01 20:19:10 · 536 阅读 · 3 评论 -
HTML5 特殊符号大全
title:即是标题也是注释属性face:设置字体hr:水平分割线b/strong:加粗标签br:强制换行i/em:倾斜标签big/small:大小u:下划线 ;:小空格 &emsp;:一个字符的大空>; <; :大于号 小于号©;:版权符号 &am...原创 2020-05-01 20:06:54 · 2302 阅读 · 1 评论 -
三种列表标签教程大全
一、有序列表<ol> 可以插入type(类型)="取值(1 A a I i) " start=" "是从第几开始 reversed倒序的意思 <li></li> <li></li></ol>注释:ol是有序列表标签,li是列表的项目。二、无序列表<ul&...原创 2020-05-01 18:48:02 · 804 阅读 · 2 评论 -
HTML5 的初始框架及解析
网页的初始框架<!DOCTYPE html><html> <head> <meta chaset="UTF-8"> <title>这里是网页标题</title> </head> <body> 这里是网页的...原创 2020-04-28 20:49:55 · 343 阅读 · 1 评论