1、a標簽的選擇問題 需要修改帶class的a標簽的hover的文字顏色，方式如下

<style>a.egHyperlink:hover{color:red;} </style> <a href="#" class="egHyperlink">smile</a> 復制代碼

2、hr分割線 需要一條粉紅色的分割線，寬度1px

<style>hr{height:2px;border:none;border-top:1px solid #00BFFF;} </style> <hr> 復制代碼

展示效果如下：

---

3、圖片環繞文字

<div> <img src="https://user-gold-cdn.xitu.io/2018/5/10/1634933fa3100474?w=1039&h=579&f=png&s=16869" width="50%" style="float:left;border:1px solid #00BFFF;margin:0 10px 0 0;"/> <p>What I want to accomplish is for the text to be aligned with the top and left side of the floated img and to wrap immediately underneath with no margin. When I comment out the padding in 'p' the image has no bottom margin, but I want the padding property to be active in my stylesheet.What I want to accomplish is for the text to be aligned with the top and left side of the floated img and to wrap immediately underneath with no margin. When I comment out the padding in 'p' the image has no bottom margin, but I want the padding property to be active in my stylesheet.</p> <div style="clear:both;"></div> </div> 復制代碼

效果如下：

What I want to accomplish is for the text to be aligned with the top and left side of the floated img and to wrap immediately underneath with no margin. When I comment out the padding in 'p' the image has no bottom margin, but I want the padding property to be active in my stylesheet.What I want to accomplish is for the text to be aligned with the top and left side of the floated img and to wrap immediately underneath with no margin. When I comment out the padding in 'p' the image has no bottom margin, but I want the padding property to be active in my stylesheet.

4、顏色的值，遇到過幾次需要使用顏色而又不是特別嚴格要求使用某一種顏色的問題，這個時候可以自己選擇，今天先更新一個，以后遇到就記下來

#00BFFF rgb(2, 221, 223) 文字顏色， rgb(75,75,75)

5、@media screen問題 總是遇到需要使用@media screen來區分設備的問題，卻總是忘記代碼，腦子啊，css樣式要寫在{}內

# Mobile @media screen and (min-width: 480px){}# Tablet @meida screen and (min-width: 768px){}# Desktop @media screen and (min-width: 992px){}# Huge @media screen and (min-width: 1280px){} 復制代碼

或者

# Phone @media screen and (max-width:320px){}# Tablet @media screen and (min-width:321px) and (max-width:768px){}# Desktop @media screen and (min-width:769px){} 復制代碼

轉載于:https://juejin.im/post/5af3fe12f265da0b8336c4ef

總結

以上是生活随笔為你收集整理的工作中的小问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。