Kiểu hộp văn bản mặc định và chiều rộng

Question

IE7 và FFox dường như hiển thị hộp văn bản hơi khác nhau theo mặc định.

Điều này có vẻ cố định bằng cách đặt thuộc tính css kiểu đường viền và đường viền của chúng.

Điều kỳ lạ là, có vẻ như trong số tất cả các tùy chọn vstudios intellisense cho tôi, không ai trong số họ phù hợp?

Gần nhất tôi đã tìm thấy là

border-width:1px; 
border-style:inset; 

Edit: Đang cố gắng để thiết lập phong cách cho một textbox, tất cả họ đều xuất hiện để render khác nhau trong các trình duyệt khác nhau.

Answer 1

Theo Firebug, phong cách mặc định cho một textbox trong Firefox là

border: 2px inset #EBE9ED; 

Answer 2

Có lẽ bạn sẽ không tin tôi, nhưng tôi cố gắng này:

<input style="border:default"> 

và nó hoạt động trong Windows Internet Explorer 8, Firefox 3.6.22 và Chrome 14.0.835

Tôi nghĩ rằng <input style="border:XXX"> <input style="border:XXX"> cũng hoạt động. Vấn đề là nếu bạn sử dụng kiểu đường viền không hợp lệ, thì hộp nhập sẽ trở về kiểu viền mặc định của nó.

Answer 3

Xin lỗi, tôi đã sai. Nếu bạn sử dụng kiểu đường viền không hợp lệ, thì hộp nhập liệu sẽ bỏ qua nó và nó sẽ không thay đổi.

Gần nhất tôi đã tìm thấy là

border:inset 2px #EBE9ED; 
border-right:solid 1px #CCCCCC; 
border-bottom:solid 1px #CCCCCC; 

Nhưng đó là khác biệt so với phong cách mặc định trong 3 trình duyệt

Answer 4

Đây là câu hỏi đầu tiên/kết quả mà đi lên qua Google khi tìm kiếm này loại điều, vì vậy tôi nghĩ rằng tôi sẽ cung cấp câu trả lời tôi đang tìm kiếm cá nhân.

câu trả lời là đặt kiểu thành '' hoặc "";

Nếu điều này là không rõ ràng, tôi đang cung cấp một ví dụ liên quan đến javascript/jquery, giả sử bạn nhận được điều đó ở cấp độ cơ bản. Đương nhiên, hộp bắt đầu theo mặc định. Giả sử tôi thay đổi mã đó bằng mã màu đỏ, khi ai đó nhấp vào hộp văn bản đó ...

$("#phoneBox").focus(function(){ 
     document.getElementById('telephone').style.border = '1px solid red'; 
     } 

Điều đó sẽ đặt thành người đỏ nhấp vào hộp văn bản đó. Bây giờ, tuy nhiên, giả sử tôi muốn đặt nó trở lại bình thường khi ai đó nhấp chuột ra khỏi hộp

$("#phoneBox").blur(function(){ 
     document.getElementById('telephone').style.border = ''; 
     } 

Hộp này sẽ trở lại kiểu mặc định vì nó không có giá trị để tắt.

Trong CSS của bạn, chỉ cần

border:''; 

hoặc phải được triệt để,

border-style:''; 
border-width:''; 
border-color:''; 

sẽ làm mặc định trong bất kỳ trình duyệt. Tôi hy vọng rằng điều này có ý nghĩa/giúp đỡ người khác.

Answer 5

Nắm bắt tất cả, thuộc tính viết tắt là border Thuộc tính CSS là một thuộc tính viết tắt để đặt các giá trị thuộc tính biên giới riêng lẻ cho một hoặc nhiều: border-width, border-style, border-color.

Giá trị ban đầu là border-style là none. Điều này có nghĩa là nếu bạn thay đổi border-width và border-color, bạn sẽ không thấy đường viền trừ khi bạn thay đổi thuộc tính này thành một thứ khác ngoài none hoặc hidden.

Giá trị ban đầu là border-width là medium, nhưng đặc điểm kỹ thuật không xác định chính xác chiều rộng tương ứng của nó. Ví dụ: trình duyệt Safari của tôi hiện đang hiển thị medium dưới dạng chiều rộng 3px;

Giá trị ban đầu của border-color là currentColor, từ khóa này thể hiện giá trị được tính của thuộc tính màu của phần tử. Nó cho phép tạo các thuộc tính màu được thừa kế bởi các thuộc tính hoặc các thuộc tính phần tử của con không thừa hưởng nó theo mặc định.

Điều đó nói rằng, luôn nhớ rằng nếu mặc định của bạn có vẻ khác, có thể một số thuộc tính được khai báo từ một số khai báo khác, đó là khai báo tác nhân người dùng, khai báo bình thường của người dùng, khai báo bình thường của tác giả, khai báo quan trọng của tác giả hoặc khai báo quan trọng của người dùng. Khi các thuộc tính khác nhau áp dụng cho cùng một phần tử, các bộ chọn cụ thể hơn sẽ ghi đè lên các phần tử khác và khi một số khai báo có cùng trọng số, nguồn gốc và độ đặc hiệu, thứ hai trong thứ tự nguồn sẽ thắng. Các khai báo trong các bảng định kiểu được nhập được coi là trước bất kỳ khai báo nào trong bản định kiểu.

TL; DR?

Giá trị mặc định là border: medium none currentColor; nhưng điều đó hợp lệ miễn là không có bộ chọn hoặc khai báo nào khác được áp dụng.