style
Thuộc tính style cho phép đặt kiểu mẫu cho một phần tửđơn lẻ tại một điểm trong tài liệu tại nơi phần tửđược đưa ra. Tham chiếu đến như là một kiểu mẫu bên trong (“inline style”), đặc trưng này là một phần mở rộng trong XHTML MP. Nó cho phép áp dụng các kiểu mẫu cho các phần tử riêng lẽ, do đó được ưu tiên hơn bất
kỳ kiểu mẫu nào khác được định nghĩa trong các phần tử <style> trước đó hay các bảng mẫu ngoài:
<p style="color:red”>red</p>
Một hạn chế của việc chỉ ra các kiểu mẫu bên trong là nó làm cho việc tìm kiếm và thay đổi tất cả sự cố của mẫu khó khăn. Một hạn chế khác là việc sử dụng chúng có thể làm tăng kích thước của tài liệu nếu như được sử dụng nhiều lần để thay đổi các kiểu mẫu của cùng một phần tử tại những nơi khác nhau bên trong tài liệu.
Sẽ tốt hơn nếu định nghĩa một lớp chứa các kiểu mẫu mà ta muốn áp dụng cho nhiều phần tử, chẳng hạn như sau:
.class1 {padding-bottom:4px}
Lúc này ta có thể áp dụng kiểu mẫu định dạng một cách dễ dàng chỉ cần định nghĩa định dạng tại một vị trí (trong bảng mẫu). Ví dụ, để áp dụng kiểu mẫu này cho một phân đoạn riêng biệt nào đó, bạn có thể sử dụng thuộc tính class bên trong phần tửđoạn và chỉ ra giá trị của thuộc tính này chẳng hạn là “class1” nhưđược mô tả bên dưới:
<p class="class1">This paragraph will have bottom padding. </p>
id
XHTML cùng với WAP CSS có thể cho phép bạn giữ các định nghĩa mẫu của mình tại cùng một điểm (trong một bảng mẫu hay trong một đoạn mẫu bên trong phần tử <head>), ngay cả khi bạn muốn áp dụng một mẫu cho một phần tử đơn nhưng không ảnh hưởng đến các phần tử khác cùng một lọai.
Ví dụ như bạn có thể định nghĩa một mẫu cho một phần tử <h1> riêng lẻ trong một đoạn mẫu bên trong phần tử <head> như sau:
<head> <style>
#myid {border-width: 1; border: solid; text-align: center}
<style> </head>
và sau đó áp dụng mẫu này cho một phần tử <h1> riêng như sau:
<h1 id=”myid”> This heading has a solid order.</h1>
div và span
Ngoài việc áp dụng các kiểu mẫu cho một nội dung được đưa ra bằng một hay nhiều phần tử như đã được bàn đến ở trên, bạn cũng có thể sử dụng các mẫu, được định nghĩa trong bảng mẫu hay bên trong phần tử <head>, cho một chuỗi các phần tử sử dụng phần tử div hay một chuỗi các các ký tự bên trong sử dụng phần tử span. Ví dụ một bảng mẫu chức các giá trị sau:
<style type=”text/css”>
div.test-case {text-align: center; color: blue} span.test-id {color: red}
</style>
Bên trong phần thân tài liệu, bạn có thể áp dụng kiểu mẫu được đưa ra bởi phần tử div cho một chuỗi các đoạn văn và kiểu mẫu được đưa ra bởi phần tử span cho một chuỗi các ký tự như sau:
<div class=”test-case”>
<p>This paragraph is blue.</p>
<p>Here are <span class=”test-id”>Test51 and Test52</span> specs.</p>
Trong đoạn code ở trên, phần nội dung của cả hai đoạn văn được canh giữa và sử dụng font chữ màu xanh, ngoại trừ chuỗi ký tự “Test51 and Test52”, được sử dụng font màu đỏ.