廓线(outstyle)
比较常见于表单和链接等 。
outline-style:none; 取消谷歌、360等蓝色边框
:focus 获得焦点的状态, 鼠标的光标就是焦点
.username:focus{ /*获得焦点的状态*/
border:1px dashed pink;
background-color:#FFF7FB;
color:pink;
}
取消表单边框
因为表单在不同浏览器里面, 以后不同的显示方式。
所以, 一般情况下, 我们会把所有的表单都去掉边框。
border: 0 none; 兼容性更好的写法
Label 标签
<label for="txt">搜索一下</label>: <input type="text" id="txt" class="search" value="请输入..." />
这样, 我们点击搜索一下, 光标就跳到了相应id的 input 里面了
完整实例:
.表格的宽度 高度 边框 <width> <height> <border>
2.表格的背景颜色和图片 <colcr>颜色背景图片颜色可通过<background> <bgcolor>背景颜色
3.表格以及单元格内容的对齐方式 <aligh>分为<right>右对齐 <center>居中对齐 <left>左对齐
4.单元格的填充和间距 <cellspacing>间距 <cellpadding>填充
5.<font>标签可以设置字体字号以及颜色
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>优化表格</title>
</head>
<body>
<table border="0" width="395" cellpadding="0" cellspacing="0">
<tr>
<td colspan="4" background=""><font color="white"></font><b> 本周畅销笔记本排名top3<font></font></b></td>
</tr>
</table>
<table>
<tr>
<td>
<table>
<tr>
<td colspan="2">京东超市/td>
</tr>
<tr>
<td colspan="2">< img src="img/1.jpg" alt=""></td>
</tr>
<tr>
<td>< img src="img/人.png" alt=""></td>
<td>< img src="img/罗宾.jpg" alt=""></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
者:悦然wordpress建站(悦然建站)
继续分享wordpress建站教程。之前悦然建站给大家分享过Contact Form 7表单插件,这款插件虽然好用,但是它默认的表单样式都是最简单的,不是很好看。想要修改表单模块的样式一般有两个方法,一个是使用CSS,另外一个是使用wordpress插件。使用CSS会比较复杂,这里就不多说了,会的都会,不会的也不是简单几句话能讲清楚的,接下来悦然建站还是介绍使用插件修改的方法,如上图就是使用插件美化过的表单。
今天给大家分享的wordpress插件是WOW Style Contact Form 7,这是一个专门配合Contact Form 7表单插件使用的。
WOW Style Contact Form 7插件是需要收费的,不过免费的也能用,但只能设置一个表单,免费够用,如果感觉好用也可以选择购买。插件可以直接在wordpress建站后台搜索下载安装。
安装之后进入插件设置,它会自动识别出Contact Form 7创建的表单,选中对应的表单,然后在左边设置效果就可以了,可以设置表单背景(付费版功能)、字体、边框、按钮样式等等,功能很丰富,而且设置页面可以与原来的样式相互对照,觉得效果满意之后保存即可。插件的具体使用大家可以安装体验一下,并没有什么操作上的难点,点点鼠标即可。
*请认真填写需求信息,我们会在24小时内与您取得联系。