-
chrome 默认margin8
reset.css 统一所有浏览器的样式，避免各浏览器默认样式不同，出现适配问题。
mac pro 1340
查看全部 -
dt dl dd
查看全部 -
1、class="header" & class="content"，页面头部&内容区元素构建：
（1）class="xxx-box"：xxx元素区域的容器，如：
class="search-box"：搜索区域； class="logo-box"：logo区域；class="menu-box"：菜单区域；class="slider-box"：轮播图区域；class="ad-box"：广告区域；class="info-box"：信息区域；
（2）class="xxx-bar"：xxx元素栏，如：
class="search-bar"：搜索栏
（3）class="wrapper"：封装类；通用的，可复用（可写入#common）
2、注意事项：
使用button标签时，需要添加button的type，便于各浏览器兼容，即：
<button type="button"></button>
查看全部 -
1、页面构建顺序：html，css，js
2、html创建：
（1）页面容器设置
A、div：容器标签 <div></div>，div的命名要体现位置、层次、作用
B、页面div基本层级
class="comtainer"：【comtainer】页面中最大的容器，包含页面内所有的元素
class="nav"：导航区；【nav】=navigation 导航
class="header"：页面头部，logo，搜索等
class="content"：内容区
（3）class="nav"，导航元素框架搭建
创建无序列表&信息：
<ul> <li>信息</li> </ul>
3、VS-Code快捷键：
html元素*数字：快速创建几对html元素标签，如：
div*数字
li*数字
查看全部 -
在cart-btn里 购物车的文字图标和"我的购物车"字体在用line-height和heigth实现垂直居中时有一个需要注意的地方是即使行高和高度设置了一样，但字体还是会稍微向下偏移，这是由于文字图标也是文字的一种，但line-height指的是文字中心到上下边框的距离，所以可以在文字图标的样式中加入 vertical-align: middle; 实现在水平方向的居中。
查看全部 -
common.css：存放首页公共CSS样式代码
index.css：首页一些独特样式
reset.css：各种浏览器不同属性的
网站首页引用css样式的时候要注意引入顺序，先引入reset.css，再引入common.css，最后再引入index.css
http://necolas.github.io/normalize.css/
同步浏览器http://browsersync.cn
查看全部 -
头部宽度占满屏幕，内容宽度固定，随着网页的缩窄而改变布局。这样不同宽度的电脑浏览器，都能看到合理的布局，做到最大范围的适配。无论是小屏幕还是如iMac那样的大屏幕。大屏幕与小屏幕一样需要重视适配问题。
快捷输入 div*3,一次创建3个div
查看全部 -
button按钮最好加上type=“button”，以便更好地适应各种浏览器。
查看全部 -
初始化浏览器样式
查看全部 -
骨架搭建2
查看全部 -
<link rel="stylesheet"
表明引入的是css样式文件
查看全部 -
index.html
css
js
img
reset.css初始化浏览器文件
查看全部 -
先将内容填入框架，再为内容定义样式
查看全部 -
asfdsf
查看全部 -
使用vscode代码编辑器的小技巧：
vscode可以快速创建各种标签，例如div*3快速创建三个div标签；
当有多个标签内容相同时，可以按住Alt键选中多个标签进行编辑
实现小竖线可以利用伪类:after来执着具体代码如下：
.nav-box ul li::after{
content: "";
width: 1px;
height: 14px;
background: #cccccc;
position: absolute;
top: 8px;
right: 0;
display: block;
}
去除后面的一个下划线可以使用:not(last-child)实现：
.nav-box ul li:not(:last-child):after{
content: "";
width: 1px;
height: 14px;
background: #cccccc;
position: absolute;
top: 8px;
right: 0;
display: block;
}
查看全部
举报