前端js与CSS一直是自己的一个痛点。只能说尽量多学一点吧。

这里有几点对自己的总结：

①当一个标签中有多个样式的时候，我们可以设置一个为最高等级，那么就会将这个样式展示出来。

添加!important; 属性。

style="width:180px  !important;"

②在调试的时候要整体调试，先要找到是哪个组件。

<ul class="search_content">
<li style="width:245px; ">项目编码： <input class="form-control" name="projectCode" id="projectCode" value="http://www.mamicode.com/${project.projectCode }" style="width:180px  !important;"></li>
<li style="width:245px;">
	项目名称： <input class="form-control" name="projectName" id="projectName" value="http://www.mamicode.com/${project.projectName }"   style="width:180px  !important;">
</li >
<li style="width:270px;">
归属产品线：
<select class="form-control" id="sectorId" name="sectorId" >
		<option value="">---请选择---</option>
		<c:forEach var="bizCodeKeyValue" items="${listOrganization }">
			<option value="http://www.mamicode.com/${bizCodeKeyValue.id}" <c:if test="${project.sectorId == bizCodeKeyValue.id}"> selected</c:if>>${bizCodeKeyValue.orgName}</option>
		</c:forEach>
   </select>

</li>
<li style="width:270px;">项目阶段：<sccl:selectBizCodes category="PROJECT_PHASE" name="projectPhase" id="projectPhase" selected="${project.projectPhase }"></sccl:selectBizCodes></li>
</ul>

③一般情况下不修改公共的css文件。而是单独修改，因为你不知道会不会影响到其他的。

④调试的时候一定要用好浏览器的调试功能，在页面中调试好大小，然后再修改代码。

⑤向前端人员请教。

【自动获取焦点】

<input name="j_username"  id="loginId" type="text" autofocus >

本文出自 “JianBo” 博客，转载请与作者联系！

前端--CSS