html中 按钮样式 怎么把按钮的边框阴影去掉 - 已解决

html-css07

html中 按钮样式 怎么把按钮的边框阴影去掉 - 已解决,第1张

直接重新给它设置border样式，或者用背景图片，把border设置为none。

1.html是超文本标记语言，标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

2.超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

3.万维网上的一个超媒体文档称之为一个页面（外语：page）。作为一个组织或者个人在万维网上放置开始点的页面称为主页（外语：Homepage）或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接）。

如果想在保留边框的情况下去掉边框上的阴影，设置边框为实线即可，button边框默认是双线，就会出现一个很难看的立体效果，我就查了查api，发现边框分着双线和实线，如果边框有双线，那这和出现的场景一样啊，我就再次设置成实线了发现。。。。。。。那个恶心的虚影没了，而且保留了边框。

边框阴影（box-shadow）的基本语法：

box-shadow：color  h-shadow  v-shadow blur spread  inset；

color：阴影颜色 ------------ 可选

h-shadow ：水平偏移量 ----必选       

v-shadow：垂直偏移量-----必选

blur：模糊距离 -------------可选

spread：阴影尺寸---------- 可选

inset：内阴影 --------------可选

例子：

css部分：

.div1{

width:200px

height:200px

margin:20px auto

line-height: 200px

text-align: center

background: cadetblue

border:2px solid darkslategray

box-shadow: darkgrey 10px 10px 30px 5px //边框阴影

}

html部分：

<div class="div1">边框阴影示例</div>

效果如图：